Google update urges you to make your website mobile friendly

    Google update: what to do when your website isn't mobile-friendly? Build a new one with responsive design, or have your site responsive retrofitted.

    Subscribe to our blog

    Google introduced two initiatives to enhance the experience of users searching for content on mobile platforms. The first Google update is that mobile-friendly websites will rank higher in search results than their non-mobile-friendly counterparts. A big plus for the users is that they will find relevant results that offer a good experience on the device they're using much more easily. The second change is that indexed apps will also be included in search results for signed in users that have the apps installed.

    As we can read on the Google Webmaster Blog:
    [Google is] boosting the ranking of mobile-friendly pages on mobile search results. Now searchers can more easily find high-quality and relevant results where text is readable without tapping or zooming, tap targets are spaced appropriately, and the page avoids unplayable content or horizontal scrolling.

    The first initiative has a huge impact on SEO (Search Engine Optimization) - if Google takes the mobile accessibility of your website into account, it is important to make your website accessible on mobile, and quickly. What to do if your current website isn't mobile-friendly yet?

     

    First step: check the mobile-friendliness your site

    Google has provided us with a useful little tool to check the mobile-friendliness of your website. If you don't know whether your current website is mobile-friendly, do the test.

    Google Mobile Friendly Update First step towards mobile-friendliness: check your site

    If the test results are negative - your current website isn't mobile-friendly - there are two options: you can either build a new website with responsive web design from the ground up - or you could have your existing website responsive retrofitted

     

    Option A: build a new website with a mobile-first responsive web design

    SEO - the process of improving the visibility (ranking) of your website by optimizing your website and content - is integral to any modern day marketer's digital approach. Now that Google will be taking the mobile-friendliness into account as well, it's important to know that your efforts to improve your SEO might misfire if you're not improving the mobile-friendliness of your website as well.

    Keep in mind: any new website should be built with a mobile-first responsive design. That way, you create an interface that addresses the constraints of mobile devices, such as small screens and low bandwidth. The experience then progressively enhances to take advantage of available screen space, features and more.

    Build a new website with a mobile-first responsive web design

    What are the pros and cons of mobile-first design?

    Pro: a mobile-first redesign offers a fresh start for your website's designers and developers, they can focus on core users and business goals, as well as on a lean markup. A second pro is that a mobile-first responsive project gives the team the opportunity to focus on mobile performance from the start. A final advantage, but an important one, is that a mobile-first design makes your website future-proof: it creates a sound foundation built to stand the test of time and serve as a platform for future growth.

    Con: there are some drawbacks to consider as well. It might be organizationally difficult to get a mobile-first project off the ground, as there are usually a lot of stakeholders involved. Also take into account that any redesign is going to be unfamiliar to users at first. Try and retain the user's level of familiarity with the interface. A mobile-first redesign isn’t a shortcut - it takes time, effort and budget to build things from the ground up. Make the effort worth it!

    If you're considering a mobile-first redesign, consider reading our blog post 3 questions to ask when defining your mobile strategy first.

     

    Option B: keep your existing website with responsive retrofitting

    In cases where mobile-first web design is not an option, maybe due to a limitation in time or budget, responsive retrofitting is a solution. By "responsive retrofitting", we mean making an existing website, that until then only had a desktop version, responsive.

    When a developer starts a responsive retrofitting project, he checks what the new breakpoints will be - meaning that he checks on which screen-widths (for example on 320 pixels or 768 pixels) a website can no longer be displayed the same way as on a desktop. At those points it is necessary that the lay-out of the website changes to make it possible for the user to optimally consult the website's information. That change in layout is done by the css code within the website. When a website is visited from a device with a non-desktop screen size, the css code is triggered, which causes the layout to change.

    On most websites, the navigation consists of a bar at the top of the screen. That design isn't mobile-friendly, which is why it's replaced by a so-called "hamburger menu" - a changed activated by adding specific JavaScript code.

    Google Mobile Friendly Update Keep your existing website with responsive retrofitting

    There are a number of advantages to responsive retrofitting. The most obvious advantage is that retrofitting increases the accessibility of your website: it is often impossible to visit a desktop-website from a mobile device. Retrofitting solves that problem in one swoop.

    Secondly, retrofitting is a relatively quick process, seeing that it doesn't require you to fully rebuild your site - introducing a small css file can suffice. That makes retrofitting an attractive option for a lot of companies.

    A third advantage is that you are able to keep your existing website interface. Your current design and interactions will remain familiar to your website's visitors, while you're offering all functionalities of a mobile website.

    Additionally, a fourth benefit is that responsive retrofitting is a safe strategy for a company. As you aren't starting from scratch, no discussion is needed about the design of the website, which pictures to use etc. That makes the approval process shorter, which speeds up the project.

    Note that there are certain disadvantages to responsive retrofitting as well. It disregards all other concerns you should make at the start of a web project for various mobile devices, such as restructuring the content. Besides, a retrofitted website might not perform as well as a mobile-first one, because you're adding code instead of paying attention to making use of code as economically as possible. Responsive retrofitting is, and stays, a compromise.

     

    Conclusion

    Google introduced two initiatives to enhance the experience of users searching for content on mobile devices on 21 April. The first one is that mobile-friendly websites will rank higher in search results than their non-mobile-friendly counterparts. The second change is that indexed apps will also be included in search results for signed in users that have the apps installed.

    What to do if your current website isn't mobile-friendly yet? The first (and best) option is to build a new website with a mobile-first responsive web design. If time and budget don't allow you to do that, responsive retrofitting (making an existing website, that until then only had a desktop version, responsive) is a solution you can keep using until it's time to build a new website.


    Wonder if your site meets the mobile requirements?

    Get in touch with our experts

    Published on    Last updated on 22/05/2018

    #Customer Experience, #SEO, #Digital Strategy

    About the author

    Maarten is Consultant at Amplexor International based in Belgium. Maarten joined Amplexor in 2012 and has over 15 years of experience in web development, specializing in Drupal. He is a Certified Scrum Master and Acquia Certified Developer.

    SUBSCRIBE TO OUR BLOG

    Participate in this discussion