Wozu dient das Viewport?

Der Viewport bestimmt den sichtbaren Bereich einer Webseite im Browserfenster. Er ist notwendig für:

• Responsives Design: Ermöglicht die Erstellung von Layouts, die sich an verschiedene Bildschirmgrößen von Geräten anpassen (Smartphones, Tablets, Desktops).
• Skalierung des Inhalts: Steuert, wie der Inhalt angezeigt und je nach Gerätegröße skaliert wird.

<!-- Meta-Tag zur Einstellung des Viewports -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">

Parameter content:

• width=device-width: Die Breite des Viewports entspricht der Breite des Geräts in CSS-Pixel.
• initial-scale=1.0: Legt den anfänglichen Zoom-Level der Seite fest.

Eine korrekte Einstellung des Viewports sorgt für eine angenehme Darstellung der Website auf allen Geräten, verbessert die Nutzererfahrung und SEO.