Der Monitor - die Unbekannte im Webdesign

Größe und Auflösung des Monitors spielen eine entscheidende Rolle

Neben dem Webbrowser, sind Größe und Auflösung der Monitore und die damit verbundene optimale Anzeigegröße der Webseiten, weitere Unbekannte mit denen der Webdesigner beim Anlegen des Layouts zu tun hat. Seine Aufgabe ist es nun, die Inhalte der Website für alle Monitore optimal bis akzeptabel in Szene zu setzen. Am besten läßt sich das mit variablen Layouts bewerkstelligen, die sich an jede Größe des Browserfensters anpassen. 72 dpi sind ein guter Richtwert für die Auflösung des Monitores. Notebookdisplays können auch eine Auflösung von ca. 117 dpi aufweisen. Planen Sie die Größe Ihrer Bilder mit einer Auflösung von 72 dpi, sind Sie auf der sicheren Seite. Auf Computern oder Notebooks mit höherer Auflösung werden sie dann etwas kleiner angezeigt. Dies können Sie nicht beeinflussen. Vielleicht können Ihnen unsere Berechnungsbeispiele für die notwendige Anzahl der Pixel von Fotos beim Anfertigen Ihrer Bilder für das Internet helfen.

Entwicklung der Monitore

In den Anfängen des Internet besaßen die meisten Besucher 14- oder 15-Zoll-Röhrenmonitore. Für die Gestaltung von Websites standen damals maximal 800x600 Pixel zur Verfügung, incl. Webbrowser, d.h. für Scrollleisten, Toolbars und die Adressleiste mußten noch Pixel abgezogen werden, wenn die Website ohne Scrollleisten auf den Bildschirm passen sollte. Später wurden größere Bildschirme bezahlbar und so konnten die Maße der Websites auf 1024 x 768 Pixel erweitert werden.

Um aber den Besuchern mit kleineren Bildschirmen ein horizontales und vertikales Scrollen zu ersparen wurden manchmal Bildschirmweichen eingesetzt. Diese fragten beim Aufruf der Website zuerst per javascript die Anzahl der Pixel des Monitors ab und lieferten dann die passende Version der Website. Dies bedeutete aber Mehrarbeit für den Webdesigner, da er die Website für mehrere Auflösungen erstellen mußte, was mit Framesets noch halbwegs komfortabel gelöst werden konnte. Es hatte aber nicht jeder Besucher javascript eingeschaltet, sodass diese Besucher nicht auf die passende Größe der Website weitergeleitet werden konnten. Webdesigner, die keine Weichen einsetzen und auf Nummer sicher gehen wollten legten ihre Websites aber weiterhin in 800x600 Pixeln an, was auf Monitoren mit 1024x768 Pixeln noch recht ansehnlich ist aber auf größeren Bildschirmen sehr verloren aussieht. Der Besucher fragt sich dann, warum er auf seinem großen Bildschirm in solch einer mini-Website ewig scrollen muß.

Die weitere Entwicklung brachte 19- oder sogar 21-Zoll-Röhrenbildschirme auf den Markt zu erschwinglichen Preisen. Für das Webdesign stand jetzt ausreichend Platz zur Verfügung. Mit dem Erscheinen der ersten Flachbildschirme waren die ursprünglichen Grenzen im Webdesign wieder vorhanden und die Websites mit 800 x 600 Pixeln waren wieder gefragt. Inzwischen sind aber auch Flachbildschirme mit 22-Zoll bezahlbar und in Zukunft sollte für das Layout von Websites wieder ausreichend Platz auf dem Bildschirm zur Verfügung stehen. Doch eine Unbekannte bleibt weiterhin. Diesmal ist es die Größe des Browserfensters, was ja nicht zwingend maximiert sein muß um die komplette Bildschirmgröße einzunehmen sondern vollkommen variabel eingestellt sein kann. Variable Layouts bieten hier die beste Lösung.

Maße der Website festlegen

Auch heute steht beim Entwurf des Webdesign die Frage: "Für welche Monitorgröße soll die Website angelegt werden?" Ebenso wie bei den Webbrowsern ist immer davon auszugehen, dass die Besucher nicht alle mit der neuesten Technik ausgestattet sind und ein zwar geringer aber nicht unbedingt zu vernachlässigender Prozentsatz mit 14- oder 15-Zoll-Bildschirm und einer Auflösung von 600 x 800 Pixeln die Website aufsucht. Separat öffnende Fenster, in denen Fotos geladen werden, sind mit einem Format von maximal 600 x 800 Pixeln für die meisten Fälle ausreichend groß. Noch immer ist es aber die Aufgabe des Webdesigners, die Website für alle Monitore akzeptabel zu gestalten. Auch auf einem 22-Zoll-Monitor ist nicht sicher, dass die komplette Bildschirmgröße der Website zur Verfügung steht. Es ist eher davon auszugehen, dass der Besucher weitere Anwendungen geöffnet hat und sich der Browser die Bildschirmgröße mit anderen Anwendungen teilen muß.

Ist es nun notwendig, sich für eine bestimmte Größe festzulegen, weil es das Layout der Website so vorgibt stehen immer noch die beiden Maße 800x600 Pixel und 1024x768 Pixel im Vordergrund, wobei die vertikalen Maße nicht festgeschrieben werden sollten. Müssen nur wenige Informationen untergebracht werden, ist es akzeptabel layoutbedingt auch die vertikalen Maße festzuschreiben. Muß viel Information untergebracht werden, ist es nicht schlimm, wenn rechts ein Scrollbalken erscheint. Es sollte nur darauf geachtet werden, dass nicht zusätzlich auch unten gescrollt werden muß. Auch wenn der Scrollbalken der meisten Websites auf der rechten Seite sitzt spricht nichts dagegen, das Webdesign so anzulegen, dass der Scrollbalken am unteren Ende des Bildschirmes angeordnet wird. Nur ist hier darauf zu achten, dass dann rechts kein Balken erscheint. Horizontales und vertikales Scrollen sollte dem Besucher zu liebe unbedingt vermieden werden.

Das Layout variabel anlegen

Die beste Lösung ist es, das Layout so anzulegen, dass es sich an jede Auflösung und Größe der Bildschirme bzw. der Browserfenster anpaßt, was aber nicht immer ganz einfach ist, vor allem wenn das Webdesign auch noch barrierefreie sein soll und die Website in allen möglichen neuen und alten Browsern funktionieren soll. Auf www.webdesign-tipp.de haben wir versucht dies umzusetzen.