Bildergalerie

Mit einer Bildergalerie bieten Sie den Besuchern Ihrer Website Bilder als elegante Diashow an.

Die Bildgalerie besteht aus zwei Elementen:

• den Thumbnails: das sind die Miniatur- oder Vorschaubilder, die auf der Webseite angezeigt werden
• der Lightbox-Galerie: dies ist die eigentliche Dia-Show, in der der Betrachter blättern kann. Die Lightbox-Galerie wird durch Klick auf ein Thumbnail-Bild gestartet.

Sowohl die Bildgrösse für die Thumbnails als auch für die Lightbox können Sie in den Einstellungen der Galerie festlegen. So passen Sie eine Bildergalerie rasch und unkompliziert an Ihre Bedürfnisse an. Diese Einstellungen nehmen Sie wie gewohnt im Dialog für die Absatz-Eigenschaften der Bildergalerie vor.

Am einfachsten fügen Sie die Bilder per Drag & Drop aus der Dateiablage in die Editorfläche des Absatzes ein: Markieren Sie hierzu die gewünschten Bilder und ziehen Sie diese bei gedrückter Maustaste auf die Editorfläche, welche alle für den Absatz anzuzeigenden Bilder enthält. Sobald Sie die Maustaste loslassen, werden die Bilder an der Position des Mauszeigers eingefügt. Sie können so Bilder am Ende der Bildersammlung oder zwischen zwei beliebigen Bildern einfügen.

Alternativ können Sie Bilder über die Bildauswahl   in der Toolbar einfügen.

Die Reihenfolge der Bilder können Sie jederzeit problemlos ändern, siehe nächsten Abschnitt.

Am einfachsten verschieben Sie Bilder in der Bildersammlung des Absatzes per Drag & Drop: Markieren Sie hierzu die gewünschten Bilder und ziehen Sie diese bei gedrückte Maustaste an die neue Position. Sobald Sie die Maustaste loslassen, werden die ausgewählten Bilder an die neue Position verschoben.

Alternativ können Sie die Position eines Bildes in der Bildersammlung auch über die Toolbar oder die Tastatur ändern: Klicken Sie hierzu auf das gewünschte Bild und verschieben es mit einem Klick auf  oderin der Toolbar nach links bzw. nach rechts. Alternativ können Sie das Bild auch durch Drücken von ALT-Cursor_nach_links bzw. ALT-Cursor_nach_rechts verschieben.

Um eines oder mehrere Bilder aus der Bildersammlung des Absatzes zu entfernen,  markieren Sie die gewünschten Bilder und klicken dann in der Toolbar entweder oder Sie verwenden die Taste LÖSCHEN.

Für die Bilder-Galerie können Sie in den Farb-Einstellungen für das gewählte Design die folgenden Farben setzen:

Die gewünschte Grösse der Bilder bestimmen Sie selber, sowohl für die Thumbnail-Bilder als auch für die Bilder in der Lightbox-Diashow. Für die Thumbnails stehen Ihnen hierbei unterschiedliche Grössen zur Auswahl, für die Lightbox-Bilder können Sie zwischen zwei Varianten wählen:

• einheitliche Grösse für alle Bilder in der Galerie
• individuell pro Bild festgelegte Grösse.

Per Vorgabe verwendet eine neu angelegte Bildergalerie die Option "Bilder auf einheitliche Grösse zuschneiden" mit der Standard-Grösse 960 x 720 Pixel. Die Thumbnail-Grösse steht per Vorgabe auf 100 x 75 Pixel. Beide Grössen entsprechen einem Seiten-Verhältnis der Bilder von 4:3.

Für die Lightbox-Galerie haben Sie die Wahl zwischen:

• einheitlicher Bildgrösse für alle Bilder der Galerie: alle Bilder werden gleich gross dargestellt 
• individueller Grössenvorgabe pro Bild für die Lightbox-Darstellung: hier wird jedes Bild in der Grösse dargestellt, die Sie in den Bild-Eigenschaften vorgegeben haben.

Wenn Sie sich für eine einheitliche Bildgrösse entscheiden, können Sie zwischen zwei Optionen wählen:

• neun Standard-Bild-Grössen für Lightbox-Darstellung mit einheitlicher Bildgrösse
• eigene Bildgrösse festlegen, bei der Sie die Breite und Höhe in Pixeln selber wählen.

Mit der Option "Rahmen ausfüllen" können Sie dafür sorgen, dass ein Bild den durch die Bildgrösse definierten Rahmen stets komplett ausfüllt, sollte das Format des Bildes nicht optimal zur gewählten Bildgrösse passen. Das Seitenverhältnis des Bildes bleibt hierbei gewahrt, es kann jedoch vorkommen, das dadurch Teile des Bildes abgeschnitten werden.

Wenn Sie sich für die individuelle Grössenvorgabe pro Bild entscheiden, so legen Sie Breite und Höhe jedes Bildes in den Bildeigenschaften der einzelnen Bilder fest. Hierzu verwenden Sie wie für Bilder üblich den Zuschneiden-Dialog.

Die Thumbnails einer Bildgalerie haben jeweils die gleiche Grösse. Es stehen Ihnen vierzehn verschiedene Grössen zur Verfügung:

