Photoshop Slices: Bilder einfach exportieren

In der Welt der digitalen Bildbearbeitung und des Webdesigns stehen wir oft vor der Herausforderung, große oder komplexe Bilder in kleinere, leichter handhabbare Teile zu zerlegen. Sei es, um spezifische Bildbereiche für die separate Verwendung zu extrahieren, Elemente für eine Website vorzubereiten oder einfach die Dateigröße zu reduzieren. Während Werkzeuge wie das Freistellungswerkzeug oder das Lasso nützlich sind, gibt es eine elegantere und leistungsfähigere Methode: das Slice-Werkzeug in Adobe Photoshop. Dieses oft übersehene Werkzeug ermöglicht es Ihnen, ein Bild in mehrere Slices (Scheiben oder Teile) zu unterteilen und diese dann separat oder gemeinsam zu exportieren. Dieser Artikel führt Sie durch die Nutzung des Slice-Werkzeugs, von der Erstellung bis zum Export.

Was sind Slices und warum sind sie nützlich?

Stellen Sie sich vor, Sie haben ein großes Bild – vielleicht ein Layout für eine Website, eine Infografik oder eine komplexe Illustration. Sie müssen einzelne Elemente daraus extrahieren: einen Button, ein Logo, einen bestimmten Textblock oder einen Bildausschnitt. Das manuelle Freistellen und Speichern jedes einzelnen Elements wäre mühsam und zeitaufwändig. Hier kommen Slices ins Spiel.

Slices teilen Ihr Bild virtuell in rechteckige Bereiche auf. Diese Bereiche können unterschiedlich groß sein und sich an den Inhalten Ihres Bildes orientieren. Der Clou ist, dass Sie jede dieser Slices als separate Bilddatei exportieren können. Dies ist besonders wertvoll für:

• Webdesign: Zerlegen von Layouts in einzelne Bildelemente (Header, Navigation, Footer, Inhaltsblöcke) zur einfacheren Integration in HTML und CSS.
• E-Mail-Marketing: Erstellen von E-Mail-Bannern, die in einzelne, klickbare Bildteile zerlegt werden müssen.
• Große Grafiken: Aufteilen komplexer Bilder zur besseren Verwaltung oder zur Optimierung der Ladezeit im Web.
• Extraktion spezifischer Elemente: Schnelles Speichern von Logos, Icons oder anderen Bildelementen aus einer Gesamtgrafik.

Durch die Verwendung von Slices behalten Sie die Übersicht über Ihr Gesamtbild, während Sie gleichzeitig die Flexibilität haben, mit den einzelnen Teilen zu arbeiten und diese gezielt zu exportieren.

Das Slice-Werkzeug finden: Manchmal versteckt, aber immer da

Das Slice-Werkzeug gehört nicht zu den Werkzeugen, die man sofort im Hauptbereich der Werkzeugleiste findet. Es teilt sich einen Platz mit dem Freistellungswerkzeug (Crop Tool).

Um das Slice-Werkzeug zu aktivieren, haben Sie zwei Hauptoptionen:

1. Über die Werkzeugleiste: Klicken Sie mit der rechten Maustaste (oder halten Sie die Maustaste gedrückt) auf das Symbol des Freistellungswerkzeugs (das meist standardmäßig sichtbar ist). Ein kleines Menü öffnet sich. Wählen Sie aus dieser Liste das Slice-Werkzeug aus.
2. Über den Tastaturbefehl: Der Tastaturbefehl für das Freistellungs- und das Slice-Werkzeug ist 'C'. Drücken Sie einmal 'C', um das Freistellungswerkzeug auszuwählen. Drücken Sie es möglicherweise ein zweites Mal (abhängig von Ihrer Photoshop-Konfiguration), um zum Slice-Werkzeug zu wechseln. Behalten Sie die Werkzeugleiste im Auge, um zu sehen, welches Werkzeug gerade aktiv ist.

Sobald das Slice-Werkzeug ausgewählt ist, ändert sich Ihr Mauszeiger, und Sie können mit der Erstellung Ihrer Slices beginnen.

Bilder slicen: Verschiedene Methoden

