How to Make sure Your Sitecore Website is Mobile-Friendly (and What to Do If It’s Not)

We’ve become a mobile-first society, there’s no need to sugarcoat it. You’ve got to keep your Sitecore implementation up to speed with the world around you, if you don’t it’ll cost you. Here’s how to make sure you’re on the right track to success, and what to do if you aren’t.

Tell us if this sounds familiar:

You’ve begun to notice some dips in your SEO rankings over the past year. You haven’t changed anything with your website, and to your knowledge, your content is as SEO-optimized as ever. Your engagement rates are steady, and you’ve even earned some new quality backlinks.

So what gives?

As with any SEO riddle, the root cause could be a variety of things. But if all things otherwise seem fine, your Sitecore website may have fallen victim to Google’s switch to a mobile-first index.

What is mobile-first indexing?

In 2018, Google began shifting to a mobile-first index. As of July 1, 2019, mobile-first indexing became the new norm for all existing and new domains.

But what exactly is mobile-first indexing? In Google’s own words:

“Mobile-first indexing means Google predominantly uses the mobile version of the content for indexing and ranking. Historically, the index primarily used the desktop version of a page’s content when evaluating the relevance of a page to a user’s query. Since the majority of users now access Google Search with a mobile device, Googlebot primarily crawls and indexes pages with the smartphone agent going forward.”

Translating Googlespeak into plain English, mobile-first indexing means that Google now uses the mobile version of your website to determine whether to rank it for keywords. If no mobile version is available, only then will it look at the desktop version of your website.

In other words, if your mobile site loads at a snail’s pace, is barely readable because everything is so tiny, or lacks key content that’s only available on the desktop version of your website, it doesn’t matter how SEO-optimized the desktop version of your website is. Because Google is primarily looking at the mobile version now.

Why is Google doing this?

Because we live in a mobile-first world. It only makes sense that our search engines should operate accordingly. Mobile internet use outpaced desktop way back in 2016:

People who use their mobile phones to browse the internet deserve to visit websites that load fast, prioritize the mobile experience, and are just as easy to use on mobile as they are on desktop.

How do you know if your Sitecore website fits the bill? Google offers a free tool that helps you discover just that.

How to test if your Sitecore website is mobile-first

If you have Google Search Console set up for your website, you may have already received an email notification letting you know that mobile-first indexing has been enabled for your site.

You can also see the exact date mobile-first indexing was enabled for your site by logging into Google Search Console and navigating to the Settings screen:

If you haven’t received a message like this, don’t fret.

The first step is to know if your site delivers the same content to mobile users that it delivers to desktop ones. If your Sitecore website delivers a fully responsive experience, then you’re probably good to go.

But even if you’re delivering a responsive site, you shouldn’t be too quick to pat yourselves on the back. Google made this change because the majority of people now use mobile devices on the web. Your site may be responsive, but is it also usable? Is it quick for mobile users? This is a good time to reevaluate whether a poor mobile experience is frustrating your customers.

If you’re delivering a separate mobile site, then you want to make sure what you’re delivering is in parity with the desktop site. Your content should match, your load times should match, and the user experience should match.

You can check if your site is prepared for mobile-first indexing by running your domain through Google’s free Mobile-Friendly Testing Tool:

You’ll get one of two results. You’ll either see a happy green message or a scary red one:

If you see green, congratulations!

You can consider this box on your SEO checklist checked—but don’t break out the champagne just yet.

Even sites that are mobile-friendly can have some mobile compatibility issues (note the yellow warning icon and “Page loading issues” message in the screenshot above). These are worth working on if you want to stay competitive in the SERPs. We tackle SEO tasks like these regularly as part of our Sitecore Managed Services.

If you see red, you have some work to do.

But don’t worry—we’re going to walk you through the steps you need to take in the next section.

Whether you passed or failed, Google’s tool will still offer specific instructions for how you can improve your website to make it more mobile-friendly.

Mobile-first best practices for Sitecore websites

If you want your Sitecore website to rank well in a mobile-first world, you need to go beyond mobile-friendly. Your site needs to be mobile-easy.

SEO is getting increasingly competitive. Your competitors may be doing all they can to ensure that their SEO is unbeatable. That includes making sure their websites are just as easy to use on smartphones as they are on desktop computers.

If the same can’t be said for your website, read on. We’re covering the top mobile-first best practices for Sitecore websites, whether you’re already delivering a responsive site or manage a separate mobile domain.

