Is my website mobile-friendly?

Most visitors view your website on a phone. Google does too: Google uses the mobile version of your pages to index and rank them. Whatever isn't on the page on your phone, Google doesn't see either. In this article you'll read how to check for yourself whether your site works well on a small screen.

The viewport rule

A phone doesn't automatically know that your page was made for a small screen. Without instruction, the browser acts as if the screen is much wider and shrinks the whole page. Then you get tiny text that you have to zoom in on. The solution is one line in the <head> of every page:

<meta name="viewport" content="width=device-width, initial-scale=1">

• No fixed width such as width=1024: then the phone will again act as if the screen is wide.
• Don't block zooming: leave out user-scalable=no and maximum-scale=1. People with poor eyesight need to be able to enlarge text.

The AI Builder, WordPress themes, and most other website builders add this line to every page automatically. For a custom-built or old site, it's worth checking: open a page, right-click, choose View Page Source (or Ctrl+U) and use Ctrl+F to search for viewport.

Testing it yourself

1. Open your site on your own phone and go through your most important pages.
2. Or on a computer: open your site in Chrome or Firefox, press F12, and click the phone and tablet icon. Choose a narrow device.
3. Watch out for text that falls outside the view, a page you need to scroll sideways on, buttons that are too small or overlapping, and parts that are missing on mobile.
4. Then test in PageSpeed Insights on the Mobile tab. How to read that report is explained in Reading PageSpeed Insights: Core Web Vitals in plain language.

Google's separate Mobile-Friendly Test and the Mobile Usability report in Search Console no longer exist since December 1, 2023. If you come across them in an old article, use the steps above instead.

Same content on mobile and desktop

With a responsive site (one address and one page that adapts to the screen width), the content is automatically the same. Google recommends this approach. If you have a separate mobile site, such as m.example.com, or a system that sends phones different pages, check the following:

• same text, even if it's in a collapsible section on mobile;
• same title and description;
• same images with the same alt text;
• no content that only loads when the visitor swipes, clicks, or types: Google doesn't do that.

Further reading

• Google: recommended practices for mobile-first indexing (English)
• MDN: the viewport rule (English)