Navigieren in Biel

Bilder

Bilder können eine Seite sehr viel attraktiver machen, bei zu vielen oder schlechten Bildern aber auch das Gegenteil bewirken oder die Übersicht erschweren. Grundsätzlich sollte pro Seite mit wenigen, aber guten und grosszügigen Bildern gearbeitet werden. Ein guter Seitenauftakt kann ein Intro-Bild nach Haupttitel und dem Leadtext sein:

Bild «medium» über gesamte Inhaltsbreite.
Bild rechts ausgerichtet

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nullam quis risus eget urna mollis ornare vel eu leo. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.

Lorem Justo Fringilla Vehicula

Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla. Cras mattis consectetur purus sit amet fermentum. Nullam quis risus eget urna mollis ornare vel eu leo. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Etiam porta sem malesuada magna mollis euismod. Nulla vitae elit libero, a pharetra augue. Etiam porta sem malesuada magna mollis euismod. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

Dapibus Pharetra Mollis Sem Magna

Bild links ausgerichtet

Maecenas sed diam eget risus varius blandit sit amet non magna. Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Etiam porta sem malesuada magna mollis euismod. Maecenas faucibus mollis interdum. Nullam id dolor id nibh ultricies vehicula ut id elit. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Maecenas faucibus mollis interdum. Sed posuere consectetur est at lobortis. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Nullam quis risus eget urna mollis ornare vel eu leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Achtung Barrierefreiheit

Bilder, die inhaltlich relevant sind, sollten immer mit einem Alternativtext versehen werden, der Benutzern von assistiver Technologie oder für Suchmaschinen als Bildersatzt dienen kann. Dafür Doppelklick auf das platzierte Bild, oder via rechte Maustaste > Bildeigenschaften und dann den Alternavtivtext im Feld «Alternativer Text» eingeben.

Bei rein dekorative Bilder sollte der Alternativtext explizit leer gelassen werden. So wird assistive Technologie das Bild ignorieren.

Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Sed posuere consectetur est at lobortis. Etiam porta sem malesuada magna mollis euismod. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.

Bildergalerie

Bildergalerien zeigen immer eine ganze Auswahl von Bildern gleichzeitig. Bilder innerhalb einer Galerie sollten immer die gleichen Bilddimensionen besitzen, da Grössenunterschiede zu einem unschönen Raster führen.
Aus diesem Grund werden alle Bilder für Slideshows automatisch auf das Format 16:9 im Querformat zugeschnitten (zentraler Ausschnitt). Um die Kontrolle über den Ausschnitt zu haben (speziell bei Hochformat), kann ein Zuschneiden vor dem Upload ins CMS sinnvoll sein. Das vergrösserte Bild wird dann wieder in seinen Original-Proportionen dargestellt.

Slideshow

Slideshows brauchen weniger Platz als Galerien, zeigen aber auch nur ein Bild gleichzeitig. Bilder innerhalb einer Slideshow sollten immer die gleichen Bilddimensionen besitzen, da Grössenunterschiede zu unschönem «springen» der Galerie und/oder des nachfolgenden Inhaltes führen können.
Aus diesem Grund werden alle Bilder für Slideshows automatisch auf das Format 16:9 im Querformat zugeschnitten (zentraler Ausschnitt). Um die Kontrolle über den Ausschnitt zu haben (speziell bei Hochformat), kann ein Zuschneiden vor dem Upload ins CMS sinnvoll sein.

  • Fels im Meer

Bildergalerie