Webdesign

World Wide Web

Andreas Blomenhofer

Tutorial – Fotobearbeitung mit Gimp

Diese Anleitung zur Fotobearbeitung mit Gimp erklärt, wie man Fotos verkleinern kann. Zum Bilderbearbeiten gibt es unzählige Software und Tools. In diesem Tutorial verwende ich zum Bearbeiten von Fotos das kostenlose Programm Gimp (Version 2.8.2), dass sich sehr gut zur professionellen Bildbearbeitung verwenden lässt.

Gimp unterliegt der GNU General Public License und ist somit Freeware. Unter folgenden Link können Sie Gimp herunterladen: www.gimp.org/downloads

Dieses Anfänger-Tutorial zur Bildbearbeitung beinhaltet nicht nur, wie man ein Foto verkleinert, sondern auch, wie man ein Bild schärfen kann, um die Fotoqualität zu verbessern. Zuletzt erkläre ich Ihnen, wie Sie ein Bild speichern können und welche Formate sich am besten dazu eignen, um dabei eine optimale Bildqualität zu erzielen.

Direkt zur Anleitung springen:

Aber für was verkleinern wir eigentlich Fotos?
Zum Beispiel, um ein Bild mit passender Größe in die Webseite einzubauen oder Fotos mit geringerer Dateigröße via E-Mail komfortabler versenden zu können. In den meisten Fällen fotografiert man mit hoher Bildqualität, um für die spätere Verwendungsmöglichkeiten flexibel zu sein.

In der Bildbearbeitung ist es immer leichter, wenn das Ausgangsmaterial eine hohe Bildqualität besitzt, denn verringern kann man sie immer.

Nachdem Sie Gimp auf Ihren Computer installiert haben, starten Sie das Programm.

1. Fotos verkleinern mit Gimp

1a) Klicken Sie in der Menüleiste auf „Datei“ und dann auf „Öffnen …“. Tastenkombination: „Strg+O“. (Abbildung 1)

GIMP - Datei öffnen
Abbildung 1

1b) Folgendes Fenster mit dem Namen „Bild öffnen“ erscheint. (Abbildung 2)

GIMP - Bild öffnen
Abbildung 2

1c) Wählen Sie ein passendes Bild aus, dass Sie auf Ihren PC abgespeichert haben. Ich empfehle Ihnen vorher eine Kopie Ihres Bildes zu erstellen, falls etwas nicht klappen sollte, weil dann haben Sie immer noch eine Kopie der Originaldatei.

Wenn Sie ein Bild ausgewählt haben, klicken Sie auf „Öffnen“.

1d) Nachdem Gimp das ausgewählte Bild geöffnet hat, klicken Sie in der Menüleiste auf „Bild“ und dann „Bild skalieren“. Alternativ können Sie mit der „rechen Maustaste“ auf das Bild klicken und im Kontextmenü erscheint ebenfalls der Menüpunkt „Bild“ mit dem Untermenüpunkt „Bild skalieren“. (Abbildung 3)

GIMP - Bild skalieren
Abbildung 3

1e) Es öffnet sich nun das Fenster „Bild skalieren“.
Zum Einstieg sind in diesem Fenster nur 4 Punkte wichtig. (Abbildung 4)

GIMP - Fotos verkleinern
Abbildung 4
  1. Das Kettenglied neben „Höhe“ und „Breite“ bedeutet, dass wenn Sie eine neue Breite eingeben, der automatische Wert der Höhe errechnet wird. Das funktioniert auch umgekehrt. So bleiben die Proportionen des Bildes erhalten. Sie können mit einem Klick auf das Kettenglied die Proportionssicherung aufheben und individuelle Höhen- und Breitenangaben verwenden. Bei Fotos empfehle ich Ihnen die Sicherung aktiv zu lassen.
  2. Hier können Sie die Maßeinheit einstellen. Ich persönlich verwende die Einstellung Pixel (px), da im Webdesignbereich die Maßeinheit als Standard gilt.
  3. Die X- und Y-Auflösung sind Angaben für die Punktdichte, die meistens in DPI (Dots Per Inch) vereinheitlicht sind. Für dieses Beispiel können Sie die Einstellung von 72 dpi behalten.
  4. In diesen zwei Eingabefeldern können Sie die Bildgröße „Höhe“ und „Breite“ eingeben. Wenn Sie die Maßwerte eingegeben haben, klicken Sie dann auf „Skalieren“.

WICHTIG! Falls Sie das Foto zu stark verkleinert haben:
Wenn Sie das Bild zu stark verkleinert haben, klicken Sie auf „Bearbeiten“ und dann „Rückgängig“ im Kontextmenü oder in der Menüleiste, um das Bild nach dem Schritt wieder erneut zu verkleinern. Tastenkombination: „Strg+Z“.

