meta viewport

Ausgabe für mobile Geräte optimieren

  Der Viewport ist der für den Benutzer sichtbare Bereich einer Webseite (ohne horizontal zu scrollen). Dieser Platz variiert logischerweise je nach Monitor und ist auf einem Mobiltelefon viel kleiner als auf einem Desktop-Monitor oder Laptop.
Mit der dieser Zeile optimierst du die Ansicht deiner Webseite auf kleinen Geräten. 

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

Viewport
Bild: Viewport - Autor: Seobility

Früher war es war üblich, dass Websites ein statisches Design mit einer festen Breite hatten. Als Tablets und Mobiltelefone aufkamen, waren Webseiten mit fixer Breite jedoch ungeeignet, um in das Ansichtsfenster der neuartigen Geräte zu passen. Die Browser verkleinerten deshalb die Ausgabe einfach, damit sie in das Display passte. Dabei wurden jedoch auch die Texte so stark verkleinert, dass sie kaum mehr lesbar waren. Dieses Verhalten kannst du durchbrechen, wenn du den Viewport definierst.