Bevor Sie mit dem Slicing beginnen, ist es ratsam, Ihre Ebene zu duplizieren (Rechtsklick auf die Ebene im Ebenen-Bedienfeld > Ebene duplizieren oder Tastenkombination Strg/Cmd + J), um die Originaldatei unverändert zu lassen. Photoshop bietet verschiedene Möglichkeiten, Slices zu erstellen:

1. Manuelles Slicing (Benutzer-Slices)

Dies ist die direkteste Methode. Wählen Sie das Slice-Werkzeug. Stellen Sie in der Optionsleiste oben sicher, dass unter "Stil" die Option "Normal" ausgewählt ist. Nun können Sie mit der Maus rechteckige Bereiche auf Ihrem Bild aufziehen. Jeder Bereich, den Sie auf diese Weise definieren, wird zu einer Benutzer-Slice. Diese Slices sind an einem blauen Symbol in der oberen linken Ecke erkennbar und haben eine blaue Umrandung, wenn sie ausgewählt sind.

Während Sie Benutzer-Slices erstellen, füllt Photoshop automatisch die verbleibenden Bereiche des Bildes mit sogenannten Auto-Slices. Diese sind grau markiert und stellen die Teile des Bildes dar, die nicht explizit als Benutzer-Slice definiert wurden. Wenn Sie eine Benutzer-Slice verschieben oder ihre Größe ändern, passt Photoshop die Auto-Slices entsprechend an.

Jede Slice (sowohl Benutzer- als auch Auto-Slices) erhält eine Nummer, die in der oberen linken Ecke angezeigt wird. Dies hilft Ihnen, die Slices zu identifizieren und zu organisieren. Wenn Sie die Slice-Nummern nicht sehen, müssen Sie möglicherweise eine Einstellung in Photoshop aktivieren (manchmal über ein Skript oder die Voreinstellungen).

2. Slicing basierend auf Ebenen

Wenn Ihr Bild bereits in verschiedenen Ebenen strukturiert ist, können Sie Slices direkt aus diesen Ebenen erstellen. Dies ist ideal, wenn jedes exportierbare Element bereits auf einer eigenen Ebene liegt.

Gehen Sie wie folgt vor:

1. Wählen Sie die Ebene im Ebenen-Bedienfeld aus, aus der Sie eine Slice erstellen möchten.
2. Gehen Sie in der Menüleiste auf Ebene > Neu > Ebenebasierte Slice.

Photoshop erstellt nun automatisch eine Benutzer-Slice, die genau den Begrenzungen des Inhalts auf der ausgewählten Ebene entspricht. Sie erkennen dies daran, dass die Ebene nun mit einer blauen Linie und einem blauen Slice-Symbol verbunden ist. Wiederholen Sie diesen Schritt für jede Ebene, die Sie als separate Slice exportieren möchten.

3. Slices teilen (Gleichmäßige Unterteilung)

Manchmal möchten Sie ein Bild einfach in eine gleichmäßige Anzahl von Zeilen und Spalten unterteilen. Das Slice-Werkzeug bietet auch dafür eine Funktion.

1. Wählen Sie das Slice-Werkzeug.
2. Klicken Sie mit der rechten Maustaste irgendwo auf das Bild.
3. Wählen Sie im Kontextmenü die Option Slice teilen....
4. Im Dialogfenster können Sie festlegen, ob Sie horizontal, vertikal oder beides teilen möchten. Geben Sie die gewünschte Anzahl von Zeilen (horizontal) und Spalten (vertikal) ein.
5. Bestätigen Sie mit "OK".

Photoshop erstellt nun eine Reihe von Slices, die das Bild gleichmäßig aufteilen. Diese Methode eignet sich gut für die Erstellung von Bildergalerien oder wenn Sie ein Bild in einem Rasterlayout darstellen möchten.

4. Slices mit fester Größe oder festem Seitenverhältnis erstellen

In der Optionsleiste des Slice-Werkzeugs finden Sie unter "Stil" weitere Optionen:

• Festes Seitenverhältnis: Wählen Sie diese Option und geben Sie ein Breite-zu-Höhe-Verhältnis ein (z. B. 3 für Breite und 4 für Höhe). Jede Slice, die Sie nun manuell aufziehen, wird dieses Seitenverhältnis beibehalten.
• Feste Größe: Wählen Sie diese Option und geben Sie die gewünschte Breite und Höhe in Pixeln ein (z. B. 2500 px Breite und 2500 px Höhe). Wenn Sie nun irgendwo ins Bild klicken, erstellt Photoshop eine Slice mit dieser exakten Größe, beginnend an der Klickposition.

