Webdesign für große Bildschirme

Dieser Leitfaden demonstriert eine Reihe von praktischen Webdesign-Techniken zur Optimierungen für große Screens.

Was fällt Ihnen beim Thema "Responsive Webdesign" ein? Wahrscheinlich denken Sie – wie die meisten – daran, dass sich Webseiten an die kleinen Bildschirme von Smartphones anpassen. Das ist ein ganz zentraler Punkt – und sicher ist der vermehrte Internetzugriff über Smartphones der Hauptgrund für den überwältigenden Erfolg des responsiven Webdesigns.

Aber es gibt nicht nur die kleinen Bildschirme: Parallel zum Aufkommen aller möglichen kleinen Screens werden die Bildschirme auf den Desktops immer größer und größer. Und eine Website, die für die klassischen 960px konzipiert wurde, sieht da mehr als verloren aus. Glücklicherweise gibt uns das Responsive Webdesign auch Möglichkeiten, uns um die großen Bildschirme zu kümmern. Wobei das natürlich so passieren soll, dass die Nutzer von Smartphones nicht darunter leiden müssen.

Für größere Bildschirme darf die Schrift etwas größer werden. Denn die richtige Schriftgröße hängt – neben anderen Faktoren wie der gewählten Schrift, der Zeilenlänge und dem Zeilenabstand – auch von der Entfernung des Betrachters zum Bildschirm ab. Ein Smartphone beispielsweise hält man ziemlich nah ans Gesicht, zum Riesenmonitor auf dem Schreibtisch hat man eine gewisse Distanz. Dafür, dass die Texte dann noch gut lesbar sind, sorgt eine größere Schrift.

Üblicherweise setzt man auf einer Website mehrere Schriftgrößen ein, beispielsweise für Überschriften eine größere Schrift als für Absätze. Bei der Schriftanpassung für große Screens soll jetzt natürlich das Verhältnis zwischen Absätzen und Überschriften bewahrt werden. Am einfachsten gelingt das, wenn Sie auf die Einheit em (oder rem) setzen.