What is the influence of a mobile-friendly website on your findability?

Posted on 05-03-2020 at 10:30 in SEO

With the arrival of the mobile phone we are surfing even more while on the move. It is therefore no wonder that websites nowadays are mainly visited via a cellphone. However, what is the influence of having a responsive or mobile website on the findability of your website?

If you want to have a good website, it needs to be mobile-friendly. Search engines such as Google, Yahoo, DuckDuckGo and Bing pay attention to this, however what it does regarding the mobile-friendliness differs per search engine. Note that the largest player (Google, with 98,3% market share when it comes down to mobile search traffic in the Netherlands) penalizes your website if it is not mobile-friendly. This way you score lower in the search results. So if you wish to be found in the largest player's search results in the Netherlands, it is important that your website is responsive. We will explain why this is and how it works.

What types of mobile-friendly websites are there?

Let's first get clarity on what a mobile-friendly website can be. There are two options: a responsive website or a mobile website.

Mobile website

This method was widely used more than 10 years ago.The first smartphones as we know them today came to the market around 2006.Then in 2007 the first iPhone, with the ability to use the internet on a mobile phone and download apps, came to the market. Google followed with its Android operating system in 2008. From that moment on, mobile internet could no longer be ignored in our daily lives.

Having a good mobile website started becoming important from 2007 and onwards. To accomplish this, companies created a specific mobile website that would be displayed instead of the desktop website. These kinds of websites still exist today. You can recognize them by the URL in which the subdomain is mentioned. For example "m.websitename.com" or "mobile.websitename.com".

When using a mobile website, you essentially have two websites. This means you have twice as much maintenance and twice as much work whenever you need to update the information on the website. This is why it is often the case that a mobile website contains less information or more compact information. You select what information you think is important. This makes you vulnerable to the risk of your potential visitors not being able to find the information they are looking for. We will discuss the effect of this on your findability in the search engines later on in this article.

Responsive website

Maintaining two websites can be cumbersome. In the period of 2006 until now more and more variants of screens and resolutions were released. This resulted in a website that looked different on every device. Taking all those screens into account when developing became increasingly difficult. A mobile website was't flexible enough to display everything correctly on all those different screens.

In 2010 Ethan Marcotte came up with a completely new way of web design: the responsive web design.

A responsive design structures pages flexibly. It considers your screen size (landscape or portrait mode also count), your screen resolution and what device you use. Based on this, the page layout is sorted and designed. There is only one website, so you will only have one website to maintain.

What is better for findability in search engines: a mobile website or a responsive website?

A well findable website offers the seeker the information he is looking for. As we mentioned earlier, when using a mobile website it is often the case that some information was left out. In addition, a mobile website is on a different domain: a subdomain. For example your mobile website is on "mobile.website.com", whereas the main domain and website is found on "website.com". These are therefore seen as to different web pages.

To make your website more findable, it is best to have only one website. It concerns the same information, but is presented in a different way. A responsive website is therefore better.

Factors for a responsive website that play a role in your findability

Now that we know a responsive website is better for you findability, we ask ourselves the question: how can we recognize a responsive website?

When designing a responsive website, the following 4 factors are important:

  1. Readability
  2. Navigation
  3. Scrolling
  4. Speed

A mobile screen is, of course, a completely different format from your PC or laptop screen.

The texts that are displayed must be legible without having to zoom in. This can be influenced by the font you use and the font size. You can choose to use a larger letter on mobile devices.

Whitespace

The space between the elements on a page, which influences the readability of texts, is what we call whitespace.

When everything - texts, images, input fields and more - is close together, a website becomes very unreadable. This is already the case on a desktop, but certainly important on a mobile phone.

Make sure there is sufficient space between the various elements on your pages. A web designer can advise you on this.

Links

It is common for your pages to contain links. These can be buttons, textual links or an entirely different type of link such as an image.

On smaller screens, tapping a link is more difficult. Due to tapping the link with your finger instead of a mouse click. This can be less precise. Make sure there is sufficient space between the different links.

In case of buttons you can do this by using more whitespace. Links in text can have increased line height, just to avoid tapping the link on the line above or below it.

