Würdiger Rahmen

Jhead, Convert & Montage

18.12.2008
Mit den Programmen aus dem Imagemagick-Paket zaubern Sie im Handumdrehen schicke HTML-Galerien, die sich nicht nur ins Web stellen, sondern auch auf CD/DVD brennen lassen.

Programme zum Erstellen von HTML-Bildergalerien gibt es wie Sand am Meer: Die meisten dieser Tools setzen auf PHP oder Ähnliches, um Inhalte dynamisch zu generieren. Darf es stattdessen etwas einfacher ausfallen, empfehlen sich diverse Programme aus dem Imagemagick-Paket: Damit zaubern Sie im Handumdrehen schicke HTML-Galerien, die sich nicht nur ins Web stellen, sondern auch auf CD/DVD brennen lassen, da sie ganz ohne Webserver im Hintergrund auskommen.

Die Schmuckstücke vorbereiten

Bevor Sie die Galerie einrichten, bringen Sie die Fotos in Form. Dazu gehört neben dem Sortieren der Bilder auch die korrekte Ausrichtung der Schnappschüsse sowie eventuell das Anpassen der Größe. Das Programm Jhead [1] hilft dabei, die Bilder richtig herum zu drehen. Jhead liest die Exif-Informationen der Fotos aus und bietet verschiedene Optionen an, um diese zu verändern. Mit der Option -autorot drehen Sie alle Bilder eines Verzeichnisses in die korrekte Richtung :

§§nonumber
$ <§§B>jhead -autorot *<§§B>
Modified: IMG_0231.JPG
Modified: IMG_0234.JPG
…

Jhead einrichten

Die meisten Distributionen installieren Jhead nicht standardmäßig, es lässt sich aber meist über den Paketmanager schnell nachrüsten. Finden Sie es dort nicht, bietet die Jhead-Webseite Binaries für viele Betriebssysteme (darunter auch Windows und Mac OS X), ein RPM sowie die Quellen zum Kompilieren.

Abbildung 1 zeigt das Ergebnis des Kommandos: links die Originalbilder im Dateimanager, rechts die gedrehten Schnappschüsse nach dem Jhead-Befehl. Nun kann es an die Größenanpassung gehen – nicht jeder verfügt über ausreichend Bandbreite und Plattenplatz, um riesige Bilder in der Webgalerie zu präsentieren.

Abbildung 1: Mit nur einem Kommando in die richtige Richtung: Jhead dreht Bilder.

Beim Skalieren zahlreicher Dateien am Stück demonstriert das Kommandozeilentool convert aus dem Imagemagick-Paket seine Qualitäten. Mit nur einem einzigen Befehl bringen Sie alle Fotos auf die gewünschte Größe. Das Kommando identify (ebenfalls Teil der Imagemagick-Tools) verrät, wie groß die Originale ausfallen:

§§nonumber
$ <§§B>identify *<§§B>
IMG_0231.JPG JPEG 1200x1600 Dire§§
ctClass 1.4mb
IMG_0234.JPG[1] JPEG 1200x1600 D§§
irectClass 752kb
IMG_0235.JPG[2] JPEG 1600x1200 D§§
irectClass 844kb
…

Um nun alle Bilder für die Galerie beispielsweise auf 800x600 zu "schrumpfen", die Originale zu behalten und die verkleinerten Schnappschüsse in einem Unterordner namens small_pics zu speichern, tippen Sie beispielsweise:

$ test -d small_pics || mkdir sm§§
all_pics && for i in *.JPG; do c§§
onvert -resize 800x800 "$i" "sma§§
ll_pics/$i"; done

Hier sieht test zunächst nach, ob das Verzeichnis small_pics schon existiert (Parameter -d). Nur, wenn das nicht der Fall ist, erstellt das nachfolgende mkdir den Ordner. Der Operator && sorgt dafür, dass der Aufruf von Convert nur dann stattfindet, wenn das Erstellen des Verzeichnisses erfolgreich war [2]. Dabei sorgt die Angabe von 800x800 dafür, dass Convert die vorher 1600 x 1200 Pixel großen Bilder auf 800 x 600 Punkte verkleinert. Bilder, die 1200 x 1600 Pixel groß waren, messen anschließend 600 x 800 Bildpunkte. Hier dient 800x800 also als "Maximalangabe": -resize verkleinert das Bild auf ein Rechteck, das genau in die Zielgröße hineinpasst – ohne zu verzerren.

