Mobile is the real page

Set the viewport, never scroll sideways, give phones everything.

From seo-audit, Technical SEO: Mobile-Friendliness.

Configure the viewport

Pick a device, then edit the tag or load a preset.

No viewport tagBad
    <!-- no viewport meta: 980px layout -->
    Your tagGood
      <meta name="viewport" content="width=device-width, initial-scale=1">

      Never scroll sideways

      Drag the width to 320px, then switch to Fixed.

      NorthwindInvoicesHelp

      Invoice INV-000481

      hero.jpg · 520 × 228
      Pay nowDownload PDFDispute

      Pay link: https://billing.northwind.example/pay/INV-000481-2026-09-a8f3c1d9e2b7f4

      ItemQtyRateTaxAmount
      Monthly bookkeeping1$1,200.00$0.00$1,200.00
      Payroll, 14 employees14$12.00$0.00$168.00

        img, video, svg { max-width: 100%; height: auto; }
        .table-wrap     { overflow-x: auto; }
        .actions        { display: flex; flex-wrap: wrap; gap: 8px; }
        p, td           { overflow-wrap: anywhere; }

        Serve the same content

        Switch architecture, then search a phrase.

        Desktop, example.comNot indexed
        Mobile, m.example.comIndexed

        <link rel="canonical" href="https://example.com/lumen-14">
        
        <details><summary>Specs</summary> Battery life 18 hours … </details>
        
        @media (min-width: 768px) { .specs { columns: 2; } }

        Why it matters, pros and cons

        Why it matters

        Google crawls with a smartphone agent. The mobile page is the one it judges.

        Pros

        • One URL per page, signals not split.
        • Readable without pinch-zoom.
        • No m. redirects to keep in sync.

        Cons

        • Phones get desktop assets without srcset.
        • Wide tables need real mobile design work.
        • overflow-x: hidden hides the scrollbar, not the problem.