Google's New Mobile First Index: Where to Begin?
Free article submittion
Haku Kapule

How to optimize for Mobile First Indexing

With more and more users and customers accessing company websites via their mobile devices, Google has begun to implement a mobile-first indexing system as part of their latest update to make the web more mobile-friendly and reflect user behavior trends. However, there is still a lot of confusion around what this means for the average business owner. This article will touch on what steps a business can take to adjust to Google’s new mobile-first index changes. It will focus on what elements of a mobile site have the largest influence on rankings, tips for quality mobile page optimization, and two highly impactful design strategies you might want to consider implementing for your own site.

Mobile-first indexing simply means that Google will treat your mobile site as the primary version of your website when crawling and indexing your pages. If you do not have a mobile version of your website or your desktop site is not mobile friendly, this could negatively impact your overall ranking in searches as Google continues to roll out its mobile-first index update. If you monitor crawlbot traffic to your site, you may see an increase in traffic from Smartphones and other mobile devices, and the cached versions of pages will usually be the mobile version of the page. As is standard practice with search engine marketing, it is vital that visitors to your site have a good experience. This means the site loads quickly, images and text are easily visible, and the visitor does not have to scroll horizontally to read information.

So far, this change is only in the very earliest stages of testing and is currently being tested only on websites which Google considers to be “ready” enough for this change to have a minimal impact. According to Google’s own latest guidance on the topic, if your website is responsive or otherwise identical in its desktop and mobile versions, you may not have to do anything differently. But if your website is not responsive and you lack a separate mobile version of your site, you might want to consider implementing a mobile solution for your site before the latest update begins affecting your rankings.

Understanding Mobile Ranking Factors

In this new mobile first world, you want to prioritize your company’s mobile optimization as much as, if not more than, your desktop site. Here is a list of factors to consider when making sure that your mobile site is functioning optimally:

Content — make sure your mobile site has the same content that exists on your desktop site, including text, videos and images. Make sure that these are indexable and crawlable as well, and not blocked by your robots.txt file or a rel=”no-index” tag.

Note: If you currently hide some of your mobile site content in accordions or tabs to save space, Google will treat this content in the same way as if it was loaded fully visible (as long as the content is still crawlable/accessible).

Page speed — The loading speed of your mobile site is a big influence on rankings. It is important to make sure that the mobile page speed and load time are prioritized. Make sure that images and other (potentially) dynamic elements are optimized correctly for the mobile experience.

Metadata — Make sure that titles and meta descriptions are equivalent on both versions of all pages.

Links — Make sure links, such hreflang and social media, link to the mobile versions of these sites as well, as appropriate.

Flash — Avoid using Flash content on your site, as it is not compatible with a large number of devices, such as Apple products.

Fixed-width viewport — Use a responsive design when creating a webpage or integrate responsive features into existing pages. You want to avoid fixed-width pages as traditional desktop webpages are cumbersome to access on a mobile device.

Content and fonts – Make sure that content, such as images, and fonts are scaled, or can automatically scale, to a smaller screen size. If a font is too small, a user will have to zoom in, if content is too large for the screen, the user will not be able to see all of it. Buttons and text entry forms should be spaced apart from one another.

Pop-ups – Avoid pop-ups, as they can lead to poor user experience

Encryption – It’s important to implement encryption (https) and SSL Certificates for mobile pages

For more information on how to optimize your mobile site, please see Mobile optimization as a competitive advantage or Google AMP Requires HTTPS, It’s Time to Encrypt Your Mobile Site.

Reponsive Web Design

As previously mentioned, a traditional webpage can be cumbersome to access on a mobile device. Images or text can be too large, and the user has to scroll left and right to find information, which is no longer commonplace within the internet realm. Responsive web design is designed to automatically adjust the layout of a web page to match the size of the device accessing it, while maintaining the same content and assets. FACT Goods’ site is a great example of a site that does this well:

Full screen:


Condensed screen:

Source

Adaptive Web Design

An adaptive web design differs from the previous responsive design in that a layout is created specifically for the device that it is displayed on. There are six different layouts for common screen widths. This web design will detect the screen it is displayed on and adapt accordingly. However, you’ll have to create the adaptive site for each screen width. Unlike the responsive web design, the page will not maintain the same content as the size changes. Take this example from this Audi page:

Fullscreen:


Condensed Screen:


Mobile:

Source

Both designs have their caveats. On the surface it seems as though the adaptive route is much more work being that you have to create six different pages. However, it is not enough to use simple responsive features in your webpage design, which are now common and widely available. You should build a site knowing that users will access it using different devices and test both the experience and accessibility of a site when using these unique platforms. Google conducted a study and came up with 25 suggestions, which were divided into five general categories:

  • · Homepage & Site Navigation
  • · Site Search
  • · Commerce & Conversions
  • · Form Entry
  • · Usability & Form Factor


As with most design, it is important to recognize why users visit your site; usually to find information or make a purchase. Consumers want to find what they are looking for as quickly and easily as possible. Good design principles, like those discussed in the previous section, can help improve the experience of these potential customers. Usability testing focusing on your sites mobile pages will help identify what needs to be changed and how you can change it.

The following comparison shows how responsive web design can be used to adapt your site’s content in order to accommodate the limitations of screen size and aspect ratio of certain devices:

Mobile usability resources:

  • · Design and UI — click here
  • · Mobile usability testing — click here
  • · Google and AnswerLab optimizing for multiple screens click here
  • · Inspectlet — click here

Cascading Style Sheets (CSS) are used to style and format webpage, they lay out how to position content and properly scaling images and text. These can be used to format the website to make it responsive and change the page layout depending on the type of device being utilized. This helps to ensure that all content is the same on the page, while modifying the page layout to maximize the user experience for that page.

For more information on responsive web pages, please see: What is Responsive Web Design? and What Is Responsive Web Design & Why Do You Need It?.

Google Accelerated Mobile Pages (AMP)

Accelerated Mobile Pages (AMP) help to streamline a website’s content, which makes loading time faster, your site responsive, and can improve your mobile site’s rankings. AMP mark-up is less flexible than traditional HTML, but it is a great way to help your site be quick to respond. For a detailed breakdown of how to implement AMP markup into your existing code, or to create a website from scratch using AMP, please see the official page of Google’s AMP project.


Source

AMP can also be integrated within an existing third-party platform such as WordPress or Tumblr. Currently for WordPress.com sites, you can download the AMP plugin to enable it for your pages. To enable AMP for your WordPress.org site, please see AMP for WordPress.

For more information on Accelerated Mobile Pages, please see Getting started with Accelerated Mobile Pages.

Wrap Up

The world of the internet is being accessed more and more via mobile devices and it is important to make sure that your mobile site is easy and convenient for customers to access. Learning how to use tools such as Accelerated Mobile Pages and responsive web design on your own site to improve the customer experience is crucial for any business; especially now that Google will be viewing mobile websites as the primary metric for site rankings. With a bit of testing and research regarding your mobile site, and research regarding how your current website is accessed through a mobile device will be just as good as your desktop site.

About The Author

Haku Kapule

Haku Kapule is a contributing editor at 365 Business Tips, a new blog that prides itself on presenting the best advice and practices for small and medium sized businesses everywhere. He’s passionate about finding and offering useful tips to small business owners. He is an expert in digital PR and marketing strategy and has assisted with the increase of digital presence and customer support for small and large companies alike.

Did you find this helpfull?

Leave your Comment

This Is rising
Weekly Top List
Cheap SEO Backlink