Kategorien

Bildschirmauflösung und Webseiten

Apple MacintoshAls ich 1986 bei meinem Ersten USA Aufenthalt in SanFrancisco nicht anders konnte und mir einen Macintosh 512 als Souvenir mitgebracht hatte, war bei einer Bildschirmauflösung von 512 x 342 noch gar nicht dran zu denken das man sich bei der Webentwicklung mal Gedanke darüber machen muss. Noch dazu gab es damals das World Wide Web noch gar nicht. Aber mittlerweile ist es sicher Notwendig bei der Entwicklung einer neuen Seite mal kurz drüber nachzudenken.

“Diese Webseite ist optimiert für eine Bildschirmauflösung von 800×600″

Windows Maximieren

Ein entscheidender Punkt warum es aber überhaupt zu solchen Diskussionen gekommen ist, liegt an der Windows Funktion “Maximieren”. Sie suggeriert uns eine feste Bildschirmauflösung, welche aber nichts mit der Fenstergröße zu tun hat die die Webseite dann darstellt.
MxximierenIch verstehe auch Heute noch nicht ganz wie es zu dieser (dummen) Funktion gekommen ist. Da ist man mit den grafischen Benutzeroberflächen in der Lage wirkliche Fenster zu benutzen und dann schaltet man diese Funktion ab und legt ein sie auf den ganzen Bildschirm. Seit 25 Jahren arbeite ich nun mit Mac, Windows und Linux, bin aber nie drauf gekommen ein Programm auf den gesamten Bildschirm zu legen. Bei einer Monitorgröße von kleiner 1024×768 kann ich es ja noch verstehen, aber mittlerweile sind die Auflösungen größer. Dabei spielt dann auch eine Rolle das am Mac der Desktop (Schreibtisch) eine größere Rolle gespielt hat als bei Windows und das interaktive Arbeiten zwischen Fenstern wesentlich besser ist (Das auch schon seit MacOS7 = Multifinder)

Deshalb konnte ich auch nie verstehen warum sich die Leute Mühe geben die Webseiten für eine bestimmte Auflösung zu optimieren. Richtig ist zwar das man sich Bewusst sei sollte, welche Auflösung gebräuchlich ist, um seine Seite dementsprechend darzustellen. Aber als Referenz sollte doch ein Offline Dokument dienen das ich neben einen Monitor halte.

Vergleiche ziehen

Mein Motto: Halte eine Zeitschrift neben den Monitor und schau dir die Schriftgrößen, Überschriften, Logos und Bilder an. Jetzt passe die Webseite so lange an bis dies überein stimmt. Und das ganze unabhängig von der Bildschirmauflösung. Natürlich gibt es Stilelemente, aber auch die Möglichkeit der Barrierefreiheit sollte bei einer Webseite beachtet werden, aber 80% aller User haben die selben Empfindungen von Größe. Deswegen variieren ja auch die Zeitschriften nicht extrem von einander, oder?

Übersicht Bildschirm Auflösungen

Bildschirmauflösungen Jan. 2010

Also was hat das nun mit der Webgestaltung zu tun?

Als erstes sollte man sich mal auf eine Basis festlegen, wie die Seite auszusehen hat. Dazu gehören auch die Ausmaße wie die Breite.Aber es sollte nicht vergessen werden die einzelne Webseite als ganzes zu betrachten. So hat sich beim Papier ja auch ein Standard Seitenverhältnis entwickelt das in geringen Unterschieden (DINA und US Letter usw.) an den Golden Schnitt orientiert. Dies gilt nicht nur für die komplette Seite sondern auch für die Verhältnis von Text zu Bild, Aufbereich zu Seitenleiste usw.

Und genau da liegt der Hase begraben: Wichtig ist erst einmal das die Seite in sich stimmig ist, aber nicht das die Seite sich an den Monitor anpasst.

Wenn wir jetzt mal von einer Seitenbreite von ca.1000px ausgehen, dann kann man daran schon erkennen wie breit die Seitenleiste werden sollte. Wie groß die Bilder am Besten sind und wie die Schriften dazu passen. Derzeit nehme ich meist eine Breite von ca. 1000px an, da sie 97% aller Seitenbesucher optimal bedient, ohne noch scrollen zu müssen.
Ich bin kein Fan von flexiblem Webseiten, da es mit wachsendem Inhalt immer zu Problem kommen kann. Eine bessere Alternative zu flexiblen Breiten ist die Möglichkeit eines Zooms der Schriftgrößen. Dies dient aber nur zur Usability und weniger zum Design.

Also eine feste Breite?

Ja, ich denke schon. Eine flexible Seite stellt sich von der Hubtick auch immer etwas langsamer dar. Aber die Hauptgründe sind sicherlich die gestalterischen Vorteile. Im TYPO3 CMS, das ich hauptsächlich für die Entwicklung einsetzte, besteht die Möglichkeit bestimmte Sublayouts, also z.B. 3 Style Boxen die nebeneinander angeordnet sind, Maße auszulesen und automatisch eingefügte Bilder an die Breite anzupassen. Dies ist eine äuߟerst praktische Sache, da man alle Abstände und Ränder bereits im Layout festlegen kann, aber trotzdem durch Verschachtelung eine enorme Freiheit im Layout hat.

Was ist mit Handy, PDA,  iPhone und Co?

Das wird ein wichtiger Punkt in der Zukunft sein. Zur Zeit ist die Situation noch so, das die Zugriffe von solchen Geräten (bezogen auf meine Kunden) noch sehr gering sind. Aber ich sehe durchaus das in den nächsten Monaten da ein großer Aufholbedarf besteht. Zur Zeit machen sich viele Leute drüber Gedanken wie man dafür eine Lösung in ein Framework implementieren kann. Da wird sich 2010 sicher was bewegen. Bis dahin wird man an Bowserweichen nicht vorbei kommen.

Wie halten Sie es mit der Maximieren Funktion?
Was spricht für eine flexible Webseite?
Wird es notwendig sein die Handhelds besser zu unterstützen?
Gibt es schon Ansätze die dies erleichtert?
Schreiben Sie mir einen Kommentar.

Komentar schreiben

  

  

  

Sie können diese HTML TAGS verwenden

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>