Designing for All Devices

Why You Should Be Designing for All Devices

When you settle down to browse the web, you may be doing so from a conventional desktop PC with a widescreen monitor, you may be glancing at Facebook from a 7 inch Android tablet, or you might be checking out an address from your iPhone. For designers this incredible range of options in which to view a website means that a whole new way of thinking about web design is required. As the people responsible for setting up what a user sees, we have to think about the size of a device and what is important to the visitor using that device.

Once upon a time, the average screen size was relatively standard.  Times have changed rapidly, and for today’s designer the end product may need to be displayed on a 4 inch wide screen along with a 23 inch screen all on one site. Not only do screens differ in size and how they are used, but they can also be turned from landscape to portrait in one motion, creating a whole new challenge for design and layout.

In the past we’ve designed for a vertical scroll, but now Windows 8 users are panning to the right for a different use of the touch-screen mechanism, an option that some viewing screens have, while others do not.  Good design habits in the past become essential now, such as working within a grid system to keep shifting content moving in a controlled and coherent way.

As technology continues to march forward, new features are always popping up. To give an example, devices with Windows 8 have live tiles for apps – the new way to notify followers that their favorite organizations have something to share with them.

High-Density Displays

“Retina” is Apple’s brand name for its new double-density screens, but other manufacturers are creating similar displays under their own names. The technology is used in iPhones, MacBook Pros, and other high-end devices.

The device reverts to a standard resolution of 1,440×900 but the additional pixels can be used to make fonts and graphics appear smoother. While not everything caters to them now, these double density screens will eventually migrate to all devices. There is little reason to fret now, but there’s no harm in some forward planning on how to tackle the new challenge.

Speed

Many users will be using smartphones or tablets on slower mobile networks with limited bandwidth availability, so detecting the connection speed may ultimately be more beneficial than determining the pixel density. For this reason, a website must be optimized for page loading speed – a focus that we as designers shrugged off through the years, as broadband became mainstream. But even on tiny devices, fast and optimized pages lead to higher visitor engagement, retention, and conversions. There are tools designed to measure and help maintain speed optimization. Google’s PageSpeed Insight products will help you identify performance best practices that can be applied to your site, while its optimization tools can help you automate the process.

With continually enhanced technology and all manner of devices in which to use it, design will continue to be a challenge. Foresight and preparation will head off new display surprises and make it easier for us here at Appletree Mediaworks to create a perfect design for you, no matter what your preferred device.