It is important that your visitors can easily navigate through your pages. However, it is not desirable to have half of a mobile screen occupied by navigation.

How you structure your navigation depends strongly on how many links you have in your navigation. Tabs may suffice for two or three links, provided that the text on each tab is not too long.

When visiting websites on your mobile phone you'll often come across the hamburger menu. These are three horizontal lines, which together form one button that opens a menu when you click it.

If you are not sure what best fits your website, you can ask a web designer for advice.

User experience design in the 1990s expected grabbing attention on a website was to be done the same way it was done for magazines: "before the fold". In other words, before they had scrolled the webpage. The first tracking software, however, actually proved this to be a myth. In fact, 65.7% of the attention on a website takes place after the opening screen.

Nowadays we scroll on every website, there is almost no escaping that. Certainly when a lot of content is present. Scrolling is also not bad at all. As long as it is only from top to bottom.

In addition to vertical scrolling on a website, it is also possible to scroll horizontally. Nowadays also known as: swiping.

Although it is technically possible to scroll the entire website horizontally, this is not recommended on both the desktop version and the mobile version. It is not user friendly and goes against every expectation.
A good application of horizontal scrolling, or swiping rather, is browsing through a separate module on the website. A module like a slider with photos or a brochure.

In addition to scrolling the entire page or swiping a separate module, it is also possible to have a small element scroll vertically in a page that does not scroll. A text block, for example, in which a scroll bar can be seen. This is completely unnecessary and because the browser often gives its own design to the scroll bar, it also affects the overall design of your website.
In addition, it can be inconvenient on smaller screens, such as a mobile phone.

An example of a module in which both horizontal and vertical swiping is possible, making it intricate to use on a mobile phone in the past, is the implementation of a map module such as Google Maps on a website. In some cases zooming in and moving on the map caused it to zoom in or move the entire website, or already started to move the map while people just wanted to to scroll past it.
Nowadays, these types of modules require an additional operation to prevent this. For example, by using two fingers within the module. This way only the map zooms in or moves, preventing the entire website from moving.

The speed of a website is one of the most important factors. This is influenced by the network used (Wi-Fi, 3G, 4G or 5G), but you personally can certainly also influence it.

This speed is mainly affected by how much needs to be downloaded to show your website to your visitor. In other words, how much MB it costs. The less MBs needed to be retrieved, the faster your website will be.

You can reduce the number of MBs by tackling the following points:

  1. Images
  2. CSS & JavaScript
  3. The amount of files

1 Images

We definitely recommend the use of images on your website. It is, however, important to keep the file size of your images low in MBs. The so-called print quality won't be necessary for an image used on the web.

When using an image for a website, you need no more than 72 DPI (dots-per-inch). An image with a lower DPI is of poorer quality and not suited for print productions. It'd be pixelated when printed, but is of excellent quality on a digital display. In programs such as Adobe Photoshop or Adobe Illustrator it is possible to save images for the web using this 72 DPI setting.

In Adobe Photoshop you can go even further and lower the quality of the photo before saving it for use on the web. As a result, it is possible that visually hardly anything has changed in the image, but the file size did decrease from 3MB to sometimes as little as 200KB (0.2MB).

2 CSS & JavaScript

CSS is responsible for the design and visual layout of your website. It tells your browser how the elements on your website should look or where they should be positioned.
On a responsive website, CSS also contains the information on what to do for each screen format.

JavaScript is responsible for functionality, although it can also be used for animating elements.

Both code languages can be placed in separate files, which can then be minimized. This means comments from the code writers are extracted and everything within the files is placed on one line. This reduces the file size. Your website visitor never sees this code, therefore doing this does not change the appearance of the website.

You can use https://csscompressor.com/ for CSS or https://jscompress.com/ for JavaScript to reduce your code file size. Always ensure that your files are backed up.

3 The amount of files

By files we mean images, CSS, JavaScript and much more. Sometimes files that aren't used on the page - or the entire website at all - are still loaded. This can have severalreasons. It may be old code, which the developer forgot to remove. Try to keep the number of files to be loaded at a minimum to increase the speed of your website.

Why a responsive website influences the findability of your website.

Two factors are at play here.