Diese Optionen bieten zusätzliche Kontrolle, wenn Sie Slices für spezifische Abmessungen oder Verhältnisse benötigen.

Slices auswählen und bearbeiten: Das Slice-Auswahl-Werkzeug

Nachdem Sie Slices erstellt haben, müssen Sie diese möglicherweise anpassen, löschen oder auswählen. Hierfür gibt es das Slice-Auswahl-Werkzeug. Es teilt sich ebenfalls den Platz mit dem Slice-Werkzeug (Taste 'C'). Drücken Sie 'C' gegebenenfalls erneut, um zum Auswahlwerkzeug zu wechseln, oder klicken Sie mit der rechten Maustaste auf das Slice-Werkzeug-Symbol und wählen Sie das Auswahl-Werkzeug aus.

Mit dem Slice-Auswahl-Werkzeug können Sie:

• Einzelne Slices auswählen: Klicken Sie einfach auf eine Slice. Sie wird blau umrandet.
• Mehrere Slices auswählen: Klicken Sie auf die erste Slice, halten Sie dann die Shift-Taste gedrückt und klicken Sie auf weitere Slices. Alle ausgewählten Slices bleiben hervorgehoben.
• Größe und Position ändern: Wählen Sie eine Benutzer-Slice aus. Sie sehen Anfasser an den Rändern und Ecken. Klicken und ziehen Sie diese Anfasser, um die Größe zu ändern, oder klicken und ziehen Sie innerhalb der Slice, um sie zu verschieben. Die Auto-Slices passen sich dynamisch an.
• Slices ausrichten: Wenn mehrere Slices ausgewählt sind, können Sie die Ausrichtungsoptionen in der Optionsleiste nutzen, um sie zueinander auszurichten.
• Informationen bearbeiten: Doppelklicken Sie auf eine Slice, um ein Dialogfenster zu öffnen, in dem Sie z. B. einen Namen oder eine URL (für Web-Slices) eingeben können.

Slices entfernen: Aufräumen

Wenn Sie eine Slice nicht mehr benötigen, können Sie sie ganz einfach löschen. Verwenden Sie das Slice-Auswahl-Werkzeug.

• Einzelne oder mehrere Slices entfernen: Wählen Sie die Slice(s) mit dem Slice-Auswahl-Werkzeug aus (Shift + Klick für mehrere). Drücken Sie dann die Entf- oder Rücktaste auf Ihrer Tastatur.
• Alle Slices entfernen: Drücken Sie Strg/Cmd + Shift, um alle Slices auszuwählen. Drücken Sie dann die Entf- oder Rücktaste. Das Bild wird wieder zu einer einzigen, ungeslicten Einheit (obwohl die ursprüngliche Ebene, falls dupliziert, erhalten bleibt).

Das Entfernen von Slices ist nützlich, um Fehler zu korrigieren oder wenn Sie sich für eine andere Aufteilung entscheiden.

Slices speichern und exportieren: Der entscheidende Schritt

Nachdem Sie Ihre Slices perfekt eingerichtet haben, ist der Export der wichtigste Schritt, um die einzelnen Bilddateien zu erhalten. Der gängigste Weg dafür ist die Funktion "Für Web speichern (Legacy)".

Exportieren über "Für Web speichern (Legacy)"

Gehen Sie in der Menüleiste zu Datei > Exportieren > Für Web speichern (Legacy).... Ein neues Dialogfenster öffnet sich, das eine Vorschau Ihres Bildes mit den definierten Slices zeigt.

Im "Für Web speichern"-Fenster können Sie verschiedene Einstellungen für das Exportformat (JPEG, PNG, GIF) und die Qualität vornehmen. Wichtiger für das Slicing sind jedoch die Optionen beim Speichern.

Einzelne Slices separat exportieren

Um nur eine bestimmte Slice zu exportieren:

