Why you need a responsive Cardiff web design

Digital generated devices on desktop, responsive blank mock-up with web design fluid template website on screen. All screen graphics are made up.

So, you’re looking for a website in Cardiff. You might know what you want your website to look like on a desktop computer, but have you thought about how it will look on a laptop, tablet or mobile? This is where a bit of knowledge on responsive websites will give you an edge when speaking to a web design agency.

A responsive website is one that reacts to the screen it’s being viewed on by changing the size of images, buttons and any other design elements on your website. If you’re looking for Cardiff web design then you need to make sure you website design agency makes it responsive on different devices.

We’ll start off by explaining exactly what responsive websites are before moving on to why you need one. Let’s get into it!

What is a responsive website?

a woman shrugging over responsive web design

The purpose of a responsive website is to have a single site that responds to the device it’s viewed on. When you look at a traditional, desktop optimised website there might be sections with three columns. On a mobile phone, these columns would be too small to read so having them appear in one column, one after another, is the work of a responsive website.

You could have these three columns next to each other as they are on a desktop site, but no one wants to be scrolling horizontally when they’re on their phone. This becomes more difficult when your phone, or tablet, is oriented horizontally because it will probably be better for it to have the desktop-oriented version.

On a smartphone screen, it’s not just text that is difficult to read, large images can also break the layout and slow down the websites load time. With a responsive website, you want these images to shrink accordingly and take up less website space.

Responsive sites use fluid grids where all the elements on the page are sized by proportion instead of pixels. To use our three columns example, you wouldn’t tell the website how wide each element should be in pixels, instead you program how wide they should be in relation to the other columns. Column 1 should cover 50% of the width, column 2 should cover 30% and column 3 should cover 20%. The same goes for images and any other elements on your page.

Why you need a responsive website

According to data provided by Statista, 48.8% of worldwide internet users used mobile phones for the internet in 2014, which has now risen to 63.4% in 2019.

With the majority of internet users accessing the internet on commutes, or in any situation where they’re out and about, it’s easy to see why the percentage has rocketed in just 5 years.

If you want to target as many customers you can with your Cardiff web design, you need to make sure that your website is easy to navigate on a mobile device. This is the reason that many companies now develop website for mobile first, before they even touch desktop optimisation.

How to check if your website is mobile-friendly

The easiest way to see whether your site works in mobile view or not is to “restore down” your page by clicking the second icon in the top right corner of your browser window.

restore down button on google chrome highlighted

You can then drag the corners so that the window is the size it would be on a mobile phone.

image restored down and dragged into mobile-view size

Scroll down the browser window and you should be able to see the website as it would be seen in a mobile-friendly view.

If you already have a website, you can do a mobile friendly check using Google’s online test.

Googles mobile friendly test home screen

Simply type the URL of your website into the bar provided, and once your website has been analysed you will see this screen:

Googles mobile friendly test screen once the analysis has gone through

From here you can see immediately if your web page is mobile-friendly. You can also view any page loading issues, open a usability report, and view your page in HTML if you understand the language.

Conclusion

If you choose to work with a Cardiff web design company, it’s important to make sure the website they build for you is responsive. With customers getting younger and younger, and with technology advancing in the realm of handheld devices, it’s important to design for mobile first.

I hope you enjoyed reading this piece, I’ll see you in the next one!