Have you ever been super frustrated when browsing a website, from your mobile? Especially, if you have to zoom in before trying to click on a button? Or worse, part of the web page is not even visible. If you are like me, you’ll never go back on this website.
To put it simply, responsive web design makes your web page look good on all devices: desktops, tablets, and phones.
10 years ago, websites were built for desktop screens mainly but with the rise of mobile & tablets, it is now a must that web pages are responsive.
Here are some aspects to consider for a responsive website:
UX (User Experience)
Your web page should look great, and be user-friendly, regardless of the device.
Web pages should not take out information to fit smaller devices, but rather adapt its content to fit any device.
For mobile, It is better to have a simple drop-down menu to make it usable on a small & cursorless screen. A simple element could also be added but one needs to keep the navigation neat.
On mobile devices, it is better to display fewer graphics than on desktop so that the web page doesn’t take ages to load on a smartphone. For instance, slideshow with large images or video background should be taken out on a phone version. In addition, many phone users are on 3G connection when browsing a website which makes the “web experience” slower than a wifi connection.
All page elements are sized by proportion, rather than pixels. So if you have two columns, you wouldn’t say exactly how wide each should be, but rather how wide they should be in relation to the other column.
Mouse vs Touch
On desktop the user navigates with a mouse and choose items. On a phone or tablet, the user will mostly use touch screen. What may look easy to select with a mouse, may be hard to select with a finger on a tiny spot on a screen. The Web designer has to consider this aspect.