Tutorial: Medien­galerie & Slide­show

Wir erklären Ihnen in diesem Tutorial-Bereich, wo Sie Medien­galerien & Slide­shows erstellen und wie Sie diese bearbeiten. Für Ihre Website ergeben sich hier viel­fältige Gestaltungs­möglich­keiten. Und vergessen Sie nicht, ein Bild sagt oft mehr als Tausend Worte 😉.

Wenn Sie dazu Fragen haben, melden Sie sich bei uns. Wir helfen gerne.

Mediengalerie

Slideshow

Beim Anlegen eines neuen Slides finden Sie bei Ausrichtung und Einpassung verschiedene Variations­möglichkeiten. Voraus­gewählt ist bei Ausrichtung genau die Mitte und bei Einpassung ausge­füllt.

1. Beispiel: Slide­shows mit ausgefüllten Bildern

  • Slideshow-Einstellung: "Einpassung" "ausgefüllt"

Ihre Bilder werden vollflächig an die Bildschirm­breite angepasst. Der gesamte Slideshow-Container ist gefüllt. Sie wählen den Fokus und legen fest, welcher Teil des Bildes erscheint.

lila Blume

Originalbild

Ausrichtung oben links - Einpassung ausgefüllt

Ausrichtung unten rechts - Einpassung ausgefüllt

Ausrichtung mittig mittig - Einpassung ausgefüllt

2. Beispiel: Bilder mit originaler Breite & verschiedenen Ausrichtungen

  • Slideshow-Einstellung: "Einpassung" "original"

Die originale Größe des Bildes bleibt immer gleich und wird so innerhalb des Slideshow-Bereiches auf dem jeweiligen Bild­schirm ausge­geben. Je nach horizontaler und vertikaler Ausrichtung positioniert sich das Bild unter­schiedlich.

Das verwendete Bild ist und bleibt 200 x 100 Pixel groß. Der hier dunkelgrau hinter­legte Slideshow-Container wird nicht ausge­füllt.

lila Blume

Originalbild: 200 x 100 Pixel

Ausrichtung oben links - Einpassung original

Ausrichtung mittig rechts - Einpassung original

Ausrichtung unten links - Einpassung original

Ausrichtung unten rechts - Einpassung original

Ausrichtung mittig mittig - Einpassung original

Ausrichtung mittig links - Einpassung original

Ausrichtung unten mittig - Einpassung original

Ausrichtung oben mittig - Einpassung original

Ausrichtung oben rechts - Einpassung original

3. Beispiel: Slideshow mit eingepassten Bildern

  • Slideshow-Einstellung: Einpassung "eingepasst"

Mit dieser Einstellung werden Ihre Bilder innerhalb der Slideshow immer zur Gänze sichtbar angezeigt. Dabei passt sich das Bild je nach Seiten­verhältnis entweder in der Höhe, oder in der Breite an den Slideshow-Container an. Je nach Bildab­messungen wird es entweder vergrößert oder verkleinert. Verwendet wird hier das Bild mit 600 x 400 Pixel.

lila Blume

Originalbild: 600 x 400 Pixel

Ausrichtung oben links - Eingepasst

Ausrichtung oben mittig - Eingepasst

Ausrichtung oben rechts - Eingepasst

Ausrichtung mittig links - Eingepasst

Ausrichtung mittig mittig - Eingepasst

Ausrichtung mittig rechts - Eingepasst

Ausrichtung unten links - Eingepasst

Ausrichtung unten mittig - Eingepasst

Ausrichtung unten rechts - Eingepasst

Ein paar Slideshow-Ideen

Mit etwas Geschick können Sie die hinter­einander erscheinenden Bilder gezielt nutzen und es entstehen einzigartige Effekte. Beim ersten Beispiel haben wir ein Hintergrund-Bild verbaut. Die zweite Slideshow präsentiert einige Team-Mitglieder.

Seien Sie kreativ und kombinieren die Variationen. Lassen Sie sich überraschen, was so alles entstehen kann.

Mohnblumenfeld

Originalbild

Ausrichtung mittig links - Einpassung ausgefüllt
Ausrichtung mittig links - Eingepasst

Ausrichtung mittig rechts - Einpassung original

Ein paar weitere Tipps...

  • Ausschlag­gebend für die Ausgabe Ihrer Bilder in der Slideshow ist auch das Layout Ihrer Inhaltszeilen. Damit haben Sie noch mehr künstlerische Freiheiten bei der Gestaltung Ihrer Website, denn Slideshows müssen nicht immer die gesame Fläche füllen.
  • Verbauen Sie nicht zu große Bilder (über 2000 Pixel) in Ihrer Slideshow. Die Lade­zeit wird dadurch erhöht, was negative Auswirkungen auf die Suchmaschinen-Optimierung hat.
  • Verwenden Sie maximal 7 Slides. Bei zu vielen Slides braucht Ihre Seite ebenfalls länger zum Laden.