Way back in early 2010, the excellent A List Apart published an article entitled ‘Responsive Web Design’ which discussed the very early implementations of something we now accept as default: the media query and the idea of a website which adapts its layout to fit better on different sized screens. The technology on both sides was in it’s relative infancy- mobile phones and indeed the networks which supported them were crude and slow by today’s standards, and the browser support and limitations of CSS and HTML were starting to run out of road when it came to encompassing the needs of the next generation of smartphones and tablets.
Nearly five years on, with smartphone and tablet use far outstripping desktop and laptop use, we’re now firmly in the age of the mobile device, and we’re facing a whole host of new challenges for designers. But are these really new challenges? or simply a logical shift of priorities? I’m going to take a look at some of the challenges and opportunities the future of responsive design might hold
What is Responsive design?
Initially when the term was coined, it was intended to describe a website design which could adapt itself to the different available screen sizes it might be displayed on. Up until this point, the best we had available was to query what browser the viewer was using, and if it was a browser specific to mobile, to display a different website. This at best meant two website structures had to be designed and maintained. At worst, it meant two separate websites for those clients who didn’t have a Content Management System in place capable of serving the data to two different sites.
As the concept progresses and available technology embraces this discipline however, ‘Responsive’ is no longer as simple as adapting to the bewildering array of different screen sizes and resolutions available. We’ve now got a lot more data on our users than we did, and as analytics reveal trends and browsing habits, we can really look into the needs of our users. Future responsive design will need to tap in to this data to stay relevant- by not just adapting to what screen users are viewing the content on, but to a wealth of personal, social, cultural and even environmental factors.
So what is the Future of Responsive Design?
With the needs and technology surpassing the available standards, what does the future hold? how can we best make use of responsive principles to our advantage? with the rate at which the mobile device market is growing, ignoring responsive design or even sidelining it is no longer an option. It’s not an inconvenience, it’s an opportunity- so how do we leverage it to improve our usability and customer retention?
As designers, we’ve often been tasked to produce logo options for use on dark or light backgrounds, stacked versions for portrait applications or where there’s limited space and icon logotypes. When it comes to digital however,the norm is ‘minimum size: XX pixels wide’ -but this isn’t always enough and can lead to some tricky design decisions adapting a site to mobile- simply resizing your logo isn’t always suitable.
Some excellent examples of a different approach can be found here http://responsivelogos.co.uk/ (resize your screen to see what i mean), however, while it’s beautifully implemented and a good think piece, this approach is still a compromise. Could there be a better way?
Consider the things that make the icon / marque version of your logo suitable for mobile: simplicity, small footprint, recognisably representative of your brand, visible at small sizes. Don’t these all sound desirable for your logo in the real world?
Now consider the impact that having four or five logo variations can have on your brand recognition- how many variants are too much? We’re fairly familiar with the rule that your logo is sacrosanct, and it should never be amended or altered. If this holds true, then could a mobile-first approach to branding be the solution?
In a recent piece posted on Fastco Design, Dan Gardner & Mike Treff talked about the future of responsive design being in personalised content that takes into account location, personal interests and so on to determine what content is displayed most prominently. They used the example of a printed newspaper versus a news website, and made the point that a news site will always display the ‘top’ story in a certain content block, whereas in print they’re much more ready to reactively balance the layout depending on the news content of the day, and their audience’s interests and priorities.
What’s certain is that designers are increasingly going to have to think in terms of not just one layout, but multiple choices of template and content blocks depending on the number of top-line items, as big data enables businesses to actually understand our environment and habits, and control what kind of content we’re shown as a priority based on these factors. What’s certain is that as our understanding of our userbase expands, businesses will need to find a way to present users with the most informed and relevant content choices in order to stay competitive.
In the second part of my blog, I’ll be looking at how we can use the new technology to expand our design lexicon, and how new and emerging technologies might shape the next steps in the future of responsive design
Are you looking to improve your web presence to be more mobile-friendly?
We offer a full service both designing and building beautiful Responsive Websites, App interfaces and HTML emails.