First of all, the devices on which we use the internet these days.
A survey by Statistics Netherlands in 2018 showed that 84% of internet traffic within the Netherlands is via a mobile phone. Within Europe the average is 69%. Worldwide this was 52.6% in the last quarter of 2019.

The purpose of a search engine is to provide you with the information you request. If this is done via a mobile phone, it is useful to get a result which you can find and read on your phone without too much trouble (e.g. read without zooming in, long waiting times or unreadable texts).

Then comes factor number two: the search engine itself.
Not every search engine is used the same way. Within the Netherlands Google held 98.3% of the market share in "mobile internet traffic via a search engine", in January 2020 . Adjustments within the algorithm of this search engine therefore have a huge impact on the findability or your website. This is followed by DuckDuckGo, a search engine where your privacy is the priority, with 0.62% market share. Yahoo! comes in third place with 0.43% and number four is Bing with 0.24%.

The influence of Google on your findability

On July 1st, 2019, Google switched to mobile first. This means your score depends on how mobile friendly your website is. This also means Google indicates that if you show less content on your mobile version, Google will not receive this information either.
When you use Google Analytics, you can receive feedback from Google when something could go wrong with your website on a mobile phone.

Because 98.3% of the search traffic on a smartphone goes through Google, you will also have to deal with the mobile first adjustment. A mobile friendly website is important if you want to be found on Google.

The influence of the Bing algorithme on your findability

Bing, on the other hand, announced back in 2016 not to switch to a mobile first method. It uses indexing that is optimized for both desktop and responsive websites. That does not mean Bing does not take the increasing mobile traffic on the internet into account. However, it primarily looks at the relevance of the website and will place higher accordingly, even when it is not mobile friendly. In this case, it is up to the user to visit your website or not when it is not mobile friendly.

Yahoo and mobile friendliness

Yahoo partly uses Bing. This means that the organic results at Yahoo! will not focus on the mobile friendliness of your website, but rather look at how relevant a page is to the search that has been performed.

DuckDuckGo

In 2016, DuckDuckGo entered into a partnership with Yahoo. It is also a partner of Bing, Yandex and Wikipedia. So DuckDuckGo will also not be focussing on how mobile friendly your website is, but will be focussing on the relevance of your website instead.

What you can do if your website is not mobile friendly

It is important that you know your audience. Will your audience mainly find you via a mobile phone or via desktop? There are several ways to find the answer to this. For example, by storing the device, with which the user visits your website, in a database.

However, it is easier to use Google Analytics.

Which search engine does your audience use? The fact that 98.3% of mobile search traffic in the Netherlands goes through Google does not mean that your audience also has that percentage.

How much time do people spend on your website? It takes longer when one visits the website and reads the information, compared to when one comes to the site and immediately leaves because the website turned out to not be mobile friendly. Keep in mind that some visitors will still stay on your website and will for example zoom in to be able to read the content on your website. This also extends the time spent on the site.

With this information you can decide what exactly needs to be done and how quickly it needs to be done.

WordPress

When your website uses WordPress it is important to check which version of WordPress. In general, a WordPress template uses a responsive design and therefore has a mobile friendly version of your website.

This may not be the case with older versions of WordPress templates. Check if the template you are using has an update that is compatible with the most recent version of WordPress. This way your website might still become mobile friendly through a simple update.

The same applies to all plugins you use.

It is of course possible that different plugins and templates are no longer compatible. You then have two options.
Option one is to hire someone to adjust the template, making it more mobile friendly, if the license allows this adjustment.
Option two is to have a completely new website made.
We recommend option two for the security of your website and data.

Joomla!

When you use Joomla! it is almost certain that the newest version of templates generally use a responsive design.

Check whether the updates for your extensions and templates are compatible with the latest version of Joomla! before installing them.

If there are no recent updates for your extensions and templates that are compatible with the latest version, it is wiser to have a new website built, rather than just having the template adjusted. Do this to keep your website and data secure.

Custom website

With a customized website, making a website mobile friendly is slightly different than simply updating or installing a new theme/template.

The difficulty of converting the webpage to a mobile friendly website, depends on what has been used to build the pages. In general, your pages will use HTML, CSS and JavaScript, but there are other languages too. Have an expert take a look at your website and advise you on what steps to take next.