In Agenturen und mit Kunden wird häufig darüber gestritten, ob Websites ein fixiertes oder variables Layout haben sollten. Bei einem fixierten Layout wird davon ausgegangen, dass die Mehrzahl der Internet-Surfer eine bestimmte Bildschirmauflösung haben (z.B. 1024x768 Bildpunkte). Für diese wird dann optimiert. Das Problem verstärkt sich dadurch, dass bei geringeren Auflösung horizontale Scrollbalken entstehen, die versierte Nutzer als häßlich empfinden. Studien zeigen, dass eine große Anzahl an nicht-versierten Surfern mit horizontalen Skrollbalken Nutzungsprobleme hat, weshalb diese gemeinhin vermieden werden.
Nicht selten wird der Diskurs über fixe und variable Bildschirmbreiten durch den individuellen Anspruch an Website-Layouts verstärkt. Wer mehr auf Gestaltung und Form wert legt, mag häufig die "Kalkulierbarkeit" einer festen Breite. Die "Technikgetriebenen" argumentieren dagegen häufig für variable Auflösungen, weil diese den Raum besser ausnutzen.

Durch den technischen Fortschritt bei der Website-Entwicklung (z.B. CSS) ergeben sich viele zusätzliche Möglichkeiten, dem Problem zu begegnen. Aber solange sich Websites nicht wie ein Fernsehbild oder Flash-Filme in der Auflösung skalieren lassen, wird das Problem bestehen bleiben. Dabei ist, die technischen Möglichkeiten vorausgesetzt, eine Skalierung auf kleine Handy-Displayse unmöglich, weil deren Pixeldichte nicht ausreicht, um die dann wirklich sehr kleine Schrift überhaupt noch lesbar darstellen zu können.

Die Diskussion ist daher eine über die beste Möglichkeit, die Symptome zu beseitigen. Lösungen sind bisher nicht verfügbar.

Die Argumente, die für fixe Layouts angeführt werden:

• Der Designer verliert die Kontrolle über das Layout, weil die Variabilität der Bildschirmauflösungen häufig nicht vollständig abbildbar ist.
• Der Aufwand einer Optimierung für viele unterschiedliche Auflösungen ist sehr aufwändig. Durch die verstärkte Internet-Fähigkeit von mobilen Anzeigegeräten wie PDAs und Handys werden auch immer mehr ganz kleine Auflösungen üblich.
• Im Gegenzug sind fixierte Layouts viel einfacher umzusetzen und passen besser zu vielen Budgets.
• Ein gutes variables Layout-Konzept, wie Google es beispielsweise in seinen Applikationen verwendet, ist sehr reduziert und bietet gerade für Kunden, die Wert auf Form und Gestaltung legen nicht genug Ästhetik.
• Eine Skalierung von kleinen Layouts auf größere Auflösungen ist technisch in HTML nicht möglich.
• Es gibt gesicherte Erkenntnis über die optimale Zeichenanzahl für einen gut lesbaren Text. Es senkt die Usability, wenn ein Nutzer mit dem Kopf mitlesen muss. Deshalb haben die großformatigen Zeitungen und auch Zeitschriften alle (!) enge Spaltenbreiten. Wer also glaubt, durch die Variabilität der Textbreite, mehr Raum nutzen zu können, tut das nicht selten auf Kosten der Usability.
• Wenn im Kopfbereich mit Bildern und Fotos gearbeitet wird, müssen Übergangsbereiche und Verläufe geschaffen werden. Das sieht nicht selten suboptimal aus.
  Björn Seibert in "Herausforderung elastische Layouts" dazu:

  Eine wirklich gelungene Lösung für in der Breite flexible Headergrafiken zeigt die Website der diesjährigen @media. Überhaupt wohl einer der vielversprechendsten Ansätze.

Entsprechende Argumente für variable Layouts:

• Variable Layouts liegen im Trend. Die Ausnutzung der technischen Möglichkeiten ist nutzerfreundlich, schick und zeugt von "state-of-the-art"-Web-Entwicklung.
• Eine Anpassung der Website auf die Verfügbare Auflösung steigert den Kundennutzen und wird sich daher langfristig durchsetzen.
• Ein elastisches Layout sorgt für eine höhere Usability und eine intensivere Nutzung durch die Nutzer.
• Gerade auf frequentierten Seiten, die direkte Erträge aus der Nutzung ziehen (z.B. Verkäufe) können Investitionen in die Variabilität einen hohen Return-On-Invest (ROI) aufweisen.
• Es sind auch Zwischenlösungen zwischen variablem und fixem Layout durch "multipel fixe Layouts" möglich: Hier werden einfach für alle üblichen Auflösungen eigene fixe Layouts entwickelt. So arbeitet beispielsweise die Website von Microsoft.
• Es gibt zahlreiche Seiten, die es schaffen, gute Websites zu erstellen, die elastisch sind. Hierzu wieder Björn Seibert:
  

  • Jeena Paradies
  • Vivabit
  • @media 2006
  • Jason Santa Maria
  • CSS Beauty
  • Artnetz