Ein nachfolgendes identify small_pics/* bestätigt, dass die verkleinerten Fotos nun richtig herum gedreht im Unterordner liegen.

Bilder beschriften

Möchten Sie Ihren Fotos gerne einen Copyright-Vermerk verpassen, dann greifen Sie ebenfalls zum Tool Convert. Ein solches Wasserzeichen muss sowohl auf hellen als auch auf dunklen Bildern gut sichtbar ausfallen. Darüber hinaus sollte es zwar schwierig zu entfernen, aber dennoch nicht zu nervig sein. Die folgenden Convert-Optionen eignen sich prima, um Bilder zu beschriften:

  • -font: Dieser Parameter wählt die Schriftart für das Wasserzeichen aus. Als zusätzliche Angabe definieren Sie entweder den Schriftnamen (zum Beispiel -font helvetica oder -font arial) oder den vollen Pfad zu einer installierten Schrift (etwa -font /usr/share/fonts/truetype/msttcorefonts/Comic_Sans_MS.ttf).
  • -pointsize: Mit dieser Option spezifizieren Sie die Schriftgröße in Punkt (zum Beispiel -pointsize 40).
  • -draw: Dieser Aufrufparameter nimmt gleich mehrere weitere Argumente entgegen, wie etwa die Position des Wasserzeichens (gravity south) oder die Farbe der Beschriftung (fill black text, fill white text). Um einen Schatteneffekt zu erzielen, können Sie einen kleinen Versatz zwischen weißem und schwarzen Text definieren. Die Argumente für -draw schließen Sie in Hochkommas ein; enthält der Wasserzeichentext Leer- oder Sonderzeichen, dann schachteln Sie diesen ebenfalls in Hochkommas.

Zusätzlich erwartet Convert die Angabe der Originaldatei sowie einen Namen für das Bild mit dem Wasserzeichen. Ein Beispiel für den kompletten Befehl finden Sie in Listing 1, die Abbildung 2 zeigt das Ergebnis dieses Aufrufs. Wie im vorherigen Abschnitt gezeigt, können Sie das Markieren der Bilder wieder automatisieren und auf einen Rutsch allen Schnappschüssen den Vermerk verpassen und diese in einem neuen Unterverzeichnis ablegen (Listing 2).

Abbildung 2: Das Programm Convert versieht Ihre Schnappschüsse auf Befehl mit einem Copyright-Vermerk.
Listing 1
§§nonumber
$ convert -font helvetica -point size 40 -draw "gravity south fill black text 0,12 'Copyright Heike Jurzik' fill white text 1,11 'Copyright Heike Jurzik'" IMG_0262.JPG IMG_0262_Copy.JPG
Listing 2
§§nonumber
$ test -d copy_pics || mkdir copy_pics && for i in *.JPG; do convert -font helvetica -pointsize 40 -draw "gravity south fill black text 0,12 'Copyright Heike Jurzik' fill white text 1,11 'Copyright Heike Jurzik'" "$i" "copy_pics/$i"; done

Nach diesen Vorarbeiten geht es nun an das Erstellen der HTML-Galerie. Mögen Sie es schlicht und funktional, greifen Sie zum im nächsten Abschnitt vorgestellten Convert-Befehl. Alternativ können Sie mit Montage etwas tiefer in die Trickkiste greifen. Tipps dazu finden Sie im übernächsten Abschnitt ("Geschickt montiert").

Pixelgenaue Galerie

Eine ganz schlichte HTML-Galerie basteln Sie mit Convert in Kombination mit dem Aufrufparameter für so genannte Visual Directories. Das Kommando

$ convert 'vid ' index.html

erstellt eine HTML-Datei, die eine Übersichtsgrafik (im GIF-Format) mit einer Image Map enthält. Über diese erreichen Sie die einzelnen Schnappschüsse per Mausklick auf die Vorschaubilder. Das Ergebnis des Befehls sehen Sie in Abbildung 3. Stellen Sie alle Fotos zusammen mit der Index- und der GIF-Datei ins Web, dann haben Sie bereits eine einfache Galerie.

Abbildung 3: Convert erzeugt einfache Übersicht der Urlaubsschnappschüsse.

Die HTML-Datei können Sie in einem Texteditor Ihrer Wahl natürlich weiter anpassen und ausbauen, um zum Beispiel den Titel der Webseite selbst zu gestalten oder eine eigene Überschrift zu wählen. Für Ersteres schreiben Sie einen eigenen Eintrag zwischen die beiden title-Tags, wie etwa:

<title>Urlaub in Schottland/Engl§§
and</title>

Die Überschrift finden Sie hingegen zwischen den beiden Tags <h1> und </h1> – auch hier sind der eigenen Fantasie keine Grenzen gesetzt. Zahlreiche weitere Tipps und Tricks zu HTML lesen Sie bei SelfHTML [3] nach. Darf's ein bisschen mehr sein? Farbe, Rahmen und Beschriftungen liefert das Programm Montage.

Geschickt montiert

Das Programm Montage aus dem Imagemagick-Paket ist eigentlich dafür gedacht, mehrere Einzelbilder zu einem Ganzen zu kombinieren, zum Beispiel:

$ montage *.JPG montage.jpg

Geben Sie als Zielformat anstelle eines Bildes wieder eine HTML-Datei an, also montage *.JPG index.html, erstellt das Tool genau wie Convert eine einfache Galerie mit Image Map und Übersichtsgrafik. Zahlreiche weitere Montage-Parameter bieten jedoch noch mehr Kontrolle über das Layout der Galerie und erstellen wahre Schmuckstücke.

Der Parameter -label fügt den Bildern eine Beschriftung hinzu. Über verschiedene Attribute bestimmen Sie, welche Informationen dieses Etikett enthält. Für eine Webgalerie eignen sich beispielsweise:

  • %f oder %t für den Dateinamen (einmal mit und einmal ohne Dateiendung),
  • %b für die Dateigröße und
  • %w und %h für Breite und Höhe.

Diese Formatierungszeichen lassen sich beliebig miteinander verknüpfen – eine vollständige Liste aller Attribute finden Sie unter [4]. Die Attribute sollten Sie in Anführungszeichen einschließen. Damit die Etiketten nicht übers Ziel hinaus schießen, fügen Sie mit \n Zeilenumbrüche in die Label ein.

Mit der Option -size beeinflussen Sie in einer Montage die Größe der Kacheln. Wahlweise geben Sie hinter dem Parameter nur die Breite oder Breite und Höhe an (-size 128x oder -size 128x128).

Die Anweisung -title setzt eine Überschrift. Allerdings ist hiermit nicht der HTML-Code gemeint: Montage schreibt den Titel direkt in die Übersichtsgrafik (index.gif) hinein.

Wie der Name schon vermuten lässt, richten Sie mit -tile das Layout der Kacheln ein. Um zum Beispiel zwölf Einzelbilder in drei Reihen zu je vier Bildern anzuordnen, definieren Sie -tile 4x3. Sie müssen allerdings nicht jedesmal die Bilder zählen und sich überlegen, wie die jeweilige Anzahl von Fotos sich gut kacheln lässt: Geben Sie hinter -tile nur die Anzahl für die Zeile (-tile 4x) oder Spalte (-tile x5) an, wählt Montage selbst ein passendes Layout und ordnet die Schnappschüsse an.

Die Option -geometry eignet sich dazu, den Leerraum um die einzelnen Kacheln herum festzulegen. So sorgt -geometry +2+2 etwa für einen 2 x 2 Pixel großen Rand.

Der Parameter -frame rahmt Ihre Bilder ein. Die Dicke des Rahmens geben Sie direkt hinter der Option an, zum Beispiel -frame 5 für einen Rahmen von fünf Pixeln. Optional verpassen Sie dem Rahmen über -mattecolor Farbe eine Farbe Ihrer Wahl. Als Attribut versteht die Option unter anderem Farbnamen (zum Beispiel red, blue, green etc.), RGB-Werte (wie "rgb(255,0,0)", "rgb(0,0,255)", "rgb(0,255,0)" etc.) oder Hexadezimal-Werte (etwa "#FF0000", "#0000FF", "#00FF00" und so fort). Achten Sie darauf, die RGB-und Hexadezimal-Varianten in Hochkommas einzuschließen.

TIPP

Eine Liste der verfügbaren Farben blenden Sie über convert -list color ein; die RGB- und Hexadezimal-Angaben finden Sie darüber hinaus schnell mithilfe von Programmen wie gcolor2 oder Kcoloredit heraus.

Die Option -shadow setzt einen hübschen Schatteneffekt um die Vorschaubilder und lässt sich wahlweise mit oder ohne -frame nutzen. Falls Sie einen Schatten um die Kacheln setzen, dann achten Sie darauf, vorher mit der Option -geometry einen ausreichend großer Abstand zwischen den einzelnen Kacheln zu definieren.

Der vollständige Montage-Befehl könnte zum Beispiel so aussehen wie in Listing 3. Die Abbildung 4 zeigt die fertige Galerie, die dieses Kommando erstellt hat.

Listing 3
§§nonumber
$ montage -label '%t\n%b Bytes' -size 128x *.JPG -title 'Urlaub in England/Schottland' -tile 5x -geometry +5+5 -frame 5 -mattecolor "#3FCA3F" -shadow index.html
Abbildung 4: Beschriftet, gerahmt und gefärbt: Montage erstellt recht ansehnliche Fotoalben.

Individuell beschriften

Den Parameter zum Setzen des Etiketts (-label) können Sie nicht nur automatisiert auf Schnappschüsse anwenden, sondern auch zur individuellen Beschriftung der Bilder einsetzen. Dazu definieren Sie vor jedem Dateinamen jeweils über -label eine Beschreibung für das Foto. Enthält diese Leer- oder Sonderzeichen, schließen Sie sie wie gewohnt in Anführungszeichen ein. Das Attribut \n sorgt wiederum für einen Zeilenumbruch, so dass sich die Beschreibungen gegenseitig nicht überlappen, wenn diese einmal etwas länger ausfallen (Listing 4, Zeile 1). Bei Bedarf verknüpfen Sie die Formatierungszeichen und den eigenen Text (Listing 4, Zeile 2).

Listing 4
§§donumber
$ montage -label 'Schloss in\n Durham' IMG_0231.JPG -label 'Kathedrale\n in Durham' IMG_0234.JPG …
$ montage -label 'Schloss in\n Durham\n%t\n%b Bytes' IMG_0231.JPG -label 'Kathedrale\n in Durham\n%t\n%b Bytes' IMG_0234.JPG

Eine andere Möglichkeit ist, die Bilder zunächst einzeln mit Kommentaren zu versehen. Dazu verwenden Sie wiederum Convert zusammen mit dem Parameter -comment, einer Beschreibung und dem neuen Dateinamen:

$ convert -comment 'Schottische §§
Flagge' IMG_0279.JPG IMG_0279_C.§§
JPG

Achten Sie auch bei dieser Auszeichnungsmethode darauf, dass Sie für lange Beschriftungen über \n Zeilenumbrüche einfügen. Haben Sie alle Schnappschüsse auf diese Weise beschriftet, teilen Sie Montage anschließend mittels -label '%c' '*_C.JPG' mit, dass die Etiketten für die Ausstellungsstücke die vorher gesetzten Kommentare sein sollen.

Montage bietet noch jede Menge weitere Optionen: Sofern Sie eine neuere Imagemagick-Version (ab 6.3.2) verwenden, können Sie der Galerie beispielsweise einen pfiffigen Polaroid-Look verpassen (siehe Kasten "Montage für Fortgeschrittene"). Weitere Anwendungsbeispiele mit ausführlichen Erklärungen zeigt darüber hinaus die (englischsprachige) Imagemagick-Website [5].

Vom Entwurf zum Drehbuch

Alle hier gezeigten Befehle lassen sich mit wenig Aufwand zu einem kleinen Shell-Skript zusammensetzen, das Sie in Listing 5 sehen. Als zusätzliches Feature testet das Skript am Anfang, ob ein Verzeichnis namens small_pics und ein Verzeichnis copy_pics unterhalb von small_pics existiert: falls ja, läuft das Skript nur weiter, wenn Sie es zusammen mit der Option -overwrite aufgerufen haben. Andernfalls erhalten Sie den Hinweis, dass das Verzeichnis schon existiert, und das Skript bittet um Bestätigung über die Aufrufoption -overwrite.

Das Skript findet beispielsweise Platz in einem Ordner namens bin im eigenen Home-Verzeichnis. Nachdem Sie es über chmod +x ~/bin/galerie.sh ausführbar gemacht haben, rufen Sie es im Verzeichnis mit den Originalbildern, die ins Album sollen, über ~/bin/galerie.sh auf, und kurze Zeit später ist die HTML-Galerie fertig.

Listing 5
§§nonumber
#!/bin/sh
# galerie.sh zum Erzeugen von Fotogalerien
if [ -d small_pics -o -d small_pics/copy_pics ];
then
   if [ "$1" != "-overwrite" ];
   then
      echo "Verzeichnis(se) schon vorhanden – bitte starten Sie das Skript mit der Option '-overwrite'. Achtung: Überschreibt vorhandene Bilder!"
      exit 1
   fi
fi
mkdir -p small_pics/copy_pics
for i in *.JPG
   do
      convert -resize 800x800 "$i" "small_pics/$i"
   done
cd small_pics
for i in *.JPG
   do
      convert -font helvetica -pointsize 40 -draw "gravity south fill black text 0,12 'Copyright Heike Jurzik' fill white text 1,11 'Copyright Heike Jurzik'" "$i" "copy_pics/$i"
   done
cd copy_pics
montage -label '%t\n%b Bytes' -size 128x *.JPG -title 'Urlaub in England/Schottland' -tile 5x -geometry +5+5 -frame 5 -mattecolor "#3FCA3F" -shadow index.html

Montage für Fortgeschrittene

Neuere Imagemagick-Versionen (ab 6.3.2) enthalten das so genannte Polaroid-Feature. Der gleichnamige Aufrufparameter (+polaroid respektive -polaroid, je nach Einsatzzweck) verpasst Fotos einen schicken Polaroid-Look. Der Befehl

$ convert bild.jpg +polaroid bild.png

schließt das Bild in eine Art Papierrahmen ein und dreht es um einen zufälligen Wert. Daneben können Sie über -bordercolor die Rahmenfarbe und über -background einen Farbton für den Schatten festlegen:

$ convert bild.jpg -bordercolor white -background black +polaroid bild.png

Es ist wichtig, für das neue Polaroid-Bild ein Format zu wählen, das Transparenz darstellen kann (zum Beispiel PNG oder GIF).

Wie bereits erwähnt, kippt der Schalter die Bilder um einen zufälligen Wert, wenn er mit einem Pluszeichen versehen wird. Das ist dann praktisch, wenn Sie eine ganze Reihe von Fotos in einem hübschen Index mit Polaroid-Effekt anordnen wollen. Alternativ erhalten Sie über ein vorangestelltes Minuszeichen und einen darauffolgenden Wert die volle Kontrolle. So kippt die Angabe -polaroid 90 das Bild beispielsweise um 90 Grad.

Der Polaroid-Parameter leistet gute Dienste, wenn Sie mit Montage eine Galerie fürs Web erstellen. Setzen Sie die Option mit einem vorangestellten Pluszeichen ein, dreht das Programm jedes Foto um einen anderen Wert:

$ montage -size 128x *.JPG -tile 4x -geometry +1+1 -shadow +polaroid index.html

Die aus diesem Befehl resultierende Galerie im Polaroid-Look sehen Sie in Abbildung 5.

Abbildung 5: Pfiffiger Polaroid-Look für die Webgalerie: Montage macht's möglich.

Glossar

Exif

Exchangeable Image File Format. In diesem Format speichern Digitalkameras zusätzliche Informationen zu den Bildern. Neben Angaben zu Blende, Verschlusszeit oder zum Einsatz des Blitzes umfassen die Exif-Daten auch Informationen zur Orientierung, also um wie viel Grad die Kamera während der Aufnahme gedreht wurde.

Image Map

So genannte Verweis-sensitive Grafiken, in denen ein Benutzer auf einen definierten Bereich klicken kann und damit einem Verweis (Link) folgt. Der Bereich, der den Link enthält, kann wahlweise als Rechteck, Kreis oder Polygon definiert sein. Die Koordinaten, welche die Bereiche eingrenzen, werden pixelgenau definiert.

Infos

[1] Jhead-Homepage: http://www.sentex.net/~mwandel/jhead/

[2] Ein-/Ausgabeumleitung: Heike Jurzik, "Datenfluss", LinuxUser 07/2007, S. 94, http://www.linux-user.de/ausgabe/2007/07/094-zubefehl/

[3] HTML-Tutorial: http://de.selfhtml.org/

[4] Formatoptionen in Imagemagick: http://www.imagemagick.org/script/escape.php

[5] Verwendung der Imagemagick-Tools: http://www.imagemagick.org/Usage/

LinuxCommunity kaufen

Einzelne Ausgabe
 
Abonnements
 

Ähnliche Artikel

Kommentare