Vermeiden Sie, das verkleinerte Bild wieder zu vergrößern, da Sie sonst die Bildpunkte strecken. Das verursacht sehr starken Qualitätsverlust, Unschärfe und könnte das Bild zerstören, wie im folgenden Beispiel zu sehen ist: (Abbildung 5 und 6)

GIMP - Bild Originalgröße
Abbildung 5: Originalgröße
GIMP - Bild unscharf
Abbildung 6: Das Bild wurde verkleinert und
dann wieder vergrößert.



Nachdem Sie das Bild optimal verkleinert haben, muss das Bild neu geschärft werden, das im nachfolgenden Punkt 2 dieser Anleitung zum Foto verkleinern beschrieben wird.

2. Bild schärfen mit Gimp

Erst die Frage: Warum muss ein verkleinertes Bild geschärft werden?

Durch die Verkleinerung des Bildes, wird die Anzahl der Bildpunkte verringert. Folglich wird das Bild leicht verwaschen, bzw. die Kanten und Konturen unscharf, dass man mit Hilfe der Schärfefunktion wieder verbessern kann. So wird das ganze Bild wieder klar und deutlich dargestellt.

Im folgenden Beispiel habe ich ein Bild der Originalgröße von 867 x 554 Pixel auf 250 x 160 Pixel verkleinert. Sie sehen auf der linken Seite (Abbildung 7), das unscharfe Bild direkt nach der Bildverkleinerung und auf der rechten Seite (Abbildung 8) das geschärfte Bild.

GIMP - Bild unscharf
Abbildung 7: Bild unscharf
GIMP - Bild geschärft
Abbildung 8: Bild geschärft


2a) Um ein Bild zu schärfen, klicken Sie in der Menüleiste auf den Punkt „Filter“ und nachfolgend auf „Verbessern“ und „Schärfen …“ (Abbildung 9). Sie können dies ebenfalls im Kontextmenü durch Klick mit der „rechen Maustaste“ auf das Bild erreichen.

GIMP - Bild schärfen
Abbildung 9

2b) Nachdem sich das folgende Fenster „Schärfen“ geöffnet hat, stellen Sie mit dem Regler die passende Stärke des Filters ein und klicken Sie auf „OK“.

Achten Sie dabei in der Vorschau darauf, dass Sie nicht zu viel Schärfe anwenden, da sonst die Kanten des Bildes zu stark werden und die Operation misslingt. (Abbildung 10)

GIMP - Bild scharf machen
Abbildung 10

Hier gilt wieder, falls Sie das Bild zu stark geschärft haben, verwenden Sie die Tastenkombination „Strg+Z“, um den Schritt rückgängig zu machen und wiederholen Sie den Vorgang noch einmal, bis die passende Schärfe das richtige Ergebnis bringt.

3. Bild exportieren mit Gimp

Ein Bild exportiert man für zum Beispiel eine Webseite, damit diese schneller geladen werden kann, bzw. eine Bilddatei in einen webgerechten Dateityp umzuwandeln. Originalbilder die von einer Digitalkamera mit großer Auflösung erstellt wurden, haben ein großes Datenvolumen und kann ein paar Megabyte betragen.

Damit das Foto webgerecht komprimiert werden kann, wird es auf die ideale Größe skaliert und in ein passendes Format exportiert. Die gängigsten Standardformate für Internetseiten sind nachfolgend kurz erklärt:

  • JPEG: Passender Dateityp für Fotos. Die Fotoqualität wirkt sich auf die Dateigröße aus.
  • GIF: Für Vektorgrafiken mit begrenzter Farbtiefe, bis max. 256 Farben.
  • PNG: Für verlustfreie Rastergrafiken und unterstützt Transparenz via Alphakanal.

Ein großes Bild bzw. Foto sollte letztendlich unter 100 KByte sein. Abhängig ist dies auch von der skalierten Größe, dem exportierten Format und der Farbtiefe. Jedoch gilt, um so kleiner die Dateigröße ist, desto schneller ist das Ladeverhalten einer Webseite. Dabei sollte die Bildqualität nicht merkbar beeinflusst, jedoch ein Mittelmaß gefunden werden.

3a) Klicken Sie auf „Datei“ und „Exportieren …“ oder verwenden Sie die Tastenkombination „Umschalt+Strg+E“. (Abbildung 11)

GIMP - Bild exportieren
Abbildung 11

3b) Es öffnet sich das Fenster „Bild exportieren“. Wählen Sie aus, wohin Sie die Datei exportieren wollen und geben Sie hier das passende Format und den Dateinamen ein, wie im folgenden Bild zu sehen ist. (Abbildung 12) Hier verwende ich ich das Format JPG.