1. Change to responsive design

Google has a strong preference for responsive design. If you’re still operating a separate mobile domain, consider this your opportunity to make the switch to a single responsive site. Both your customers and Google will thank you for it.

Responsive design is the right move for your website in the long-term, anyway. It’s a lot easier to add to a design experience when moving from mobile to desktop, than it is to take away and reduce going from desktop to mobile.

And as more people use mobile devices to browse the internet—from smartphones to tablets to devices that haven’t been invented yet—the better your site will be able to serve them, by simply adapting to the screen size of their choice.

It’s time to make your desktop and mobile experience truly equivalent. Transition to responsive design and improve the mobile experience for your customers.

2. Give your site speed a boost

Site speed has been a ranking factor for almost a decade, and it’s even more critical on smartphones. People don’t have time to wait around for your website to load.

Site speed is so important to the mobile user experience, that we’ve written an entire article on optimizing your Sitecore website for speed . We recommend reading the whole article, but here are the highlights:

• Optimize, minify, and compress your Javascript, CSS, and HTML. Comb through your code and remove extra characters, empty attributes, and comments that bloat your code and slow down load time. (Your Sitecore partner can help you with this!)

• Leverage browser caching. Browser caching allows your visitors’ browsers to store (or “cache”) certain static elements of your website so they don’t have to reload them every time they visit. Think of items like your logo, style elements, and others, which don’t change very often.

• Review your third-party plugins. If there are any you’re no longer using, remove them. If there are some you’re using that are bogging down your load time, see if there’s a faster version available from another provider.

• Improve your server response time. Your Sitecore partner can help you optimize your hosting environment to improve load times on mobile devices. They may adjust your traffic tier ( if you’re hosting on Azure ) or the number of physical instances you have deployed (if you’re using AWS).

3. Optimize your images

Under-optimized images are one of the biggest culprits behind slow-loading Sitecore websites . Follow these tips to optimize them for a faster mobile experience:

• Use the right file format. Some file formats have larger sizes than others, and you may be using a premium file format for an image that doesn’t require it. Use PNGs for graphics and JPEGs for photos.

• Compress your images before uploading them. Your images need to load well on mobile devices; not be ready for the next issue of Time Magazine. As such, they can have a slightly lower quality while still looking amazing on a mobile or desktop device. For optimizing images in Sitecore specifically, we recommend Dianoga —it automatically resizes your images for you!

• Work with your Sitecore partner to fix your Sitecore Media Settings. Here you can adjust the limits for file size, quality, and resizing. Your goal is to only serve the largest required image size for mobile screens to your mobile users—as opposed to making them wait to download a huge image fit for a massive desktop monitor.

• Try lazy loading. Lazy loading only loads images on your page once they become visible to the user. Images at the bottom of a page won’t load until your visitor scrolls down to view them—speeding up the mobile experience.

4. Review your mobile UX and CRO

Finally, let’s look at two elements that often go overlooked when people think about SEO—but they work hand in hand: UX (user experience) and CRO (conversion rate optimization).

If you want to turn one-off visitors into buying customers, and turn those buying customers into brand loyalists, your website needs to be easy for them to use, and easy for them to convert.

Both of these fields cover a broad area, but let’s focus on the three areas most relevant to the mobile experience.

• Make things easy to click. When we say “things,” we mean everything clickable on your website, from your CTA buttons to in-text links. A good rule is to make the clickable area about the size of a thumb. Also ensure that your clickable areas don’t overlap, so if someone has a “fat finger” they won’t accidentally end up clicking on the wrong thing.

• Make things easy to read. More readable content is more mobile-friendly content—because people will actually stick around to read it. Break up your copy with lots of white space, sub-headings, and line breaks. Use a font size of at least 16px for your regular text (headers can be larger). You can also create expandable content sections (like a FAQ) where people can quickly scroll to the section they’re interested in.

• Make things easy to buy. Finally, walk yourself (and ideally, a test group of your target customers) through the experience of converting on your website—whether that’s signing up as a lead, registering for a webinar, or purchasing a product. Is every single stage of that process as simple as it could be? If not, make it so!

Making your Sitecore website mobile-first

There’s a lot you can do to make your Sitecore website ready for Google’s mobile-first index. If you’d like experts to help guide the way, contact us.

We’re here to help you deliver the best site experience for your mobile visitors—so they can explore your website, engage with your brand, and convert, regardless of what device they’re using.