Esalen-Massage Tübingen

Diese Webseite hat mir große Freude gemacht: Ich bekam einen sehr schön gestal­teten Flyer als Vor­lage sowie einen Ordner voll Fotos und den Auf­trag, daraus sozu­sagen „einen Flyer fürs Web“ zu basteln. Also ganz klar ein One­pager, und so über­sicht­lich, dass wir beschlossen haben auf ein Menü zu verzichten.

Bilder in flexiblen Formaten

Bilder erfordern auf jeder Webseite größeres Nach­denken, weil man bei Bildern mehr als bei Text auf ein bestimm­tes Format fest­gelegt ist, das unter verschie­denen Bild­schirm­größen in aller Regel ver­schie­den gut passt. An jeder Stelle muss ich über­legen: bei welcher Bild­schirm­breite bricht der Text um oder muss das Bild nur noch auf halber Breite ange­zeigt werden? Was ist wenn es ein Hoch­format sein soll? Kann ich das Bild im Layout zu­schnei­den, oder geht dann Inhalt verloren? Web ist halt nicht Print, und wie die Seite nachher anderswo aus­sieht, hängt von sehr vielen Faktoren ab.

Hier handelt es sich um Stimmungs­bilder, das heißt der Inhalt der Seite wird völlig prob­lem­los auch ohne sie ver­stan­den. Ich muss also keinen Alt-Text schreiben, und ich kann sie bis zu einem gewissen Grad zu­schnei­den. Da muss man schon ein biss­chen auf­passen, dass man ein grund­sätz­lich geeig­netes Bild im richtigen Format nimmt, aber ob man immer den ganzen Hinter­grund sieht oder den ganzen Rücken der Person, die massiert wird, ist zweit­rangig. Die Größe der Bilder ist daher auf brei­teren Bild­schir­men von der Länge des neben­stehenden Textes ab­hängig – das ginge nicht mit einem endlos langen Text, aber zwei Absätze mehr oder weniger sind durchaus drin, was in diesem Fall reicht.

Ansicht ungefähr auf Tablet-Hochformat

Ansicht bei voller Breite

Kleine Details

Viel Spaß hatte ich auch daran, kleine Details einzu­bauen, vor allem das Blätt­chen als Listen­marker und die feinen weißen Linien im Hinter­grund bei den Abschnitten ohne Bilder. Bei den Linien gilt das Gleiche wie bei anderen Bil­dern: Ich kann sie nicht belie­big groß ziehen, dann werden sie zu dick, und sie soll­ten mög­lichst nur wenig hinter dem Text liegen, damit er gut lesbar bleibt. Ent­sprechend „wandern“ die Linien je nach Bildschirm­breite ein wenig herum. (Wenn man aber nicht mit der Breite herum­spielt, fällt das natür­lich gar nicht auf.)