More online users are browsing the web from mobile devices than ever before. If your site is not mobile friendly, you risk losing a major competitive advantage. Here we’ll cover the following on how to improve your mobile SEO and drive more sales to your business:
- Why Mobile SEO Matters
- Mobile Web Design Configurations
- How to Implement a Responsive Design
- How to Improve Your Mobile Site Speed
- Optimise for Local Search Queries
- Utilise Structured Data
- Mobile UX Best Practices
Why Mobile SEO Matters
Mobile SEO refers to optimising a website to rank higher for mobile search queries. It also means ensuring a flawless browsing experience for users across all devices. Here are several compelling reasons why mobile SEO needs to be a priority for your business:
Mobile Traffic Exceeds Desktop Traffic
The use of mobile devices continues to see astronomical growth. We have now reached a critical stage where global mobile traffic has eclipsed desktop traffic:
Google doesn’t just dominate desktop searches but mobile as well with over 93% of mobile search traffic. It is no longer a question then of whether mobile marketing is important. We know it is. Positioning your brand in front of mobile users then starts with mobile SEO.
Mobile is Now a Major Ranking Factor
Google’s primary focus has always been to deliver the most relevant results. The fact that more users browse the web from mobile means the algorithms had to adapt to these usage patterns. Google made a major announcement that it would make mobile-friendliness a ranking factor:
“This change will affect mobile searches in all languages worldwide and will have a significant impact on our search results. Consequently, users will find it easier to get relevant, high-quality search results that are optimised for their devices.”
Not optimising for mobile means that your site is likely ranking lower in the mobile search results.
Users Prefer Mobile-Friendly Sites
Nothing is more frustrating than landing on a poorly optimised site. Rather than pinch and zoom around a page, users are more likely to leave instead. A study from Google found that 65% of users are more likely to buy from a mobile-friendly site and 59% indicated they would leave if they weren’t able to find what they were looking for:
The implications are clear—Mobile is essential to increasing user engagement and driving sales.
Unfortunately, much of the web has yet to make the transition to mobile-friendly designs. This is also good news though as taking the right steps will give your business a major competitive advantage online. Next, we’ll look at the most common mobile configurations and which one is recommended.
Mobile Web Design Configurations
Websites that work for desktops don’t always translate well to mobile devices due to their display sizes. The key to delivering an engaging user experience lies in how you set up your mobile site. Here are the three main configurations to make your site mobile-friendly:
Responsive Design
Responsive design is based on a grid-like structure that dynamically adjusts to fit all screen sizes. Users are served the same HTML code and content on the same URL whether they’re browsing from a desktop, smartphone, or tablet.
Dynamic Serving
Dynamic serving is a setup that uses the same URL but serves a different version of HTML and CSS code depending on the user’s device. Valid headers tell browsers how to display the content and help Googlebot discover your mobile-friendly site faster.
Separate URLs
This configuration involves creating two separate URLs, one for the desktop version of a site and another for its mobile counterpart. Users are then served different code depending on their device. A common setup is to direct desktop users to www.examplesite.com and mobile users to m.examplesite.com. One obvious downside is having to allocate additional resources to maintaining a separate URL.Head over to Google’s Mobile-Friendly Test tool. Simply enter your site URL and click the “Run Test” button. If your site isn’t optimised for mobile devices, you’ll see the following message and a preview of how the Googlebots view the page:
The tool details glaring issues that need to be addressed. If you’re getting the same message, then now is the time to make the change to a mobile-friendly design.
Google supports different mobile setups but responsive design is their recommended configuration. Having one URL makes it easier for Googlebots to crawl and index your pages and is far more efficient as there is only one version of your content to update.
How to Implement a Responsive Design
Online users today use a multitude of devices to browse the web. Designing for each is both impractical and a waste of resources. Responsive design solves this problem by automatically adjusting to provide an optimal viewing experience across all devices.
Here is a basic overview of how to make your site responsive:
Set the Viewport
The meta viewport tag allows pages to dynamically adjust to different screen sizes whether a page is rendered on a small mobile display or a large monitor. Adding the “initial-scale=1” attribute instructs browsers to keep the same zoom even when rotating to landscape mode.
Add the following tag to all your web pages:
<meta name="viewport" content="width=device-width, initial-scale=1">
Size Content to the Viewport
It’s important that your content fits within the viewport. Forcing users to scroll horizontally or zoom out to browse your content leads to a poor user experience. One common occurrence is when images or other elements are displayed at a fixed width that is wider than the viewport. The solution then is not to use any largely fixed width elements.
Use the width property attribute allows you to make responsive images scale:
<img src="img.jpg" style="width:100%;">
Use CSS Media Queries
Media queries allow you to apply different CSS styles depending on the device or specific characters such as the width of the viewport. One example is that stylesheet changes be applied based on how the screen is resized (e.g. portrait vs. landscape). Media queries are particularly useful to establish breakpoints—parts of a design that behave differently depending on the display size—and give you more flexibility over a site’s layout across any device.World Wildlife Fund implements a responsive design for its site. Here’s how it looks on a desktop:
The elements on the page automatically resize for mobile users:
All without having to create and manage a separate mobile site. Another alternative that requires far less effort is to choose a CMS and theme that adapts to all screen sizes. WordPress is a great place to start as many of the available themes are already responsive out of the box. You won’t need to do anything else except download and install an appropriate theme.
How to Improve Your Mobile Site Speed
Site performance matters on the web. Online users today expect fast browsing experience and will not hesitate to leave sites that take too long to load. A study conducted by Google found a strong correlation between bounce rates and mobile loading times:
Each second that users spend staring at a blank page drastically increases the chances they’ll bounce out and click through to a competing page. A high bounce rate has a negative impact on your conversions and leads a poor impression with your visitors. Site speed is also a ranking factor so your site could rank lower in the mobile search results due to slow loading times.
Use Google’s PageSpeed Insights for a page speed score of the mobile and desktop versions of your site. The tool also provides optimisation tips on what you can do to improve performance:
If your score is green then your site performance is above average. But if your scores are orange or red, your users could be bouncing out due to poor loading times.
Here are a few ways you can dramatically improve your site speed:
Compress and Reduce Image File Sizes
Too many images can impact loading times as each one needs to load. Use a tool like ImageOptim to compress your images and reduce their file sizes before uploading them to your pages. If you use WordPress, there are various plugins available that accomplish the same thing.
Leverage Browser Caching
Browsing caching stores certain files locally so pages load faster on subsequent visits. Leveraging caching allows pages to download and display new content. Google recommends a minimum cache time of one week but preferably up to one year for static elements. Browsing caching can be set by editing your .htaccess file or by using a plugin like W3 Total Cache if you use WordPress.
Minify Resources
Minifying code like HTML and CSS involves removing any redundant data and combining files together to further reduce loading times. Fewer files mean that the browser has to load fewer resources, leading to better overall performance. Google provides a number of resources to minify HTML, CSS, and JavaScript. Alternatively, there are also a number of WordPress plugins that streamline the process.
Use a CDNConsider using a CDN (Content Delivery Network) to really boost your site performance. A CDN consists of a high-speed network of servers around the world. Instead of connecting to the website’s origin server, a CDN serves content to users from the closest data center thereby improving loading times. The cost for a CDN varies depending on your bandwidth needs.
Every second counts. Even a one-second improvement can help reduce bounce rates and increase user engagement on your pages.
Optimise for Local Search Queries
Mobile devices tend to be most often used on the go. If you sell products or offer services locally, you won’t want to ignore local search. Data from Google found that 4 out of 5 consumers use search engines to find local businesses. 50% of consumers who search on a smartphone also go on to visit a store within a day. Ranking for local queries then positions your brand in front of prospects searching for your products or services.
Just like with ranking for regular desktop searches, Google relies on complex algorithms that weigh different factors. Here are some of the major local ranking factors according to a case study by Moz:
Here is how you can improve your mobile SEO for local search:
Optimise On-Page Factors
The first step to ranking for your target keywords is to improve the relevance of your site. Start by optimising these key on-page factors of your site:
- Titles: The titles are perhaps the most important ranking factor. Include your target keywords along with the city name your products or services are available in (e.g. “Built-In Storage Solutions in Perth”) to target local searches. Keep your titles under 70 characters so they display properly in the search results.
- Headers: Headers provide more structure for your content and improve its readability for your visitors. Use secondary and related phrases in your headers. Stick to one H1 tag and use for H2 or H3 tags for subheadings.
- NAP: NAP refers to Name, Address, and Phone Number. Search engines look for these details to confirm the legitimacy of your business. They should also be clearly visible on your pages so visitors can easily get in touch.
- Content: The key to ranking at the top of the search results is with quality and relevant content. Be sure to also optimise your content for your target keywords. But be careful not to stuff your content with keywords as doing so could lead to a ranking penalty.
Finally, here is an example of what a perfectly optimised page looks like:
Build Local Citations
Citations are any mention of your business name on the web and are beneficial from a user and search engine standpoint—Users can discover your business on other channels and they impact rankings in the local search pack:\
Google My Business is one of the most important platforms to get started with as a profile lets you manage your presence across Search and Maps. Be sure to completely fill out all aspects of your profile and verify your business to confirm that you’re the owner. Submit your business to other relevant directories and keep the citations consistent across all your profile.
Build Quality Links
Links continue to carry a great deal of weight for mobile SEO. Generally, the more you have the better but this isn’t always the case. A link from a relevant and authoritative source carries far more value than a link from a spammy source.Here are ways to build quality links back to your pages:
- Guest post: Guest posting offers an excellent way to build quality links back to your site and involves submitting content to other sites in exchange for a link. Guest posting on popular sites has the added benefit of driving more targeted traffic to your site.
- Start a blog: Data from HubSpot found that companies that blog frequently generate 4 times as many leads than companies that only post a few times a month. Focus on creating quality and engaging content for your target audience. Create local resources to improve your rankings and attract quality links.
- Create social media profiles: Social signals only account for a small percentage of local ranking factors but submitting to networks like Facebook and Twitter are still worth the effort. Completely fill out your profiles and post regular updates to build a following for your brand.
Utilise Structured Data
Adding structured data provides search engines with more context about your pages and enables rich snippets. Web pages can be marked up with vocabulary from Schema.org. There are different data types available but these are some of the most common:- Articles
- Restaurants
- Reviews
- Events
- Products
- Local businesses
Here is an example of how structured data is used to display additional details for a recipe:555
Structured data displays a star rating, picture, and cook time for this search result.
While structured data may not lead to better rankings, it indirectly helps your site by improving click through rates. The search result above is far more enticing to click on in contrast to a listing that simply displays the page title, URL, and description.
Here is how to get started with structured data:
Use the Structured Data Markup Helper Tool
Get started by heading over to the Structured Data Markup Helper tool:
Select a data type that is relevant for your content. If you are a local business, then choose “Local Businesses”. Then enter in your URL and click the “Start Tagging” button.
Highlight Page Elements
The tool then loads the URL you entered and displays a panel on the right with your data items. The next step is to simply highlight the elements on the page to mark up and a tooltip will display:
Be sure to tag all the relevant elements on your page. You can also tag other elements that don’t appear on the page by clicking the “Add Missing Tags” button.
Add the Schema Markup Code
Once you finish marking up your pages, click the “Create HTML” button at the top. The pane on the right will then expand to display the HTML of your page with the relevant microdata.
Then simply copy the code and paste it directly into you CMS. Alternatively, you can also copy the relevant parts with the markup code and paste that in instead. Use the Structured Data Testing Tool to verify that the schema data on your pages is correct.
Mobile UX Best Practices
Optimising your mobile SEO is key to improving your rankings. But you also don’t want to neglect your users as they will be the ones actually using your site. Driving more conversions starts with making a good impression and creating a flawless browsing experience.Here are some mobile SEO best practices to improve the usability of your site:
- Avoid Flash: Flash may have been popular before but the technology is now largely obsolete as some mobile browsers (such as Safari on iOS) are unable to view Flash content. For animations, use HTML5 or Java.
- Eliminate pop-ups: Large pop-ups only lead to a poor user experience as they tend to block the whole page. Google has even begun cracking down on sites that use intrusive ads. Refrain from using pop-ups on your site entirely or reduce their usage.
- Keep resources crawlable: Don’t block Googlebots from accessing critical assets like JavaScript, HTML, and CSS. Doing so prevents search engines from detecting that a page is mobile-friendly and could affect how the content is served to mobile users.
- Improve tap targets: Touch elements on a page such as links and buttons should be spaced far enough apart that users do not accidentally tap the wrong one.
- Use legible font sizes: Nothing is more frustrating than having to zoom in and out to read content. Set a font size that scales properly with the specific viewport. Be sure to test your site on a mobile device to see how the page renders.
Be sure to address all usability issues to provide a better user experience for your visitors.
Global traffic from mobile devices continues to see exponential growth and data shows that these trends have no signs of slowing down. Mobile then has become absolutely essential to compete online. Follow the strategies here to improve your mobile search rankings or get in touch with our team to learn more about our mobile SEO Services.