Most people don’t understand the concept of responsive web design (RWD). They’ve heard it tossed around casually, and likely assume it’s synonymous with a mobile site. Although that is partially true, there is significantly more to consider with RWD. By its very definition, responsive design demands that a design or layout be flexible enough to respond to any device through which it’s being viewed (ie. desktop computers, tablets or mobile devices).
Have you ever visited a website on your phone only to find the layout to be counterintuitive? Sure, most of us understand how to use the pinch and pan features on our smart phones well enough to interact with any site. But let’s be honest — it’s frustrating to feel cornered into a specific set of actions by a website. After all, it’s the site owner that wants your visit, so doesn’t it fall to them to ensure the best possible user experience?
As a designer, it’s important for me to understand the flow of information to and from an end user and a website. To that end, there are a multiple complimentary concepts in web design that, if not implemented, should at least be understood:
- Mobile-first Framework
- Content-out Layout
- Progressive Enhancement
The concept of mobile-first is arguably the most important aspect of responsive design. This approach considers that content is meant to be viewed first on a mobile device. You can build out from there with grids that adjust to occupy more space in relation to one another. There are many mobile-first frameworks out there including, but not limited to: Bootstrap, Foundation, Skeleton, Kraken, and Cardinal. Personally I prefer Bootstrap for multiple reasons, but we’ll reserve that discussion for a future blogThis term originated as shortened version of “web log” and has come to be known as a regularly updated web-page, often containing news, opinion and personal stories. post.
I can think of no better way to explain this than with a quote:
“Grids do not exist in a vacuum. They exist in relation to the content. We never start with a grid. We start with an idea which is then translated into a form, a structure.” – Linda van Deursen
Start with your content, gather up your words and pictures and know, with confidence, exactly what you wish to present to your visitors. The layout should always work to enhance the content.
It goes without saying that daily usage of mobile devices, including smart phones and tablets, is ever-increasing. And chances are that you will get unique visitors to your site who are visiting on their mobile device. So I challenge you to genuinely engage with them. Consider their experience and they will reward you for it with their most valuable commodity, their time.