Homepage bauen

Was darf es sein – Boxed oder Widescreen?

Homepage bauen – das funktioniert in einer Kastenform (Boxed) oder über die gesamte Bildschirmbreite (Widescreen). Immer wieder werde ich gefragt, was besser ist. Aber es gibt da kein Besser oder Schlechter, kein Richtig oder Falsch; es ist reine Geschmacksache. Aber wenn Sie eine Homepage bauen, müssen Sie die Entscheidung, ob Boxed oder Widescreen schon am Anfang treffen, weil sie sich auf die Wahl der Fotos auswirkt.

Boxed und Widescreen unterscheiden sich nur auf großen Bildschirmen.

Diese Seite ist Boxed:

Das Hauptlayout hat meist eine Breite von 1100 Pixel, man kann es aber natürlich auch breiter oder noch schmaler machen. Hauptmerkmal: Navigationsbalken und Footer sind farblich nur in der Mitte in einem Kasten, links und rechts davon ist ein Hintergrundbild. Der gesamte Content ist in einem Kasten.

Der rosa Hintergrund ist jedoch nur auf einem großen Bildschirm zu sehen – auf kleineren Geräten (Laptop, Tablet, Smartphone) wird er in der Regel einfach weggeschnitten. Der Vorteil bei der Boxed-Version ist, dass man von den Fotos weniger wegschneiden muss. Die Seitenbreite der Fotos kann daher meist 1,5 : 1 betragen, also im normalen Format bleiben. Wenn die Fotos auf kleineren Geräten kleiner skaliert werden, kann man sie immer noch gut erkennen.

Diese Seite ist Widescreen:

Homepage bauen

Kopf- und Fußbereich gehen farblich über die gesamte Bildschirmbreite, auch wenn die Navigation selbst nur in der Mitte angeordnet ist (man kann aber auch die Navigation über die gesamte Breite ziehen).

Eine Widescreen-Website macht beim Homepage Bauen am meisten Sinn (= sieht auf großen Bildschirmen am besten aus), wenn auch die Fotos über die gesamte Breite gehen, weil das ein tolles Raumgefühl vermittelt. Damit der Erstbesucher erkennt, dass unterhalb des Fotos noch Text kommt, darf das Panorama-Foto nicht zu breit sein, es muss also abgeschnitten werden. Ich schneide Fotos meist im Verhältnis 3,2 : 1 zu, das entspricht einer Größe von 2560 x 800 Pixel. Die Bildaussage muss in diesem schmalen Streifen unterzubringen sein (lesen Sie dazu unbedingt auch diesen Artikel).

Wenn man eine Widescreen-Seite auf einem kleineren Bildschirm anzeigt, wird das Panorama-Foto natürlich skaliert, und auf einem hochkant gehaltenen Smartphone ist es dann wirklich sehr schmal. Wenn also Ihre Zielgruppe viel mit dem Smartphone arbeitet und vielleicht gar keinen großen Bildschirm besitzt, haben Sie wenig davon, wenn Ihre Website auf einem breiten Bildschirm toll aussieht. In diesem Fall wäre es sinnvoller, die Fotos in ihrer normalen Größe zu belassen und die Seite entweder als Kasten zu gestalten oder sie zwar Widescreen anzulegen (also mit Kopf- und Fußbereich, die über die ganze Breite gehen), die Fotos aber trotzdem klein zu verwenden wie z.B. auf dieser Unterseite meines Auftritts.

Hinzu kommt, dass Sie für’s Zuschneiden der Fotos für das richtige Format (3,2 : 1) ein Bildbearbeitungsprogramm brauchen, z.B. Photoshop. Ein normal großes Foto (1,5 : 1) können Sie gegebenenfalls einfach so einfügen. Wichtig: Rechnen Sie es unbedingt klein, so dass es maximal 200 KB groß ist, sonst verlängert sich die Ladezeit Ihrer Website unnötigerweise.