After a year and a half of testing, Google released its first mobile-first indexing in March 2018. What this means is that Google will use the mobile version of your website for indexing and ranking. They took this decision because the majority of Google users were searching from their mobile device.
If you only have a desktop website, Google will still index it, but you may not rank as well as mobile-friendly websites. You may even have lower rankings on desktop searches as well.
Thus, it’s safe to say that focusing on improving your mobile website has never been more important. If you provide a better mobile experience, Google will potentially reward you with increased rankings, both on mobile and desktop searches.
Here are essential mobile SEO and user experience tips for your mobile website.
Responsive web design (RWD) is Google’s recommended design pattern. A responsive website simply adjusts to all screen sizes and orientations to provide the best experience on all devices.
Whether a user visits your website from a tablet, smartphone or desktop, your website must adapt to the screen size. Although RWD accomplishes this, there are other ways to do that. For example, through an m-dot website.
However, RWD has many benefits over m-dot and other design patterns:
- Provides a single URL that makes it easier for users to link and share your content.
- Helps Googlebot accurately index a single page instead of indexing the desktop and mobile pages.
- Makes maintaining multiple pages for the same content easier.
- Reduces errors regarding mobile sites.
- Reduces load time by avoiding redirection to a device-optimized webpage.
- Googlebot crawls your page only once, so that more of your site’s content is indexed and kept fresh.
All things considered, sites with responsive web design get higher rankings and consequently more conversions.
Page Load Speed
Website loading time is an important mobile SEO and desktop SEO factor. The faster a website loads, the higher it will rank in SERPs. However, if your website is fast on desktop, this doesn’t mean it is fast on mobile devices.
To check how fast your website is, use Google’s PageSpeed Insights. It will show you how fast your website loads on both mobile and desktop views. It also provides tips to improve your website’s performance.
Page loading speed affects conversion rates and revenue too. According to data from Akamai, 64% of smartphone users expect pages to load in less than four seconds. Moreover, one second delay in page load time means 11% loss of page views and 7% reduction in conversions.
To speed up your mobile website, use minify code, a tool to compress the code on your website. This helps boost the loading speed while keeping the code’s functionality and website features the same. Other ways to speed up your website include using a CDN, using RFPL caching, and compressing your images.
Images take the most space on your website server by far. Thus, it’s crucial to keep them as compressed as possible to unburden your website speed. Although they take up so much space, it’s always best to include them across all your content.
You can optimize images for the web in several ways. In WordPress, use the Smush plugin that can automatically compress your images. If you want to do it manually, use a website like compressjpeg.com or optimize your images in Photoshop with the Save for Web option. These tools can compress photos up to 95% while keeping the quality intact, so they’re definitely worth it.
Accelerated Mobile Pages
Accelerated Mobile Pages (AMPs) are links that appear at the top of Google mobile result pages. They usually appear with an AMP icon in carousels and rich results.
AMPs load almost instantly when you click on them, which is a big advantage since speed is essential in mobile SEO. This is because they are already cached by Google as opposed to being hosted on the website’s original server.
The other great thing about AMPs is that they may contain images or videos, which would otherwise bog down normal pages.
The best practice for using AMPs is to create accelerated versions of your essential webpages or ads. So you’ll have two versions of a page: the regular version and the accelerated version. You may use AMP for different types of content: blog articles, news article, videos, recipes, movies, and more.
All in all, accelerated pages are given priority in mobile results. To get started with AMP and use this feature to your advantage, visit ampproject.org.
Don’t use Flash
Flash is an outdated technology that most mobile browsers don’t support. If your webpage relies on Flash to display content like animations, most mobile visitors won’t be able to see it. That’s embarrassing for you and frustrating for your visitors.
In addition to unplayable content, Flash also drags your site speed down considerably. Therefore, your webpage will be marked as non-mobile friendly by Google and will get lower rankings.
What you can use instead of Flash are modern web technologies such as HTML5 in tools like Google WebDesigner. In addition, use video-embedding that can be played on all devices. Consider having a transcript of the videos to provide accessibility options. Google will appreciate this and boost your rankings.
Reading on mobile devices should be as painless as possible. If your font size is too small, you’ll force your visitors to pinch and zoom in order to read. And that’s clearly a poor user experience.
So make sure your responsive website scales the content AND font size according the device. On smartphones, the recommended font size is 16 pixels. That’s large enough to prevent most visitors from squinting their eyes.
In addition to larger fonts, you can improve your website’s usability by providing large and loose touch elements. Don’t cram your buttons and navigational links together otherwise users may tap on nearby elements. This is not only frustrating, but users can also compromise their personal information by mistake.
Thus, correctly size and space touch elements for mobile devices. For example, the recommended touch target size is 48×48 pixels. This area corresponds to around 9mm, which is about the size of a person’s finger pad area. Moreover, touch elements should be spaced about 32 pixels apart horizontally and vertically.
Don’t Use Popups
On both desktop and mobile, many websites still use popups/interstitials to promote sign-up forms, ads, or other content. As if it wasn’t bad enough to deal with them on desktop, they’re even worse on mobile. Mobile users have difficulty dismissing them due to the smaller screen size.
Popups are not the problem per se. Blocked content is the main issue. Since January 2017, Google started penalizing websites that restrict access to content.
Instead of intrusive popups, you should use a simple banner inline with the page’s content. The banner can be created by using an HTML banner or image, which are similar to ads. Another alternative is using a browser-supported banner such Native App Banners for Chrome.
Resolve any errors and bugs on your website if you have high expectations for it. Errors such as non-existing pages (404) and faulty redirects leading to the page’s desktop version are issues that need immediate fixing. You might also have duplicate title tags (web pages with the same name) or even worse – duplicate content.
If you’re not sure if your website is faulty, use a tool like seoprofiler.com that shows common website mistakes. Eliminate these issues as soon as possible to optimize the performance of your web pages and get higher rankings.
Google has confirmed that more searches are performed on mobile devices than desktop. Consequently, the mobile version of your website now forms the basis of your Google desktop and mobile ranking.
To stay ahead of the game, you should follow the best mobile SEO best practices. Use responsive design, improve your website speed, optimize your images, avoid using unplayable content, improve usability, and fix technical errors.
If you follow these mobile SEO tips, you’ll see your mobile rankings soar.