SEO Small
Add a viewport meta tag
The viewport meta tag tells mobile browsers how to scale the page instead of rendering it at desktop width and shrinking everything down. It is a prerequisite for any responsive CSS to actually take effect on a phone, and Google has used mobile-friendliness as a ranking factor for years.
Why it matters
Without a viewport tag, mobile browsers render the page at desktop width and shrink it, making text unreadable and hurting both mobile usability and Google's mobile-first ranking.
How to fix
- 1 Add <meta name="viewport" content="width=device-width, initial-scale=1"> to <head>.
- 2 Verify the layout responds correctly at common mobile widths.
Common mistakes
- Adding the tag but setting a fixed width instead of width=device-width, which still forces the same rendering problem it was meant to fix.
- Setting user-scalable=no or a restrictive maximum-scale, which improves layout consistency but harms accessibility for users who need to zoom.
- Adding the tag only to some templates (e.g. the homepage) and missing it on others generated by a different code path.
How to verify
- 1 View page source and confirm <meta name="viewport" content="width=device-width, initial-scale=1"> is present.
- 2 Load the page on an actual mobile device or a browser device emulator and confirm text and layout scale correctly without manual zooming.
- 3 Run the page through a mobile-friendliness testing tool to confirm no warnings are raised.
Related checks
Ready to see where you stand?
Scan your site and get your Engineering Score with a prioritized roadmap in under a minute, no signup required.
EngineeringScore