The size of digital displays has shrunk and expanded all over the map, making design for the web today much more complicated. We’re discovering that what renders well on a desktop computer, may not render the same way on mobile or tablet devices. In a very short time technology has gone from two sizes of computer screens, desktop and laptop, to an ever expanding range of devices that run from mobile to tablets to laptops to large screen desktops; all with their own screen sizes, browsers, and personal settings.
It has become both a marketing professional’s and web designer’s nightmare. Web designers tried at first to simply design a desktop “version” for the large screens on desktops and laptops, and then a small “version” for displays on mobile devices. But two aren’t enough these days with the array and variety of sizes that are flooding the market.
Why is this a concern for marketing professionals? Content is being lost on devices outside the layout design of the desktop website. We’re looking at logos or important images being cut off, and text wrapping strangely or running off the screen completely. And the cost of developing device specific applications, like the iphone website, for each of the ever expanding number of devices on the market is prohibitive.
Responsive Websites “Respond” To Their Environment
Enter Ethan Marcotte. His vision compares architectural design with web design. Architecture is fixed, like print, with a foundation that is solid, rigid, unchanging. It’s a discipline defined by its permanence. In print, designers design for a physical space much like the footprint of a building, which is then defined by its frame and shaped by its façade.
Unlike architecture, or print, the web doesn’t have the same constraints. “Working on the web is a wholly different matter” according to Marcotte. Its “inconsistent window widths, screen resolutions, user preferences, and our user’s installed fonts are but a few of the intangibles we negotiate.” Websites should be designed with an understanding of the web’s ebb and flow of moving parts.
Marcotte’s solution is to build “responsive websites,” where the parts move to fit the screen. They “respond” to their environment. So instead of designing applications for each type of device, you design applications that fluctuate based on the type of device being used. For example, if you open an article on a responsive design site on your desktop browser and change the size of the window to be thinner or wider, you will see the layout magically adjust itself to fit the new size.
Flexibility In Response Is The Wave Of The Future
Mobile browsing is trending to outpace desktop based browsing in the next three to five years so we will continue to see development. But what’s particularly interesting is to see how the development of adaptive structures is not being confined to just the web. Architects are currently designing conference rooms with windows that turn opaque when a certain number of people are in the room, or lights and sound changes to accommodate the number of people and level of noise.
The team at ZOOM Cross-Media is supporting responsive site design.
For more information contact Janet@zoomcrossmedia.com
Read more info from industry leaders
Ethan Marcotte http://ethanmarcotte.com
Jeremy Keith https://twitter.com/adactio