“I need a new website that will work on all devices, including iPhone, Android, tablet, and desktop. It would also be nice if it was optimized for TV, and could work on my BlackBerry.
I also heard that a new device will be available soon with a display of six inches. The site needs to work on that, too.”
This is a bit extreme, but we’ve all heard similar requests.
Is a project of the scope described above—one incorporating current and future device specifications—even possible? Are we able to build something that will work now and be smart enough to adapt in the future?
When we think about what it means to “work on future devices,” we shouldn’t assume that it would simply render, it needs to respond to the new device’s screen size, bandwidth limitations, browser differences, context, hardware, and languages. In order to create these projects, adaptive design, as opposed to simple responsive design, has proven itself a better fit for allowing the flexibility necessary to adapt to the multi-device environment of today (and tomorrow).
From Resolutions to Multi-Device Let’s face it, a client’s audience is not going to use the same devices next year as it does today, and this needs to be considered in the initial development processes. Development is not a one-and-done scenario, and it’s necessary to allow room, and time, to adapt.
It’s hard to remember, but as recently as a decade ago we did not have today’s variety of devices. However, we had similar development conversations. Before iPhones, Android phones, and tablets, we still had to consider the project’s resolution (800x600, 1024x728, or higher). Similar to the way we want a website to work on all devices today, we wanted them to work on all resolutions years ago.
When it came to resolution, many thought that the best approach was to design in the lowest resolution, keeping the most important content visible. As the resolution grew, we started to review and add more content. Another approach was to create fluid websites that adapted their width depending on the resolution and screen size. This had the side effect of lots of pages with awkward layouts, ridiculous paragraph sizes that were almost impossible to read, and big empty spaces that altered the layout and practically destroyed the planed design. Some developers tried to fix this by centering and fixing the width, but that could generate horizontal scroll, which can still be difficult, even with new generations of devices that allow for it.
This resolution issue blew up when smartphones and tablets hit the market. We went from having three or four resolutions to consider to almost 20 by late 2012. New devices now have different operating systems, browsers, resolutions, and navigation features. We can also now work in landscape or portrait screen orientations. Designers now needed an adaptive design approach that would works in this increasingly complex environment.