Last update : 17 September 2020
Have you ever wanted to see what your website looks like on your smartphone and the result was far from what you expected? Did you not get the same display according to the resolution of the screen/phone you used? If this is the case, you have done well to click on the title of this article. We will give an overview of the principles of responsive design.
What is “responsive design”?
Responsive design is a website design technique that consists of adapting the display of your website according to different possible screen sizes. Whether your visitors use a desktop computer, a laptop, a tablet or a smartphone, responsive design offers displays tailored to each of these screen resolutions. This technique relies mainly on the new display properties of CSS 3 (microformats, Media Queries …).
The advantages of “responsive design”
The main advantage of responsive design is that it adapts the display of your website to any screen. Columns, images, and all of your content will adjust automatically according to the media used in order to offer the best ergonomics to your visitor. Today, mobile support is increasingly used by Internet users and all bloggers and businesses must adapt their website to this new trend.
Another advantage of this technique is the fact that it requires very little maintenance and that its cost can be much less than the development of an entirely new mobile website. Also, if you’re not very familiar with mobile site design or you do not want to invest the money, there are some very good and free plugins that may not give you everything you want, but will allow you to still enjoy responsive design. As an example, for users of WordPress, the plugin “WP Mobile Detect” offers very good results.
Finally, the last fundamental advantage of “responsive design” is its influence on your SEO. Indeed, automatically resizing images in search engine previews will boost your natural SEO. Since you only offer one version of your website (unlike those who also own a mobile site), your inbound links all direct to the same URL, which further enhances your SEO in the organic results of a search engine.
The disadvantages of “responsive design” (yes there are some)
While you have probably already rushed on your keyboard in search of the best method to adopt this new feature that will change your life and blow up your traffic (let’s be optimistic), it is worth mentioning some disadvantages.
The main disadvantage of this technique lies in the loading time of your page. Indeed, your visitors may have to download a bit of HTML/CSS code that is not necessarily useful to them and that will slow down the loading of your page. The image loading time can also be lengthened due to resizing. The development of a mobile website has at least the advantage of not posing these types of problems.
The second disadvantage to take into account before embarking on this adaptation is that not all browsers are currently compatible with HTML5. Some older versions of mobile phones simply do not offer it. So make sure your target is enough of a technophile (or less than 100 years old) before you embark on the adventure.
So, do you need to use “responsive design” or not?
Short answer (one that serves almost no purpose): it depends. More detailed answer (to properly conclude this article): for all those who do not have the means or the desire to develop a mobile version of their site or to invest in the development of a mobile application (you will of course need to update with every new version of IOS), YES you can and should use “responsive design”. There will always be pros and cons to any form of improvement but we can certainly say that with the rise of smartphones, this technique is to be encouraged.
If you liked this article, you might also like this: Increase downloads for your mobile app!
Do not hesitate to contact us if you want a personalized help regarding your SEO, PPC, or analytics strategy