Responsives Webdesign

Sie wollen eine responsive Homepage?

Responsives Webdesign gibt es derzeit hauptsächlich in zwei Versionen: Widescreen oder Boxed. Wenn Ihre Website a) über die gesamte Bildschirmbreite gehen soll und Sie b) mindestens auf der Homepage (=Startseite) ein Foto haben möchten, das ebenfalls die ganze Bildschirmbreite einnimmt, müssen Sie bei der Fotoauswahl einiges beachten.

Wie “hoch” soll das Foto sein?

Die Breite Ihres Fotos sollte 2560 Pixel betragen – es gibt zwar Monitore, deren Bildschirme noch breiter sind, aber dies sind Ausnahmen. Die Höhe des Fotos bestimmt, wie viel Text von Ihrer Website ohne zu scrollen gleich zu sehen ist (sofern Sie die Texte nicht in die Fotos setzen wollen). Ein sehr hohes Bild erweckt in manchen Fällen den Eindruck, es gehe unten nicht weiter, sondern man müsse auf das Foto klicken, um die eigentliche Startseite zu erreichen. Ich empfehle daher nur in wenigen Fällen, ein sehr hohes Bild zu verwenden.

Bei einem “flachen” Widescreen-Foto muss die Hauptaussage durch einen Briefkastenschlitz zu sehen sein.

Wenn Sie ein flacheres Bild verwenden, müssen Sie von dem Foto sehr viel abschneiden. Ich zeige Ihnen vier Fotos, die unterschiedlich gut für diesen Zweck geeignet sind. Der dunkle Teil des Fotos wird jeweils weggeschnitten.

1. Erschöpfte Frau, die in Businessklamotten neben ihrem Laptop sitzt, während neben ihr Wäschekörbe stehen und Spielzeug auf dem Boden liegt.

Wenn nur der helle Teil zu sehen wäre, würde man nur sehen, dass die Frau zwei Legoklötze in der Hand hat. Der Wäschekorb wäre nicht im Bild, auch nicht die Unordnung auf dem Boden. Wenn man den Wäschekorb zeigen wollte, müsste man den Kopf zu stark anschneiden oder ihn gar abschneiden.

widescreen-bsp1

(c)Photographee.eu – fotolia.com

2. Mohnfeld mit dramatischem Himmel und etwas Wiese ohne Blumen

Dieses Foto ist schon besser – aber man muss sich entscheiden, was einem wichtiger ist: der Mohn oder die Horizontlinie. Den Mohn kann man entweder ganz zeigen, oder man mag lieber den Übergang zur Wiese ohne Blumen, oder man möchte den Himmel draufhaben. Wenn man auf nichts verzichten will, muss man den Bildausschnitt höher machen.

widescreen-bsp3

Fotolia_33276446 (Autor nicht mehr ermittelbar)

3. Rettungsring am Strand

Dieses Foto funktioniert recht gut; wenn es dem Benutzer genügt, dass der Rettungsring zu sehen ist. Ich würde allerdings sehen wollen, auf welchem Untergrund der Pflock steht. Je nach Höhe des Ausschnitts geht dann vielleicht der Horizont verloren.

widescreen-bsp2

(c)ludodesign – fotolia.com

4. Stein in Zen-Garten

Dieses Foto ist für den Zweck von allen Beispielen am besten geeignet, denn es gibt nur den einen Stein als Hauptaussage, und dieser ist im Bild zu sehen. Man verpasst wirklich nichts, wenn man den Rest abschneidet.

widescreen-bsp4

(c)pzAxe – fotolia.com

Sie wollen Stockfotos verwenden? Darauf müssen Sie achten:

Die Hauptaussage muss noch Sinn ergeben, wenn man sie nur durch einen Briefkastenschlitz sieht. Alles, was zum Thema gehört, muss erhalten bleiben. Von den Gesichtern sollte man die Sinnesorgane sehen können, und Sie sollten das Bild nicht unter jemandes Kinn abschneiden.

Was müssen Sie beim Shooting beachten?

Wenn Sie selbst fotografiert werden, gilt das oben Gesagte entsprechend. Damit man möglichst wenig abschneiden muss, lassen Sie sich im Querformat fotografieren und möglichst im Freien mit sehr geringer Tiefenschärfe (also mit einem sehr lichtstarken Objektiv und offener Blende), dann kann man zur Not links/rechts noch etwas “anstricken”, damit es nicht aussieht, als ob Ihnen der Kopf abgehackt worden ist.  Für Innenaufnahmen (z.B. von Ihrer Praxis) briefen Sie Ihren Fotografen, dass er auch ein Weitwinkelobjektiv mitbringt, damit alle relevanten Möbel ins Bild kommen.