Technical
How to make your pages mobile-friendly
These pages fix their layout to a desktop width in pixels. On a phone that means horizontal scrolling and tiny text, and since Google ranks what it sees on mobile, it is the version that counts.
What it is, and what it costs
A mobile-unfriendly page uses fixed pixel widths and desktop assumptions, so it does not reflow to fit a phone. Under mobile-first indexing, Google evaluates the mobile rendering, so a page that is awkward on a phone is judged on that, and most of your visitors are likely on one.
How to fix it
Replace fixed pixel widths with relative units (%, rem, viewport units) and make sure the viewport meta tag is set to width=device-width. Test the real page on a phone, not just a narrowed browser window.
- WordPress / Shopify / Webflow: modern themes are responsive; the culprit is usually custom CSS or an embedded element with a fixed width. Find and relax it.
How to check your site
Open the page on a phone, or use Google's Mobile-Friendly Test. Look for horizontal scroll and text too small to read.
Related: the mobile viewport tag, which is a prerequisite.
Questions people ask
- I added the viewport tag but it is still not mobile-friendly.
- The tag is necessary but not enough; the layout itself has to use flexible widths. Fix the fixed-pixel CSS.
Does your site have this?
Check your site to see which pages are hard to use on a phone.
See also
- How to improve your Core Web VitalsGoogle watches how quickly your page becomes usable and how much it shifts around as it loads, and it feeds that into ranking. The more direct problem is simpler: a slow page loses readers before they see anything at all.
- How to fix a missing mobile viewport tagWithout a viewport tag, a phone draws your page at desktop width and then shrinks the whole thing to fit. Text comes out too small to read, taps land on the wrong link, and Google indexes the mobile version of your site, so this is the version that counts.
- How to fix a missing character encodingThese pages do not declare a character set, so the browser guesses. When it guesses wrong, accented characters and quotation marks come out as garbage.
- How to fix content that only appears after JavaScriptMost of the text on these pages only appears after JavaScript runs. Search engines do render JavaScript, but later and less reliably, so content that is not in the HTML your server sends may never be indexed.