So - we've explored how RWD works, and some of the key elements that make up this philosophy; question is, why is it so important to consider using it? There are several benefits to incorporating a responsive capability to our sites, which include the following:
It is easier for users to interact with your site, if it is designed to work with multiple devices.
Creating a single site that caters to multiple devices may in itself require more effort, but the flip side of this is that we're only developing one site, not multiple versions.
Constructing a site that works based on how much can be displayed in a specific viewport is a more effective way to render content on screen than relying on browser agent strings, which can be falsified and error prone.
RWD is able to cater to future changes. If we plan our site carefully, we can construct media queries that cater for devices already in use and ones yet to be released for sale.
Accessibility plays a key role in responsive design. Our content should be as intuitive as possible, with every single piece of information easy to access. Responsive design places great emphasis on making our design self-explanatory; there shouldn't be any doubt as to how to access information on the site.
Note
In this context, accessibility refers to making our site available on a wide variety of devices; this should not be confused with the need to cater for individuals with disabilities. Making sites accessible for them is equally important, but is not a primary role in RWD.
Even though our mobile version may not contain the same information (which is perfectly accessible), it nonetheless must be engaging, with appealing colors, legible text (at all sizes), and a design that retains visual harmony and balance with our chosen color scheme.
The success of our site is determined by a host of factors, of which one of these will be how our content is organized in the layout. The content should be organized in such a way that its layout makes it easy to process, is simple and free of clutter, and that we're making full use of the available viewport space for the device we're targeting.
We must also ensure our content is concise—we should aim to get our point across in as few words as possible so that mobile users are not wasting time with downloading redundant content. Keeping our options simple is essential - if we make it too complicated, with lots of links or categories, then this will increase the time it takes for visitors to make decisions, and ultimately only serve to confuse them!
At this point, it is worth pointing out something - over time, you may come across the phrase adaptive design, when talking about responsive design. There is a subtle but key difference between the two, and either can be used as a principle when constructing our site. Let's take a moment to explore what each means, and the differences that might affect how we go about constructing our sites.