• vier quadratische Grössen von 32x32 bis 128x128
• drei Grössen im 4:3 Querformat von 64x48 bis 128x96 
• zwei Grössen im 3:2-Querformat 100x66 und 128x85
• drei Grössen im 3:4-Hochformat von 32x42 bis 96x128
• zwei Grössen im 2:3-Hochformat 66x100 und 85x128.

Die Thumbnail-Bilder werden auf der Basis der Lightbox-Bilder erstellt, damit der im Miniatur-Bild jeweils dargestellte Bildausschnitt dem für die Lightbox verwendeten Bildausschnitt entspricht.

Die Grösse der Vorschau-Bilder (Thumbnail) berechnete weblica automatisch; hierbei wird das Seitenverhältnis jedes Bildes gemäss den Bildgrössen-Einstellungen der Lightbox-Galerie bzw. des jeweiligen Bildes berechnet. Das Thumbnail wird also auf der Basis des Bilds für die Darstellung in der Lightbox generiert.

Um eine möglichst anschauliche Vorschau zu erhalten, wählt man die Thumbnail-Grösse passend zum Format der Bilder in der Galerie:

• für Bilder im Querformat eine Thumbnail-Grösse im Querformat
• für Bilder im Hochformat eine Thumbnail-Grösse im Hochformat
• für quadratische Bilder oder für Bilder mit gemischten Formaten (teils Quer-, teils Hochformat) ein quadratisches Thumbnail-Format.

Beim Generieren der Thumbnails optimiert weblica die Darstellung und passt Bilder mit abweichenden Formaten der gewählten Thumbnail-Grösse ein. Dadurch können oben und unten oder links und rechts Ränder in der für das Projekt eingestellten Hintergrundfarbe entstehen, der sog. Masken-Effekt. Die Hintergrund-Farbe wird hierbei wie folgt bestimmt:

• für Bilder mit transparentem Hintergrund:  Bild-Hintergrund für Thumbnails
• für Bilder ohne Transparenz: Hintergrund für nicht-transparente Bilder.

Diese Farben legen Sie für das gewählte Design in den Farb-Einstellungen des Projekts fest.

Farb-Ränder entstehen in den Thumbnails auch dann, wenn die Bildformate der Thumbnails und der Lightbox-Galerie nicht zusammenpassen. Erscheinen Ihnen die Ränder zu breit, passen Sie die Grösseneinstellungen der Thumbnails bzw. der Lightbox-Galerie an. Eventuell müssen Sie - besonders bei unterschiedlichen Formaten der Bilder Ihrer Galerie - verschiedene Einstellungen ausprobieren.

Auch in der Lightbox-Galerie passt weblica die Bilder der gewählten Grösse an, wenn Sie sich für eine einheitliche Bildgrösse entschieden haben. Folglich können auch hier wieder farbige Ränder entstehen.

Wenn Sie der Masken-Effekt stört, haben Sie mehrere Möglichkeiten, diesen zu umgehen:

• mit der Bild-Grösse experimentieren, wobei Sie für alle Bilder einer Galerie mit Vorteil möglichst Bilder mit gleichen Abmessungen verwenden
• Aktiveren Sie die Option "Rahmen ausfüllen": damit verhindern Sie, dass Bilder mit einem Leerbereich um das Bild herum entstehen, sollte das Bild nicht ganz auf die gewählte Grösse passen. Teile des Bildes werden dabei u.U. abgeschnitten. Wenn Sie das nicht wollen, wählen Sie die dritte Möglichkeit:
• legen Sie die Grösse individuell pro Bild fest. Das ist jedoch die aufwändigste Option, die viel Handarbeit erfordert.

Eine einheitliche Bildgrösse bei Bildern mit unterschiedlichen Formaten hat

• für den Betrachter den Vorteil, dass er die Navigationselemente immer am gleichen Ort findet,
• für den Bildersteller den Nachteil, dass Bilder ohne aktivierte Option "Rahmen beim Skalieren ausfüllen" eine Maske erhalten.

Die individuelle Grössenvorgabe pro Bild hat

• für den Betrachter den Nachteil, dass der Ort der Navigationselemente für jedes Bild verschieden ist und er deshalb für die Navigation die Maus bewegen muss
• für Sie als Bildersteller den Vorteil, dass Ihre Bilder unverändert dargestellt werden; das erfordert jedoch viel Handarbeit: Sie müssen jedes Bild einzeln zuschneiden.

Denken Sie im Zweifelsfall immer an den Bildbetrachter!

Optimieren Sie Ihre Bilder am besten vor dem Import in die Weblica-Dateiablage. Schneiden Sie (über-) grosse Bilder mit einem geeigneten Bildbearbeitungswerkzeug auf die Darstellungsgrösse in der Lightbox-Galerie zu. Komprimieren Sie Bilder im jpg-Format soweit als möglich (d. h.: bis noch kein sichtbarer Qualitätsverlust eintritt). Sie erzielen damit kürzere Ladezeiten Ihrer Seiten mit Bildergalerien und zufriedenere Besucher. Und auch die Suchmaschinen freuen sich über Ihren Fleiss.