1. Klicken Sie im "Für Web speichern"-Fenster auf die Slice, die Sie exportieren möchten. Sie wird hervorgehoben.
2. Klicken Sie auf die Schaltfläche Speichern....
3. Ein neues Fenster namens "Optimiert speichern unter" erscheint.
4. Geben Sie den gewünschten Dateinamen ein.
5. Wählen Sie unter "Format" die Option Nur Bilder.
6. Wählen Sie unter "Slices" die Option Alle Benutzer-Slices. (Obwohl Sie nur eine ausgewählt haben, wird diese Methode oft verwendet, um nur die manuell erstellten Slices zu speichern. Wenn Sie nur die eine *hervorgehobene* Slice speichern möchten, stellen Sie sicher, dass dies in den Optionen möglich ist, standardmäßig speichert "Alle Benutzer-Slices" alle blauen Slices.) *Hinweis:* Die Option "Ausgewählte Slices" ist primär für den Export mehrerer ausgewählter Slices gedacht, funktioniert aber auch für eine einzelne ausgewählte Slice.
7. Klicken Sie auf Speichern.

Photoshop erstellt einen Ordner (standardmäßig "images" im Zielverzeichnis), in dem die exportierte Slice als separate Bilddatei gespeichert wird. Die Benennung folgt oft einem Muster wie [Dateiname]_[Slice-Nummer].

Mehrere Slices gleichzeitig exportieren

Um mehr als eine Slice auf einmal zu exportieren:

1. Öffnen Sie das "Für Web speichern"-Fenster (Datei > Exportieren > Für Web speichern (Legacy)...).
2. Klicken Sie auf die erste Slice, die Sie exportieren möchten.
3. Halten Sie die Shift-Taste gedrückt und klicken Sie auf weitere Slices, die Sie exportieren möchten. Alle ausgewählten Slices werden hervorgehoben.
4. Klicken Sie auf die Schaltfläche Speichern....
5. Im Fenster "Optimiert speichern unter" geben Sie einen Dateinamen (dies ist oft ein Präfix für die einzelnen Dateien, z. B. "Exportierte_Bilder").
6. Wählen Sie unter "Format" die Option Nur Bilder.
7. Wählen Sie unter "Slices" die Option Ausgewählte Slices.
8. Klicken Sie auf Speichern.

Photoshop exportiert nun alle hervorgehobenen Slices als separate Bilddateien in einen Ordner. Die Dateinamen basieren auf dem von Ihnen angegebenen Präfix und der Slice-Nummer (z. B. Exportierte_Bilder_01.jpg, Exportierte_Bilder_05.png etc.).

Es ist wichtig zu beachten, dass Sie beim Exportieren über "Für Web speichern" auch HTML-Dateien generieren lassen können, die das Bild mit den Slices und Links neu zusammensetzen. Für die meisten Anwendungsfälle, bei denen Sie nur die einzelnen Bildteile benötigen (z. B. für Web-Assets), ist die Option "Nur Bilder" jedoch die richtige Wahl.

Slices für spätere Bearbeitung speichern (PSD)

Wenn Sie die Slices, die Sie erstellt haben, zu einem späteren Zeitpunkt erneut bearbeiten oder exportieren möchten, stellen Sie sicher, dass Sie Ihre Photoshop-Datei im nativen PSD-Format speichern (Datei > Speichern unter...). Das PSD-Format speichert alle Ebenen, Masken, Einstellungen und auch die Informationen über die von Ihnen erstellten Slices. Wenn Sie die PSD-Datei später wieder öffnen und das Slice-Werkzeug aktivieren, sind Ihre Slices noch vorhanden und können bearbeitet werden.

Slices drucken

Obwohl Slices hauptsächlich für den digitalen Export gedacht sind, können Sie sie auch drucken. Der Prozess ist ähnlich wie beim Exportieren:

1. Stellen Sie sicher, dass Ihre Slices definiert sind.
2. Wählen Sie alle Slices aus, die Sie drucken möchten (Strg/Cmd + Shift, um alle auszuwählen, oder Shift + Klick für spezifische).
3. Gehen Sie zu Datei > Drucken... (Strg/Cmd + P).
4. Im Druckdialogfenster können Sie die Druckeinstellungen anpassen. Photoshop behandelt die Slices als separate Bereiche, die gedruckt werden können.

