So today I’m going to talk a little bit about Responsive Design. Putting it simply, Responsive Design is an approach to web design that allows websites to render properly on devices regardless of screen size or width. Websites built with Responsive Design in mind are usually built in-fluid grids, that allow the content on the page to move according to the screen size, or “viewport”, that’s currently browsing it.
Responsive Design isn’t new. Ethan Marcotte coined the phrase back in 2010, but its popularity as an approach exploded during the time which more and more people viewed the Internet through mobile devices, such as smartphones or tablets. In fact, according to statista.com, just over half of all website traffic in 2020 was accessed using mobile devices. So, you can see why it’s important that websites are designed with this approach in mind.
Before Responsive Design was popularised, websites were made with multiple versions considered. If a user was browsing on a desktop, they would be taken to the desktop version of the website, if they were using a smartphone, they’d be taken to the smartphone version etc. As you can tell, this was an incredibly inefficient way of doing things and also particularly costly – A web developer would have to create 2 (or more) websites for the same project.
These days, Responsive Design is the norm. Google, in fact, penalises a website’s ranking if their website doesn’t conform to this standard and these days a lot of websites are created with a “Mobile First” approach, essentially designing a website as if it would be seen on a mobile device first and expanding from there, an approach that we at SiteJacket take. Just think about the number of times you’ve idly looked at a website whilst waiting in a queue, sitting on a bus or even over a coffee. And now think about how different that same browsing process would be if you would have to drag the screen about in order to see everything, or how much scrolling there would be if a web designer hadn’t taken into consideration the amount of displayed content on a page. This is why “Mobile First” is especially effective in thinking about the layout of a website.
As we head into the future, the term “Responsive Design” itself may just as well fade into obscurity as more and more websites utilise it and it becomes the norm. But for now, it’s more of a flexible approach to thinking about design in regards to the future instead of just a technical set of rules. If you wish to start a new project, or if you're worried that your website doesn't conform to these standards, why don't you contact us and see if there's something that we can do? It'd be great to hear from you.