GIMP - Foto als JPG exportieren
Abbildung 12

3c) Es öffnet sich nun das Fenster „Bild exportieren als JPG“. Wenn Sie einen Haken bei „Vorschau im Bildfenster anzeigen“ setzen, sehen Sie die Qualität des Bildes, wie es exportiert wird. Somit wird auch gleichzeitig berechnet, wie hoch die Dateigröße wird. Sie können nun mit dem Schieberegler die Qualität anpassen. (Abbildung 13)

GIMP - Bild exportieren als JPG
Abbildung 13

3d) Wenn Sie die Einstellung abgeschlossen haben, klicken Sie auf „Exportieren“ und das Bild wird komprimiert und in das gewünschte Format exportiert.

4. Schlusswort zur Fotobearbeitung

Mit dieser Anleitung zur Fotobearbeitung möchte ich Anfängern helfen, wie sie mit einem kostenlosen und guten Bildbearbeitungsprogramm Fotos skalieren, schärfen und exportieren können. Das Tutorial soll auch als Einstieg in die professionelle Bildbearbeitung dienen, um sich mehr mit dem Thema vertraut zu machen.

Vielen Dank!

Andreas Blomenhofer

14 Antworten zu “Tutorial – Fotobearbeitung mit Gimp”

  1. Super Anleitung! Danke. Ich habe mir GIMP auch kürzlich auf einem Laptop installiert und bin begeistert :-)
    Stefan von
    Webdesign München

  2. Es gibt noch andere Möglichkeiten ein Bild mit Gimp zu schärfen, aber die genannte ist wohl die einfachste und schnellste. Eine treffliche Anleitung.

    Jörg von jayes webdesign

  3. Danke für die tolle Anleitung. Hat mit sehr geholfen :-)

    Sylvia
    von http://www.nof-community.de

  4. Webdesign A.Jendrysik sagt:

    Tolles Tut macht weiter so… SG aus Kassel

  5. Webdesign Bitskin sagt:

    Schönes Einsteiger Tutorial. Du hast bestimmt vielen Anfängern damit geholfen

  6. Webdesign Jens sagt:

    Gut auf den Punkt gebracht!… Das sind definitiv Basics die man öfter braucht.

  7. Prima Tutorial!
    Es müssen tatsächlich nicht immer nur die hochpreisigen Produkte sein, mit denen man profressionelle Arbeiten herstellen kann.

    Würde mir darüberhinaus noch ein Tutorial zum Zuschneiden von Bildern wünschen. Da kann Gimp meines Erachtens nicht so punkten. Vielleicht gibt es da aber noch ein paar versteckte Funktionen die einem den Arbeitsalltag erleichtern können?

  8. Webdesign Willi Nopper sagt:

    Hallo Andreas.

    Das ist ein sehr gutes Tutorial wie ich finde. Es ist toll, dass es noch Menschen gibt, die ihr Fachwissen der Allgemeinheit zur Verfügung stellen. Danke dafür.

    Beste Grüße,
    Willi

  9. Sehr gutes Tutorial und sehr ausführlich!

    Grüße Jens

  10. Webdesign Marcel sagt:

    Hallo Andreas,
    danke für die tollen Tipps. Ich benutze Gimp schon lange, aber erst jetzt hab ich ein paar mehr Funktionen benötigt. Bin dann bei der Google Recherche auf deinen Artikel gestoßen. Hat mir sehr geholfen, danke!

  11. Webdesign Thomas sagt:

    Schönes Einsteiger Tutorial. Gute nützliche Tipps. Danke dafür.

    Grüße Thomas

  12. Webdesign Antje sagt:

    Danke!
    Muss mich in GIMP neu einarbeiten. Das war genau das, was ich wissen wollte.
    Gruß
    Antje

  13. Webdesign Christine sagt:

    endlich mal eine kurze verständliche Erklärung! Allerbesten Dank! Ich wünschte, es gäbe dies noch zu weiteren Bildbearbeitungs-Themen mit GIMP!
    LG, Christine

  14. Webdesign CrazyCuts sagt:

    Hallo Andreas,

    vielen Dank für dieses übersichtliche und verständliche Tutorial. Viele meiner Kunden suchen ein kostenloses Tool, um zum Beispiel Fotos fürs Weblog oder die Webseite zurecht zu schneiden. GIMP scheint da wirklich eine perfekte Alternative zum teuren Photoshop zu sein. Werde GIMP und dieses Tutorial sehr gerne weiterempfehlen!

Hinterlasse eine Antwort