seo-nerd® – digital success
Bundesallee 39-40a, 10717, Berlin, Berlin, Germany

Responsive Design

Rankings with responsive web design
reading time: 6 minutes

Rankings with Responsive Design
Already since the hummingbird update of 2014 Google prefers sites containing Responsive Design. On 21st April 2015 Google complemented its algorithm with the signal “mobile-friendly”. Sites should also be easy to read on mobile devices and smartphones then, as well as easy to understand and navigate. From the search engine optimization viewpoint a good argument can be made to convert to Responsive Design. There’re also other solutions to equip for the “mobile- friendly” update of Google, however, Google themselves recommend the responsive solution. But there are many things to take into account.

Why Google considers Responsive Web-Design more and more important a matter-of-fact look at the numbers tells you: At the moment there are 2.5 billion smartphone users worldwide. Another billion are expected until 2018. Hence, the triumph of the mobile devices continues in foreseeable future.

In Germany, by the way, every second person already owns a smartphone. In order not to be outpaces, website providers have to act on this trend. Websites are demanded on which smartphone, tablet and phablet users like to surf on. The magic word is Responsive Web Design (“RWD”), often abbreviated to just Responsive Design (which the seo-nerd also follows to use as term).

Responsive Design

As soon as websites obtain responsive design, users can access it from every device, no matter if they surf on a desktop computer or a smartphone or tablet.

Responsive Design – what is it?

The design of the site adjusts itself to each screen (the „viewport“) being loaded on, thanks to RWD. In order to imagine how this works you need to split the screen in imaginary squares. When sitting in front of a desktop computer, for instance, ten squares fit side by side. On a smartphone, however, it’s maybe only two.

In simple terms, responsive design works with the squares in a way that will output the optimal display on the device accordingly. On smaller viewports the squares can be displayed smaller or moved downwards if the illustration of a table, for instance, would become unreadable otherwise. Responsive Web Design reacts, so to speak, on its environments on which it is shown on, hence the name responsive design.

Besides the size, Responsive Design also considers the type on entering, e.g. whether a keyboard or mouse is used.

Is Responsive Design the same as mobile, adaptive or liquid Web Design?

Straight answer: nope! All these kinds of web design have one in common: they aim to make web contents more accessible on mobile devices. They tackle this target to some extent differently, though:

  • A mobile website is made with its own URL besides the desktop website. For the purpose of search engine optimization this brings many problems such as duplicate content and linkbuilding that’s spread over two sites instead of collecting all backlinks on one site.
  • An adaptive website adjusts the contents to the different precisely defined viewports. The design of the adaptive website doesn’t correspond to the changing sizes of screen, so there’s no fluid adjustment to the viewports as in RWD
  • The liquid website is the most similar to sites with Responsive Web Design. Although no “breakpoints” are set here that make sure on responsive sites that, for instance, pictures are only displayed smaller up to a certain threshold. If it is below the threshold then the pictures is shifted to a spot on RWD sites where it can be displayed in an optimal way. The liquid website decreases the picture, in contrast, just in proportion to the overall display. Thus, the design does not respond to its environment on which it’s displayed on.
Infografik: Number of mobile online purchases

Statista Infographic:mobile online purchases

Google prefers sites with Responsive Design

Google has already prepared itself with the introduction of the hummingbird algorithm that more and more user surf on mobile devices and also ask Google “for directions”. Especially on smartphones many users dictate commands now. Such voice-input search requests differ from queries that are typed in with a keyboard. Commonly, they are whole sentences like: “Where in the area can I have my computer repaired?”

When Google extended its SEO Zoo around hummingbird, the search engine from Mountain View, CA prepared itself for those longer keyword chains. Hummingbird weighs the entered words distinctly. In this example, Google’s SERP will present computer repair shops with good reviews in the vicinity. (By the way, this example also shows why content marketing as well as tight social media marketing is so important since hummingbird. Both help Google to determine what a site is really about and how the site is assessed by users.)

In their guidelines for webmasters Google doesn’t exclude other options to provide for mobile devices but stresses preferring Responsive Design. To understand why that is like that, you only have to visualize some of the around 200 criteria that lead to a high ranking in Google.

Why is Responsive Web Design of advantage for SEOptimization?

  • Responsive Design avoids duplicate content that can exist if a mobile website with its own URL is built in addition to the desktop website. This makes the work plainly easier for Google.
  • The traffic and all user signals are allocated to one single domain and is not split into two URLs like on a mobile subdomain.
  • As no second web address is necessary the web authority is bound to one single site. Hence no “link juice” is wasted for no reason. Backlinks and social media activities that link onto the site are not shared over two sites, but further strengthen the site that is important. Furthermore the mobile site doesn’t have to obtain web authority first. It goes with all web authority power gathered in the past years from the already existing site into the race for the upper Google ranks.
  • If something is searched for in Google on the mobile device Google adjusts its SERP according to the needs of mobile users. Sites that require Flash won’t even show up then. Responsive sites, on the other hand, are pushed upwards and will even get a cell phone icon next to it soon that clearly states that this site is suitable for mobile devices.
  • Google appreciates Responsive Web Design ever so much that it improves the ranking in search requests even on desktop computers as soon as the site is responsive.

Does the nice, new world of Responsive Design not have any disadvantages?

Of course, also with Responsive Design not everything that glitters is gold. You can’t tar all websites with the same brush, after all. There’re websites whose visit is no fun on mobile devices, because you need a mouse for navigating or in contrast sites, that are only enjoyable on a tablet or smartphone without a mouse. For latter a mobile web design is probably better suitable than a responsive one.

Also big sites, that transport a lot of contents like the big news sites are, to avoid longer loading times, usually better off with offering a mobile website on which only selected news are presented.

Is the switch to Responsive Design worth the costs?

Website owners consider the additional costs as another disadvantage related to switching to Responsive Design, first of all. Keeping in mind, though, that the future of the internet is mobile there is no way around from switching. Already now, end of 2014, the number of mobile website hits is almost identical to the one from desktop computers and the prognosis for 2015 clearly predicts that there will be more mobile search requests than desktop queries within the year. Switching to RWD is usually even cheaper in the long term as not two sites are operated and the design doesn’t always have to be adjusted to new devices. Furthermore Responsive Layout means a lower bounce-off rate and more conversions.

Do you have to change the entire layout when switching to Responsive Design?

No, you don’t. A relaunch of the site is not necessary for most websites. Check your site yourself if you like with the mobile-friendly SEO tool that Google provides for free. The nerd and his Berliner SEO agency are happy to switch your website to Responsive Design – without changing the appearance of the site and only making it responsive, so that Google will rank it better. Also, the nerd can accommodate prices with good offers. Just request one. The seo-nerd from Berlin has only one aim: to position your sites at the very top of the SERPs.