Spaces. Smartes Cloud Hosting für anspruchsvolle Webprojekte. Loslegen und Spaces testen. Von Mittwald.
Sven Lennartz 3. Juni 2008

Die Sache mit der Bildschirmauflösung – Für welche Monitorgröße gestalten?

Kein Beitragsbild

Eine Frage mit fast schon his­to­ri­schen Dimensionen, die trotz ihres Alters immer noch und immer wie­der Diskussionen aus­löst und Meinungen auf­ein­an­der pral­len lässt. Wie soll man es nun machen? Welche Monitorgrößen- und Auflösungen muss man berück­sich­ti­gen?

Früher war es üblich, dass die Vielzahl der im Internet sur­fen­den Computer mit einem Bildschirm mit einer Auflösung von 800*600 Pixel aus­ge­stat­tet waren. Heute ist dem natür­lich nicht mehr so. Da gibt es 1024*768, 1152*768, 1280*854, 1680*1050, 1920*1200 und so wei­ter. Auch die Systemwelten unter­schei­den sich – wenn auch nur leicht – von­ein­an­der. Die Tendenz für neue Monitore geht in die Breite, nicht in die Höhe, wie es für das Websurfen ange­neh­mer wäre. Video und TV bestim­men zuneh­mend das Format.

Was tun? Ein 800 Pixel brei­tes, an er lin­ken Seite kle­ben­des Design erzeugt bei einem Full-HD-Bildschirm in der gan­zen rech­ten Hälfte gäh­nen­de Leere. Ein 1100 oder 1300 Pixel brei­tes Design hin­ge­gen zwingt Besucher zum unge­lieb­ten Horizontal-Scrollen.

Screenshot
Auflösungen nach Webhits. Die Daten stam­men vom 1. Juni 2008.

Nicht jeder ist ein Vollbildsurfer
Zuerst ein­mal darf nicht von der Größe der Geräte, bzw. deren Auflösungen aus­ge­gan­gen wer­den. Man soll­te statt­des­sen schau­en was tat­säch­lich benutzt wird. Die Differenz ist umso gra­vie­ren­der je grö­ßer die Monitore wer­den. Das ist logisch, denn wer kauft schon einen Mammutmonitor um dann nur einen Browser dar­auf lau­fen zu las­sen? Tatsächlich machen es vie­le; je klei­ner der Monitor, des­to häu­fi­ger wird im Vollbild gesurft.

Der so genann­te View-Port, also die tat­säch­lich zur Verfügung ste­hen­de Fläche unter­schei­det sich von der Auflösung. Das liegt dar­an, dass ver­schie­de­ne Erweiterungen und Leisten benutzt wer­den. Jeder macht das ande­res, der eine ver­wen­det diver­se Werkzeugleisten, der ande­re benutzt eine Seitenleiste für sei­ne Bookmarks oder die History – oder benutzt sogar meh­re­re davon.

Screenshot
Standard-IE7 mit fest­ge­stell­ter Bookmarkleiste. Der zur Verfügung ste­hen­de Platz wird so ein­ge­schränkt.

Die Breite der Bookmarkleiste kann frei gewählt wer­den. Als Webdesigner kann man nie wis­sen in wel­cher Umgebung Seiten tat­säch­lich dar­ge­stellt wer­den und wie groß der View-Port wirk­lich ist.

Das heißt kon­krekt: wenn 1280*1024 die der­zeit vor­herr­schen­de Monitorauflösung ist, heisst es noch lan­ge nicht das dafür gestal­tet wer­den muss oder soll­te. Im Gegenteil, wer es tut liegt oft falsch. Die Benutzer grö­ße­rer Monitore sur­fen logi­scher­wei­se kaum noch im Vollbild.

Screenshot
Der Anteil der Vollbildsurfer. Je grö­ßer und moder­ner der Monitor, des­to sel­ten wir der gesam­te Platz für den Browser ver­wen­det. nach Thomas Baekdal.

Was also tun?
Lassen Sie sich nicht von Statistiken über Monitore und Auflösungen irre­füh­ren. Es steht zwar mehr Platz zur Verfügung als anno 1998, er ist aber immer noch begrenzt. Monitore ab 20″ sind nach wie vor sel­ten zu fin­den (was unter Webdesigner als “klein” gilt, ist dem Massenpublikum noch weit­ge­hend fremd) und wer­den kaum im Vollbildmodus genutzt. Machen Sie es nicht zu breit! Gelöst ist das Problem damit frei­lich nicht. Es gibt kein per­fek­tes Maß, hier muss jeder für einen Kompromiss fin­den. Und der wird je nach Projekt, Zielgruppe und Auftraggeber anders aus­fal­len.

Auf der rela­tiv siche­ren Seite ist, wer auf fle­xi­ble Layouts setzt, die sich ver­schie­de­nen Auflösungen anpas­sen kön­nen. Das muss gar nicht zu 100% pas­sie­ren.

Material zum Thema:

Erstveröffentlichung 03.06.2008

Sven Lennartz

Sven Lennartz

Ex Webdesigner, Gründer von Dr. Web und Smashing Magazine. Heute ist Sven als Schriftsteller und Blogger unterwegs. Schau was er jetzt macht…

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.