24. Tipps zur Kursraum- und Textgestaltung

24.9. Wie erstelle ich Thumbnails von Bildern?

Beschreibung

Thumbnails sind bei Klick vergrößerbare Miniaturansichten von Bildern. Thumbnails bieten sich z.B. bei Bildern und Grafiken an, die im Detail betrachtet werden sollen, die aber in der Originalgröße den Lesefluß stören würden (s. Beispiel im Unterkapitel der "Aufgabe").
Bei einem Klick auf den Thumbnail öffnet sich das Originalbild im selben oder einem neuen Browserfenster.



Fotos (C) HAW Hamburg (l.: Jonas Fischer / r.: Walter Mücksch)
Die Thumbnails öffnen sich vergrößert im selben Browserfenster.


Anleitung

Wir erklären Ihnen hier, wie Sie große Bilder als anklickbare, kleine Übersichtsbilder darstellen.

    1. Öffnen Sie das "Bildeigenschaften"-Menü für das Bild
      Klicken Sie im Textfeld per Doppelklick auf das Originalbild; oder wählen Sie dieses per Einfackklick aus und wählen anschließend das Symbol "Bild einfügen oder bearbeiten" [].
      Es öffnet sich das Menü "Bildeigenschaften".

    2. Verkleinern Sie die Größe des Bildes auf Thumbnailmaße. Falls Sie mehrere Thumbnails verwenden, empfiehlt es sich, je nach Arrangement der Thumbnails eine Dimension konstant zu halten (z.B. 150 Pixel Höhe bei einer horizontalen Reihe). Bei Klick auf "Proportional" wird die andere Dimension der eingestellten angepasst.

    3. Verlinken Sie den Thumbnail.
      Kopieren Sie sich die Bild-URL aus dem Menü "Bildeigenschaften" aus dem Feld unter "URL eingeben" heraus. Nach dem Schließen des Menüs wählen Sie das jetzt verkleinerte Bild erneut durch Klick an, wählen das "Link"-Icon [] im Texteditor und geben dort die Bild-URL ein.
      Wenn Sie "In neuem Fenster öffnen" auswählen, wird das Originalbild in einem neuen Browsertab geöffnet.

Achtung: Die Bilder werden bei dieser Methode nicht im Datenvolumen verkleinert! D.h. die verkleinerte Ansicht eines z.B. 5 MB großen Bildes lädt das gesamte Bild und stellt es lediglich verkleinert dar.

Bedingt durch eine ungewollte HTML-Codierung kann es gelegentlich nach Formatierungen über Einrückungen und Listen dazu kommen, dass der Link zur Bilddatei als Attribut TITLE und nicht als HREF eingefügt wird. Hier muss per HTML-Editiermodus umgestellt werden.


Weitere externe Ressourcen

Youtube-Links werden üblicherweise automatisch als abspielbare Videos dargestellt. Dies kann z.B. in Linklisten den Lesefluss stören. In diesem Youtube-Video wird dargestellt, wie diese Funktion ausgestellt werden kann: Im HTML-Code muss im Youtube-Link hinter dem Fragezeichen ein embed=no& eingefügt werden:

https://www.youtube.com/watch?embed=no&v=8dYIxVMEOig