The internet is an ever-evolving thing. It grows, changes, and expands all the time. And with this growth comes all new ways to experience the web. We’re now browsing our favourite websites on everything from mobile phones to e-readers, tablet PCs to laptops. And all from the comfort of our recliner sofa. That means that, unlike in the early days of the web, there are now lots of different screen sizes and resolutions used. For example, an iPad 2 has a screen resolution of 1024 x 768, whereas a great many desktop PCs with widescreen displays run a resolution of 1920 x 1080. These two are worlds apart in terms of screen real estate, so a website will naturally look different on each one. The problem arises when a website developer or user experience team want to develop a new feature, then realise that core functionality is hidden off screen on a smaller or larger screen. As an answer to these issues, a new area of web design has evolved – responsive web design. But is 2012 the year that it will really take off?
Why Being Responsive is Important
Back in the early 2000s when the web was first starting to find its place in our everyday lives, almost everyone used the same sort of screen. They were almost all 4:3 aspect ratio screens, and generally speaking they were in a resolution of 1024×768 or 1280×1080. This meant that almost all web designers would tailor their designs to these screens. And it worked well, because everyone was experiencing the site in the same way. As we’ve discuseed, though, now things have changed. A widescreen display will show a website very differently from a tiny smartphone screen. It’s for this reason that responsive web design is so very important, and why it’s being seen on more and more websites all the time. Even the commonly used ‘mobile sites’ are a type of responsive design – although they don’t fit the ‘official’ definition because they are another version of a site rather than a scaled and adapted version of the main one.
How Responsive Web Design Works in Practice
So what are the practical applications of responsive web design and how can you see it in action? Well, the easiest way to explore responsive web design is to visit a website that has it in place, then start to resize your browser window. If the site has been designed in a responsive way, you’ll see the results instantly. Every element on the page will be reactive to the way you resize your browser. It will likely ‘max out’ at HD resolution (1920×1080), but bring it down to a smaller size and everything should ‘shuffle’ on the page to create an all new way to look at it. When you do this, you’re emulating the effects of different screen resolutions. If your screen actually was using those sizes, you’d see the adapted page by default. The most amazing thing about responsive web design is just how seamless and fluid it is. Many times you won’t even know you’re on a site that uses it – and that’s kind of the point. Modern web design is all about user experience, making the site work for you rather than the other way around. And in a world dominated by mobile devices and new ways to explore the web, it seems only right that web design would evolve in this very natural way.
Will 2012 see more Responsive Web Design Appearing?
We can only hope that more and more examples of responsive design appear as the year goes on. There has never been a time when this kind of design has been so much in the consciousness of web designers, so it’s incredibly likely that 2012 will be the year when we see lots of sites adopting the style. But of course, if it’s done right, we won’t even know it’s there. The rise of responsive design perhaps indicates a shift in the way that businesses look at web design too: perhaps with more understanding towards the user and how they interact with a website. And if web design continues to put the user first, we can all rest assured that the web will become an even more exciting place in the future.
written by: Isabella Woods