Was ist ein Ansichtsfenster?
Der Viewport ist der sichtbare Bereich einer Webseite. Er variiert je nach Gerät und kann je nach Bildschirmauflösung des Geräts größer oder kleiner sein.
Das folgende Bild zeigt den Ansichtsbereich derselben Webseite auf verschiedenen Geräten. Beachten Sie, dass Sie mehr Inhalt sehen, wenn die Länge des Ansichtsbereichs zunimmt. Das Format der Webseite ändert sich auch je nach Breite des Ansichtsbereichs. Je breiter der Ansichtsbereich, desto mehr Inhalt wird auf der Seite angezeigt.
Unabhängig von der Auflösung des Anzeigegeräts ändert sich der Ansichtsbereich, wenn der Benutzer die Größe des Browserfensters ändert. Im Bild unten können Sie beispielsweise sehen, dass sich der Ansichtsbereich verkleinert, wenn die Browsergröße verringert wird.
Das Ansichtsfenster ist eine entscheidende Komponente des Responsive Designs, um allen Benutzern unabhängig vom Gerät dieselbe Webseite bereitzustellen.
Sie können das Ansichtsfenster mit dem Viewport-Metatag angeben, wie unten gezeigt.
<meta name="viewport" content="width=device-width, initial-scale=1" />