Webseiten-Layout verfolgt einen von zwei verschiedenen Ansätzen:
- Layouts mit fester Breite: Dies sind Layouts, bei denen die Breite der gesamten Seite mit einem bestimmten Zahlenwert festgelegt wird.
- Flüssige Layouts: Dies sind Layouts, bei denen die Breite der gesamten Seite flexibel ist, je nachdem, wie breit der Browser des Betrachters ist.
Es gibt gute Gründe, beide Layout-Methoden zu verwenden, ohne jedoch die relativen Vorteile und Mängel jeder Methode, Sie können keine gute Entscheidung treffen, welche Sie für Ihr Web verwenden möchten Seite.
Layouts mit fester Breite
Feste Layouts sind Layouts, die mit einer bestimmten Größe beginnen, die vom Webdesigner festgelegt wird. Sie behalten diese Breite bei, unabhängig von der Größe des Browserfensters, in dem die Seite angezeigt wird. Layouts mit fester Breite ermöglichen einem Designer eine direktere Kontrolle darüber, wie die Seite in den meisten Situationen aussehen wird. Sie werden oft von Designern mit Druckhintergrund bevorzugt, da sie es dem Designer ermöglichen, winzige Anpassungen am Layout vorzunehmen und sie über Browser und Computer hinweg konsistent zu halten.
Flüssige Layouts
Liquid-Layouts sind Layouts, die auf Prozentsätzen der Größe des aktuellen Browserfensters basieren. Sie passen sich der Größe des Fensters an, selbst wenn der aktuelle Betrachter seine Browsergröße ändert, während er die Site ansieht. Layouts mit flüssiger Breite ermöglichen eine effiziente Nutzung des Platzes, der von einem bestimmten Browserfenster bereitgestellt wird, oder Bildschirmauflösung. Sie werden oft von Designern bevorzugt, die viele Informationen haben, um sie auf so wenig Raum wie möglich zu vermitteln möglich, da sie in Größe und relativen Seitengewichten gleich bleiben, unabhängig davon, wer die Seite.
Was auf dem Spiel steht?
Ihre Website design beeinflusst deine Reaktionsfähigkeit und Anpassungsfähigkeit der Website. Je nachdem, was Sie wählen, kann die Fähigkeit Ihrer Leser, Ihren Text zu scannen, das Gesuchte zu finden oder manchmal sogar Ihre Website zu nutzen, unterstützt oder behindert werden. Die allgemeine Markenidentität Ihrer Website kann ebenfalls gefährdet sein, insbesondere wenn Ihre Markenstandards einer Print-First-Logik folgen.
Vorteile von Layouts mit fester Breite
Ein Layout mit fester Breite ist unter Umständen hilfreich.
- Ein Layout mit fester Breite ermöglicht es dem Designer, Seiten zu erstellen, die unabhängig davon, wer sie betrachtet, identisch aussehen.
- Elemente mit fester Breite wie Bilder werden Text auf kleineren Monitoren nicht überdecken, da die Breite der gesamten Seite diese Elemente enthält.
- Die Scanlänge wird durch große Textsegmente nicht beeinflusst, egal wie breit der Browser ist.
Vorteile von Liquid Layouts
Ein flüssiges Layout funktioniert unter anderen Umständen am besten.
- Ein Layout mit flüssiger Breite erweitert und zieht sich zusammen, um den verfügbaren Platz auszufüllen.
- Der gesamte verfügbare Platz wird genutzt, sodass der Designer mehr Inhalte auf größeren Monitoren anzeigen kann, aber dennoch auf kleineren Displays funktionsfähig bleibt.
- Flüssige Layouts bieten Konsistenz in den relativen Breiten, sodass eine Seite dynamischer auf vom Kunden auferlegte Einschränkungen wie größere Schriftgrößen reagieren kann.
Nachteile von Layouts mit fester Breite
Ein festes Format ist jedoch nicht ohne Kosten.
- Layouts mit fester Breite erzwingen horizontales Scrollen in kleineren Browserfenstern. Die meisten Leute mögen es nicht, horizontal zu scrollen.
- Sie lassen bei größeren Monitoren große Flächen an Weißraum, was zu viel ungenutztem Platz und mehr vertikalem Scrollen führt, als sonst notwendig wäre.
- Layouts mit fester Breite verarbeiten Kundenänderungen an Schriftgrößen nicht sehr gut. Bei kleinen Vergrößerungen der Schriftgröße können sie in Ordnung sein, aber bei größeren Vergrößerungen kann das Layout beeinträchtigt werden.
Nachteile von Liquid-Layouts
Auch flüssige Layouts sind nicht ohne Nachteile.
- Flüssige Layouts ermöglichen eine sehr geringe genaue Kontrolle über die Breite der verschiedenen Elemente der Seite.
- Sie können dazu führen, dass Textspalten entweder zu breit sind, um sie bequem scannen zu können, oder in kleineren Browsern zu klein sind, damit die Wörter klar angezeigt werden.
- Liquid-Layouts-Fehler, wenn ein Element mit fester Breite, z. B. ein Bild, in einer Flüssigkeitssäule platziert wird. Wenn die Spalte ohne genügend Platz für das Bild gerendert wird, erhöhen einige Browser die Spaltenbreite, die Anweisungen des Designers missachten, während andere Browser Überlappungen in Text und Bildern erzwingen, um das richtige zu erreichen Prozentsätze.
Layout-Präferenz und gemischte Ansätze
Einige Designer ziehen es vor, diese Konzepte zu mischen. Sie mögen es nicht, flüssige Layouts für große Textblöcke zu verwenden, da diese Struktur den Text auf einem kleinen Monitor entweder unlesbar oder auf einem großen nicht scannen lässt. Daher neigen sie dazu, die Hauptspalten von Seiten mit einer festen Breite zu versehen, aber Kopf-, Fuß- und Seitenzeilen Spalten flexibler, um die verbleibende Immobilie aufzunehmen und nicht die Kapazität von größeren zu verlieren Browser.
Einige Seiten verwenden Skripte, um die Größe Ihres Browserfensters zu bestimmen und dann die Anzeigeelemente entsprechend zu ändern. Wenn Sie beispielsweise eine solche Site in einem sehr breiten Fenster öffnen, erhalten Sie möglicherweise auf der linken Seite eine zusätzliche Spalte mit Links, die Besucher mit kleineren Monitoren möglicherweise nicht sehen. Außerdem hängt der Textumbruch um Werbung davon ab, wie breit Ihr Browserfenster ist. Wenn es breit genug ist, wird die Site mit Text umbrochen, andernfalls wird der Artikeltext unter der Anzeige angezeigt. Obwohl die meisten Websites diese Komplexität nicht benötigen, zeigt es eine Möglichkeit, größere Bildschirme zu nutzen, ohne die Anzeige auf kleineren Bildschirmen zu beeinträchtigen.