Table of Contents (Click to show/hide)
Monthly
Active User Rate
Daily
Campaign Budget
Increase
Click-through Rate
Growth
Return on Investment
Customer
Segmentation
Prioritisation of
Limited Resources
Competitive
Responses
Consumer
Change
Google's algorithms are the be-all and end-all of search engine optimization. Recently, Google announced that they would be transitioning its indexing system to focus on mobile first. This means that Google's indexing will now focus mainly on content from mobile versions of websites.
This is due mostly to the greatly increased mobile traffic that websites are getting nowadays. However, many sites do not have mobile versions, or their mobile content is not optimized for mobile-first indexing. How can we design our content so that we still get high SERP results with mobile-first indexing?
Luckily, I have organised a set of guidelines that you can follow to design content so that it is mobile-first optimized. If you're used to making changes to your content for SEO purposes, this will be a cakewalk.
Visibility between mobile and PC should be the same
In general, if the content on your mobile website is lacking compared to the desktop version, then your traffic will suffer from mobile-first indexing. This is because Google's crawler bots will now be gaining most of their indexed data from the mobile version of your site.
Consistency between mobile and PC
If the vast majority of the content on your website is accessible on your desktop site, but not the mobile version, then Google will rank your site lower with mobile-first indexing. In particular, you want to make sure that your primary content is the same between mobile and desktop versions.
This ensures that all the pertinent ranking information that will bring users to your website is not glossed over with mobile-first indexing.
This especially applies to headings. It can be tempting to make shorter headings for your mobile site, but this can easily have an adverse affect on your rankings. This is particularly important if your desktop site has a lot more content than your mobile site. Consider making sure that the primary content between both versions is as consistent as possible.
Consistent robot meta tag
Make sure to use the same robot meta tags on your mobile site as your desktop site. This will ensure that the crawler bots will not skip over the relevant content in your tags. Using different tags on mobile might cause Google to be unable to properly follow links between the content once mobile-first indexing is enabled.
Don't block too much content
When configuring your Robots.txt file, it's important tomake sure that not too much content on your mobile site is blocked from Google requests. Having large portions of your website be inaccessible to Google makes it impossible to tell how relevant your mobile site is.
This includes CSS and JavaScript content that may be essential for Google to properly rank your mobile site. However, marketers are often struggling with the JavaScript and CSS files blocking. On the one hand, Google page speed and lighthouse report keep telling them the data are slowing down the site. On the other hand, Google requires their visibility for content integrity. With that in mind, just following these two principles:
- If the CSS/JaveScript has an impact on the content perception - don't block it (E.g. Page layout)
- If the CSS/JaveScript has no effect on the content perception - just block it (E.g. chat widget)
Official Google Recommendation:
“CSS is a render-blocking resource. Get it to the client as soon and as quickly as possible to optimize the time to first render.”
Official Google Recommendation:
“JavaScript can also block DOM construction and delay when the page is rendered. To deliver optimal performance … eliminate any unnecessary JavaScript from the critical rendering path.”
Tip: Place links to CSS stylesheets at the top of the HTML <head> and place links to external scripts at the bottom of the HTML <body>
Here are two good reads:
How to Identify & Reduce Render-Blocking Resources
Google Says Robots.txt Blocking Certain External Resources is Okay
Avoid User Interaction based Lazy loading
Google stresses that we make sure not to use excessive lazy loading techniques based on user interactions (such as swiping or typing). Google's crawlers will not be interacting with the site in this way, so they will skip over pertinent content.
Try to keep lazy loading to a minimum on the mobile version of your site. A good alternative to user interactions for lazy loading is visibility triggers. This ensures that Google won't miss any lazy-loaded content that might be important.
Example: <img src="image.png" loading="lazy" alt="…" width="200" height="200">
- auto: Default lazy-loading behavior of the browser, which is the same as not including the attribute.
- lazy: Defer loading of the resource until it reaches a calculated distance from the viewport.
- eager: Load the resource immediately, regardless of where it's located on the page.
Rich media and structured data
Having a lower image/video quality on your mobile site compared to your desktop site will also have an adverse effect on your mobile-first SEO. If possible, make sure that the multimedia content on your mobile website is as consistent and high-quality as possible.
It's also important to make sure that things like thumbnails and such are not too low-quality on your mobile site. Again, it can be tempting to make the thumbnails smaller to fit more on a mobile screen, but this can cause Google to rank the images lower in SERP.
ALT tag, in particular, should be descriptive and meaningful for the user. Google has given a very good example about how you should structure your alt tag:
<img src="dogs.jpg" alt="A photo of cute puppies on a blanket"> (meaningful alt text)
<img src="dogs.jpg" alt> (empty alt text)
<img src="dogs.jpg" alt="Photo"> (alt text not meaningful)
Another critical aspect is placement. Making sure that your image and video content is easily accessible on the first above-the-fold position ensures that Google will rank those images and videos favourably in their index. Conversely, if the media is not easily visible on your mobile site, this can adversely affect your SEO.
The last thing to consider is the video markup. If your desktop website is using schema.org's Video Object structured data to describe videos, ensure that your mobile site is also using the VideoObject, with equivalent information provided. Google's video indexing systems could find it difficult to get enough information about your videos if the cross-device video markup is not consistent, which means they will be treated as less visible for indexing purposes.
