Vielleicht möchtet ihr ja gerne mal auf die Schnelle einen Screenshot erstellen, diesen mit einem Wasserzeichen versehen und weboptimiert auf Eure Seite hochladen? Das alles ist mit dem Multitalent IrfanView möglich. Ich hatte die Funktion Fotografieren zwar bereits unter den Optionen bemerkt, aber kürzlich erst einmal ausprobiert und festgestellt, wie schnell und einfach diese zu handhaben ist.

Das Einfügen eines Wasserzeichens ist vielleicht bei Screenshots nicht unbedingt erforderlich – zumindest verwende ich selber keins. Aber dieses kann als Text sogar auf drei verschiedene Arten eingefügt werden. Und wenn nicht in einem Screenshot dann vielleicht mal in Euren Fotos.

Jeder Webseitenbetreiber sollte darauf achten, dass Grafiken, die er auf seine Seite lädt, webseitenoptimiert sind.. Durch das Riot-Plugin (auch für Gimp und XnView erhältlich) und der Einbindung von optipng ist das auch kein Staatsakt mehr. Riot gibt es auch als Einzelsoftware für diejenigen, die Grafiken lieber mit anderen Bildprogrammen bearbeiten.

Screenshots erstellen

Die Grundfunktionen für Screenshots sind alle vorhanden. Ob ein ganzes Fenster, ein viereckiger Bereich oder den sichtbaren Teil einer Webseite. Leider besteht nicht die Möglichkeit, eine scrollende Webseite zu fotografieren. Falls ihr diese Funktion öfter benötigt, seid ihr mit dem Firefox-Addon Fireshot besser bedient.

Über Bearbeiten >> Zeichnen-Dialog anzeigen besteht sogar noch die Möglichkeit, ein paar Zusatzinformationen auf dem Screenshot zu platzieren.

Wasserzeichen einfügen

Hierfür habe ich drei Möglichkeiten ausprobiert. Am häufigsten wird im Internet die Methode per Batch-Konvertierung/Umbenennung beschrieben. Aber ich finde eine andere Option wesentlich eleganter.

1. Wasserzeichen per Konvertierung/Umbenennung

Hierzu geht man über Datei auf Batch(Stapel)-Konvertierung/Umbenennung und fügt die gewünschten Bilder in das untere Fenster ein. Die folgenden Schritte zeige ich anhand eines Screenshots:

Diese Möglichkeit bietet sich an, wenn man wirklich mehrere Bilder auf einmal bearbeiten und gleichzeitig in ein anderes Bild-Format speichern und umbenennen möchte.

Aber wirklich schön finde ich das Wasserzeichen nicht. Die Farbauswahl ist äußerst beschränkt und die Schrift wirkt plump. Gut finde ich, dass ich keine komplizierte Tastenkombination für das Copyright-Zeichen verwenden muss, dafür ist sogar ein Button vorhanden. Ehrlich gesagt verstehe ich gar nicht, dass dieses die meist beschriebene Funktion im Internet ist, bei IV ein Wasserzeichen einzufügen, denn es gibt noch die Möglichkeit…

2. …ein Wasserzeichen per Text einfügen

Zuerst müsst ihr eine viereckige Markierung erstellen, indem ihr an der gewünschten Position mit dem Mauszeiger ein Rechteck zieht. Anschließend geht ihr über Bearbeiten auf Text einfügen(Markierung). Auch bei dieser Option besteht die Möglichkeit per Button das Copyright-Zeichen einzufügen. Allerdings benötigte ich hier mehrere Anläufe, bis ich es so hinbekommen habe, dass der gesamte Text auch wirklich in der Markierung angezeigt wurde.

Hatte ich die Schrift zu groß gewählt, dann wurde der Rest des Textes abgeschnitten oder umgebrochen. Das Vergrößern der Markierung bewirkte nicht, dass der Text sich entsprechend anpasste. Und bei dieser Funktion war die Farbauswahl für die Schrift ebenfalls sehr begrenzt.

3. Wasserzeichen per Zeichnen Dialog

Für mich ist die bessere Alternative das Wasserzeichen mit der Textfunktion aus der Werkzeugleiste im Zeichnen-Dialog-Modus (Menü Bearbeiten) in den Screenshot einzufügen. Der Vorteil bei dieser Option ist, dass man einmal die Position des Wasserzeichens genauer bestimmen kann. Außerdem kann eine wesentlich dezentere Schriftfarbe (z. B. hellgrau) aus einer umfangreichen Windows-Farbpalette ausgewählt werden.

Zur Bestimmung der Position habe ich in der Werkzeugleiste auf den Textmodus geklickt und den Cursor z. B. im Bereich der rechten unteren Ecke platziert. Hatte ich dann den Text rechtsausgerichtet erstellt, erschien er gleich beim ersten Versuch genau an dieser Position und es wurde nichts wie bei Punkt 2 abgeschnitten.

Für das Web optimieren

Statt einfach nur das Bild abzuspeichern, wählt ihr nun unter Datei aus dem Kontextmenü Speichern fürs Web…(Plugin). Voraussetzung dafür ist, dass ihr die IrfanView Plugins installiert habt, die u. a. das RiotPlugin beinhalten. Sollte es aus irgendwelchen Gründen nicht enthalten sein, so könnt ihr es auch direkt von der Entwicklerseite herunterladen und installieren.

Für die zusätzliche Optimierung ist auf dieser Seite optipng erhältlich. Die entzippte exe-Datei kopiert ihr anschließend in das Pluginverzeichnis von IrfanView.

Möchtet ihr nun png-Grafiken optimieren, dann wählt bitte bei den png-Optionen unter External optimizers OptiPng aus und klickt auf das grüne Häkchen. Für Screenshots wie in diesem Beitrag meine ich allerdings, dass das Dateiformat jpg vollkommen ausreicht.

Zum Vergleich: dieser Screenshot in der ursprüngliche Größe von 856,09 KiB, 1053 px x 855 px, beträgt als optimiertes png-Format bei einer Größe von einer Pixelgröße 600 x 487 immerhin noch 181,02KiB.

Als jpg-Format und zusätzliche Reduzierung der Qualität auf 85% ergibt dies eine Dateigröße von 65,84 KiB.

Natürlich sollte man auch keine Bilder mit einer Pixelbreite von 1000 px oder sogar mehr hochladen, da diese eh meist skaliert werden und dadurch die Ladezeit einer Seite beeinträchtigt wird. Ich verwende z. B. für meine Screenshots eine Breite von 600 bzw. 800 px. 800 px verwende ich aber nur, wenn ich es für wichtig halte, dass bestimmte Details in einem Screenshot für den Besucher noch lesbar sein sollen. Dank der Edit-Funktion in Riot könnt ihr Bilder neben der Optimierung gleichzeitig verkleinern.

Ich wünsche Euch viel Spaß beim Ausprobieren.