It used to be the case that online learning materials were specified with a particular screen size. At one point this was 800 x 600, then 1024 x 768.
But, these days, unless you’re in a very controlled environment, you really don’t know what size screen your learners may be using.
Some may have 24″ widescreen displays, or larger, with resolutions of 1920 x 1080 (or even greater). Others may be using tablet devices, and some even coming in on their mobile devices.
Any initiative that involves putting materials or applications onto the web, to be viewed via a browser, must take into account the variety of user devices.
It’s not good enough now to expect users to scroll sideways, or to zoom their screens in order to view what you produce.
The current best practice is to use a technique known as Responsive web design.
This has three characteristics:
If you’re working with external suppliers, and have a target audience with multiple devices, then make sure your suppliers understand Responsive web design. Ideally they will have adopted a standard framework (a starter set of files) that allows them to focus on your content rather than on the nitty-gritty of making the pages responsive.
If you’re building things internally, then consider adopting one of the many existing Responsive design frameworks.
At the moment, I would tend to adopt Bootstrap as my starting point. It’s built by the team behind Twitter, is extremely well supported, comes with lots of built in functionality, and is very easy to start using quickly.
For more see: A look at Responsive CSS frameworks
Posted: 18 February 2013