Füge den HTML-Quellcode deiner Seite ein und prüfe sofort, ob dein Viewport-Meta-Tag korrekt für die mobile Darstellung konfiguriert ist – inklusive Geräte-Vorschau und konkreten Empfehlungen.
Tipp: Im Browser Rechtsklick → "Seitenquelltext anzeigen" → alles kopieren und hier einfügen.
–
So wirkt sich dein Viewport-Tag auf einem Smartphone aus.
Korrekter Viewport
Deine Seite
Jede Eigenschaft des Viewport-Tags einzeln bewertet.
Der Viewport-Meta-Tag steuert, wie ein Browser die Seite auf mobilen Geräten skaliert und darstellt. Fehlt er, rendert ein Smartphone die Seite in der Regel mit einer Breite von 980 Pixeln und zoomt herunter – Text wird winzig, Nutzer müssen ständig zoomen und scrollen. Da Google seit Jahren Mobile-First-Indexing nutzt, bewertet die Suchmaschine vorrangig die mobile Version deiner Seite. Ein fehlender oder falsch konfigurierter Viewport-Tag löst in der Google Search Console die Meldung "Text ist zu klein zum Lesen" oder "Anklickbare Elemente liegen zu nah beieinander" aus und schadet den Rankings direkt.
Google crawlt und bewertet die mobile Version. Ohne korrekten Viewport gilt deine Seite als nicht mobilfreundlich.
Lesbare Schrift und vernünftige Tap-Ziele senken die Absprungrate – ein indirektes, aber spürbares Ranking-Signal.
Wer Zoom über user-scalable=no sperrt, schließt sehbehinderte Nutzer aus. Das solltest du vermeiden.
| Eigenschaft | Empfehlung | Zweck |
|---|---|---|
| width | device-width | Setzt die Layout-Breite auf die echte Gerätebreite |
| initial-scale | 1 | Anfangs-Zoomfaktor beim Laden der Seite |
| maximum-scale | weglassen | Begrenzt Zoom – schadet der Barrierefreiheit, wenn < 2 |
| user-scalable | weglassen / yes | no sperrt Zoom komplett – nicht empfohlen |
| viewport-fit | cover (optional) | Für randlose Layouts auf Geräten mit Notch |
<meta name="viewport" content="width=device-width, initial-scale=1">
Dieser Tag gehört in den <head>-Bereich jeder Seite. Mehr ist in den allermeisten Fällen nicht nötig – zusätzliche Eigenschaften wie maximum-scale oder user-scalable=no richten meist mehr Schaden als Nutzen an.
Verwandte Tools: Page-Speed-Estimator · Meta-Tag-Generator · Text-zu-HTML-Ratio-Checker
Mehr dazu im Blog: Viewport-Meta-Tag richtig setzen · Mobile SEO & Responsive Design
Der Viewport-Tag ist nur ein Baustein der mobilen Optimierung. Entdecke alle SEO-Probleme deiner Website mit unserer kostenlosen Analyse.
Kostenlos analysieren