Responsive Web Design ≠ Mobile. How Mobile Optimization Works

Oliver Pfeil Last updated on 21.10.2020
6 Min.
mobile optimisation
Last updated on 21.10.2020

In this article I will explain the difference between "responsive" and "mobile enabled" and how to optimize your website for mobile devices. You will also learn some very cool tricks to improve the loading time of your WordPress website so that it loads quicker.

More and more people are going mobile to the Internet. This creates new possibilities and of course a rethinking regarding the topics "responsive web design" and "mobile optimization for the website".

Why mobile optimization?

Before I show you concrete optimization possibilities, I would like to briefly discuss the "why" with you. I will go into the most important two reasons in a little more detail:

Reason #1:

More and more people use mobile devices (smartphones and tablets). In contrast, computers and notebooks are being used less and less. This is especially true for private use when looking for a specific problem, topic, solution, restaurant, product or service.

Every website operator should be prepared for this change. Because only if your website is optimally presented on the mobile device, your visitor will site stay on the site and book a product or service with you.

Reason #2:

For Google it is a ranking criterion how your website performs on mobile devices. The following two aspects are extremely important:

  • Is the website fully responsive?
  • What is the loading time of your website?

The better you score in these two aspects, the more points you get and the better your ranking in the search results will be.

What is the difference between responsive and mobile?

On many websites it is written that all you need is a responsive design and then everything is fine. However, I am of a completely different opinion here, and that is why I would like to focus on this point in particular. Because this is exactly where you can perfectly optimize your website for mobile devices.

The basic procedure is as follows: For example, a website operator installs a WordPress responsive Theme. This usually completes the topic for the operator. But in my opinion, it's only just beginning. Because a responsive Themeonly means that the design automatically adapts to the respective end device. This is the basic requirement and accordingly very important.

A responsive Themeonly means that the design automatically adapts to the respective end device.

The next step is to view your website with a tablet and a smartphone. You'll quickly see if the responsive design is professional and inviting. This is because it is often the case that the mobile optimization was not carried out despite a responsive design.

I would like to give you a few examples that you have surely noticed on some websites:

  • The font of the headline is much too large.
  • The font of the continuous text is too large or too small.
  • The line spacing is too large.
  • Images are displayed too large or too small.
  • Certain formatting is not displayed correctly on the mobile device.
  • The navigation is difficult to operate.

This list could of course be much longer, but I think you understand what I am talking about.

Even if these aspects are not optimized, you will have a responsive website, which Google also rates positively. However, you should really take mobile optimization seriously for your visitors and consider these aspects and have them optimized by your programmer.

Responsive web design: Browser tip for mobile optimization

Usually you have a smartphone and maybe a tablet. However, if you want to check your website with different mobile devices, you will quickly reach your limits. However, there is a very simple solution for this. If you use the Google Chrome Browser, you have a built-in feature for this.

You can display your "responsive web design" for many different devices. To do this, click with the right mouse button and select "inspect" from the menu that appears. A console opens and you can select mobile devices (see screenshot). The browser will then show you how your website will be displayed on certain devices.

responsive webdesign mobile device testing

On the following website you will find instructions on how to use this function of the browser.

Tips: Optimize WordPress mobile

If you use WordPress the following tips are certainly very helpful for you. Thanks to WordPress you can do many optimizations with one Pluginor an internal function. This makes your work easier and saves you time:

  • The basic requirement is a responsive Theme. I recommend that you buy a premium Theme for WordPress to choose. This one costs a few dollars, but it gives you a lot more options. Besides, a premium Theme are usually better programmed, from which you benefit additionally.
  • If your Theme in the mobile view needs optimization, you have 2 options. Either you change the Theme or you're tweaking your existing Theme. For the optimization you can use a child Theme use. Hire a programmer to implement the optimizations for you.
  • Meanwhile there are many Themebuilders with which you can easily create your desired design and optimize it for WordPress mobile use. Examples are Thrive-Themes or perhaps Divi.

If the topic WordPress is still new to you, but you find it interesting, you can have a look at the following. On this one you will site find a WordPress Tutorialwhere you learn all the important basics about this ingenious content management system.

Use internal links in the text

Let us now come to a small secret tip, which is enormously powerful: In the text on your website, link internal topic-related subpages. This allows your visitors to easily navigate through your website. Especially smartphone users prefer to click on a link in the text very easily instead of searching through the burger menu.

By this simple optimization you create several positive things at once:

  • Internal links are a ranking factor on Google.
  • With internal links you make it easier for your visitors and they feel more comfortable on your website.
  • Your visitors will on average view several subpages of you, which increases the time they spend on your website. And this is another ranking factor that will have a positive effect.

Charging time for mobile devices

Now we have talked a lot about the topic "Optimizing website for mobile devices". There is another aspect you should also consider: The topic "Load time optimization". I believe that this issue is particularly important for two reasons:

  1. The loading time of your website is a Google ranking factor.
  2. The longer the loading time of your website is, the more visitor dropouts you will have.

This has a particularly strong impact on mobile visitors, as the loading times are always a little longer compared to the desktop environment. Plus 3 concrete tips on how to WordPress optimize the charging time for mobile devices:

#1: Pictures:

Images take up the largest percentage of the loading time. Accordingly, you have the greatest leverage here. The most important thing is that you WordPress upload the images in exactly the same size in which you will include the graphic. This will already save you file size and reduce your upload time.

In addition, there are now gigantic tools that allow you to further reduce the file size of your images fully automatically. You can set yourself whether the quality should be maintained or reduced a little bit. I recommend the following two WordPress tools -Plugins:

ewww image optimizer optimize images

With some Plugins for image optimization you can also automatically generate WEBP images. This is a completely new format from Google, which reduces the file size even more while maintaining the same quality.

#2: Caching

The second important point concerns caching. I don't want to go into too much detail now, because you don't need the background knowledge.

The point is that database queries are not made every time you visit your website (or a subpage). Thanks to "caching", a copy of each subpage is stored on your server and is therefore much faster available, because no separate queries have to be made.

My Plugin-recommendation: WP Rocket. WP-Rocket is easy to use and completely set up in a few minutes. In addition, it Pluginoffers further optimizations that can save additional loading time.

#3: Clean up plugins and themes

Admittedly, this tip sounds very banal and it is. Yet it is effective:

I recommend you to uninstall all Pluginsand Themes, which you do not have in use. Disabling alone is not enough.

This also keeps your system clean and any additional expansion bears a certain security risk. Over time, many Pluginspeople sneak Themesin that you don't really need.

On my website you can find a free video series, how you can WordPress accelerate. These tutorials show live on screen which settings you have to set where.

Conclusion: Mobile optimization is worthwhile for ...

The Internet continues to develop at the speed of light. There are many interesting topics and maybe you are wondering now, is it worthwhile for me to do a mobile optimization? Well, of course you have to decide for yourself. However, I recommend that you optimize your website in exactly this direction:

  • Optimize website for mobile devices
  • Improve and optimize loading time

A website is THE figurehead that is in action for you 365 days a year. And for your figurehead to serve its purpose, it must be polished regularly. Mso one recommendation is: Polish your website for mobile devices and you will certainly benefit from it.

Picture: Le Buzz | Unsplash

Oliver Pfeil helps people with books, e-learning and courses to create a successful and profitable website. His areas of expertise are WordPress web design and online marketing.

Comments on this article

Leave a comment

Your email address will not be published. Required fields are marked with * .