Beachten Sie, dass der Druck von Slices weniger gängig ist als der digitale Export und die Ergebnisse je nach Druckereinstellungen variieren können.

Zusammenfassung

Das Slice-Werkzeug in Photoshop ist ein mächtiges, wenn auch manchmal verstecktes Werkzeug für die präzise Aufteilung und den gezielten Export von Bildbereichen. Es ist unverzichtbar für Webdesigner und jeden, der mit komplexen Layouts arbeitet oder spezifische Teile eines Bildes isolieren muss. Vom manuellen Erstellen über das Slicing basierend auf Ebenen bis hin zum gleichmäßigen Teilen bietet es Flexibilität für verschiedene Anforderungen.

Der Export über "Für Web speichern (Legacy)" ist der Standardweg, um Slices als separate Bilddateien zu erhalten, sei es einzeln oder mehrere gleichzeitig. Durch das Üben dieser Schritte werden Sie schnell in der Lage sein, Slices effizient in Ihren Workflow zu integrieren und Ihre Arbeit mit großen Bildern oder Layouts erheblich zu erleichtern.

Nutzen Sie das Slice-Werkzeug, um Ihre Bilder effektiv zu zerlegen und nur die benötigten Teile zu exportieren. Es spart Zeit und hilft Ihnen, organisierter zu arbeiten, egal ob Sie Produktfotograf, Porträtfotograf oder Webdesigner sind. Die Fähigkeit, präzise Bildausschnitte zu speichern, ist eine wertvolle Fertigkeit in der digitalen Bildbearbeitung.

Häufig gestellte Fragen (FAQs)

Kann ich eine Slice mit einem festen Seitenverhältnis erstellen?

Ja, absolut. Wählen Sie das Slice-Werkzeug. Gehen Sie in der Optionsleiste zum Dropdown-Menü "Stil" und wählen Sie "Festes Seitenverhältnis". Geben Sie dann das gewünschte Verhältnis für Breite und Höhe ein. Jede Slice, die Sie nun aufziehen, wird dieses Verhältnis beibehalten.

Ist es möglich, Slices mit einer festen Pixelgröße zu erstellen?

Ja, das geht ebenfalls. Wählen Sie das Slice-Werkzeug, gehen Sie zu "Stil" und wählen Sie "Feste Größe". Geben Sie die gewünschte Breite und Höhe in Pixeln ein. Wenn Sie dann ins Bild klicken, erstellt Photoshop eine Slice mit genau diesen Abmessungen an der Stelle, wo Sie geklickt haben.

Wie teile ich ein Bild gleichmäßig in Zeilen und Spalten auf?

Wählen Sie das Slice-Werkzeug. Klicken Sie mit der rechten Maustaste auf das Bild und wählen Sie "Slice teilen...". Im Dialogfenster können Sie festlegen, wie viele Slices Sie horizontal und vertikal haben möchten. Geben Sie die gewünschten Zahlen ein und bestätigen Sie mit "OK". Photoshop erstellt dann eine gleichmäßige Rasteraufteilung Ihres Bildes.

Werden Auto-Slices beim Export immer mitgespeichert?

Nein, nicht unbedingt. Wenn Sie beim Speichern über "Für Web speichern" die Option "Slices: Alle Benutzer-Slices" wählen, werden nur die von Ihnen manuell erstellten Slices (die blauen) exportiert. Wenn Sie "Slices: Alle Slices" wählen, werden sowohl Benutzer- als auch Auto-Slices exportiert. Dies ist nützlich, wenn Sie das gesamte Bild in alle seine Slices zerlegt haben möchten, auch die automatisch generierten Bereiche.

Wie kann ich eine Slice nachträglich bearbeiten?

Verwenden Sie das Slice-Auswahl-Werkzeug (Taste 'C', ggf. mehrmals drücken, oder Rechtsklick auf das Slice-Werkzeug-Symbol). Wählen Sie die Slice aus, indem Sie darauf klicken. Sie können dann ihre Größe und Position mit den Anfassen anpassen. Doppelklicken Sie auf die Slice, um erweiterte Optionen (Name, URL etc.) zu bearbeiten.

Hat dich der Artikel Photoshop Slices: Bilder einfach exportieren interessiert? Schau auch in die Kategorie Fotografie rein – dort findest du mehr ähnliche Inhalte!