Es gibt noch mehr Argumente für und gegen elastische Layouts. Ich freue mich daher über Kommentare und Anregungen oder Links auf weiterführende Informationen.

Einige hilfreiche Quellen zum Thema sind:

• SelfHTML-Weblog: Optimierung für Bildschirmauflösungen
  Empirische Untersuchungen widerlegen die Standard-Layout-Breiten. Den Artikel sollte man lesen, um zu verstehen, dass eigentlich nur die Bildschirmbreite (Viewport) für die Optimierung interessant ist.
• Herausforderung elastische Layouts
  Mitunter sollen ja elastische bzw. in der Breite flexible Layouts einer der Trends 2006+ werden. Es geht aber nicht nur um Trends. Es geht neben ästhetischen Aspekten und der möglichst geschickten Nutzung des zur Verfügung stehenden Raums bei großen Displays auch ...
• Tabellenloses Design Teil 3 – Eine Übersicht über Layoutgattungen
  Ein sehr interessanter Artikel mit Abbildungen, der die unterschiedlichen Möglichkeiten von Layouts darstellt.
• Elastische Layouts: Eine Übersicht
  Viele Webdesigner fragen sich: Festes oder fluides Layout, die Antwort sollte “elastisch” sein.
  Eine bereits erstaunlich große Vorstellung elastischer Layouts kann man unter Liquid Designs sehen und muss dabei feststellen, dass sie nicht nur schön sondern auch sehr sinnvoll sein können.
• Einführung in CSS 3
  In CSS 3 werden schon eine ganze Reihe von Möglichkeiten unterstützt, die variable Layouts vereinfachen und verbessern. Offizielle Website der W3C zum Thema.
• Ein kleiner Blick auf CSS3
  Technischer Artikel über die Veränderungen, die in CSS enthalten sein werden.
• Web How-To: Create Liquid Layouts that Never Fail
  Prepare your site for worst-case scenarios with these tips. The payoffs: less code, less maintenance, more viewers, and better search-engine results.
• Fixed or fluid width? Elastic!
  A question many web designers ask themselves each time they start working on a new project is whether the site should use fixed or fluid width. The debates on the subject are many and sometimes heated. This is not one more of those debates.
• www.cssliquid.com
  Liquid Designs is the first and only resource site for liquid design with CSS. Here you will find examples of websites with working, attractive fluid width layouts, as well as articles and tutorials for designing your own liquid website.
• Scalable Vector Graphics skalierbar einbetten
  Nachdem ich heute kurz anrecherchiert habe, bestätigt sich leider das allgemeine Urteil: SVG ist noch nicht reif für das reale Web, obwohl mit Firefox 1.5 und der neuesten Safari-Version zwei wichtige Browser SVG von Haus aus unterstützen. Ich will kurz erläutern, ...
• About fluid and fixed width layouts
  Just in the last few days the old debate about fixed vs. fluid width in website layouts has surfaced again for some reason. I don’t think we will ever come to a consensus on the issue, so there isn’t much use in sharing my point of view. But a bit of debating can be fun, so I’ll do it anyway.
• Elastic Design
  It can be difficult to move from a static, pixel-based design approach to an elastic, relative method. Properly implemented, however, elastic design can be a viable option that enhances usability and accessibility without mandating design sacrifices.
• einfach-persönlich.de: "Webseiten wollen gedruckt werden, auf Devices mit kleineren Bildschirmen betrachtet werden etc. Die Frage ob 800×600, 1024×768 oder Floating sollte bei jedem Projekt neu diskutiert und geklärt werden. Wichtig jedoch für jeden Kreativen, alle Facetten im Werkzeugkasten zu haben und anwenden zu können."
• Fixed width (Clagnut)
• On Fixed vs. Liquid Design (Stopdesign)
• The long debate (Adactio)
• Liquid Layouts (Elementary)
• Further roasting the chestnut (Sideshow)

Mehr über die Creative-Commons-Lizenz erfahren