WebImage-Pro
Plugin für Adobe Photoshop

Aus einem Bild werden alle Web-Größen – mit fertigem Code.

WebImage-Pro speichert deine Bilder in mehreren Breiten als WebP und liefert den passenden <img srcset>-HTML-Code gleich mit. Ein Klick statt zehn Arbeitsschritte.

Im Adobe Marketplace ansehen Handbuch als PDF

Demnächst im Adobe Marketplace · läuft komplett lokal · Photoshop 24.0 (2023) oder neuer

  • Original bleibt unverändert
  • Nichts wird hochskaliert
  • Keine Daten verlassen deinen Rechner
  • Deutsch & Englisch, dunkel & hell

Die Fleißarbeit, die niemand gern macht

Responsive Bilder brauchen mehrere Größen – und für jede Größe Skalieren, Speichern, Benennen und Einbinden. Das Plugin erledigt genau das.

Ohne das Plugin

  1. Bild duplizieren
  2. Größe ändern
  3. „Für Web speichern“ als WebP
  4. Datei benennen – für jede Breite
  5. Alles wiederholen (4–6 Mal pro Bild)
  6. srcset-Attribut von Hand schreiben

Mit WebImage-Pro

Breiten eintragen → Export starten.

Alle Dateien sind sauber benannt und im Zielordner, der fertige Code liegt in der Zwischenablage – bei Bedarf zusätzlich als HTML-Datei mit Vorschau. Für ein Bild oder für hundert.

Alles, was du für responsive WebP-Bilder brauchst

Bewusst fokussiert: wenige, gut durchdachte Funktionen für einen schnellen Workflow.

Mehrere Breiten in einem Rutsch

Beliebige Breiten wie 400, 800, 1200 px – für jede entsteht eine WebP-Datei. Zu große Breiten werden übersprungen, nichts wird hochskaliert.

Fertiger srcset-Code

srcset, sizes und src werden für dich gebaut – mit Vorschau im Panel und automatisch in der Zwischenablage.

Einzelbild oder Batch

Aktuelles Dokument oder ganze Dateilisten (JPG, PNG, TIFF, PSD, PSB, BMP, GIF) mit denselben Einstellungen – wahlweise fortlaufend nummeriert.

Eigene HTML-Vorlage

Bildpfad, sizes-Angabe und Vorlage frei anpassbar – z. B. mit alt, loading="lazy" oder eigener Klasse.

Presets & Projekte

Breiten-Presets für Standardfälle und Projekt-Presets, die alle Einstellungen samt Zielordner pro Kunde speichern.

Qualität nach Maß

Lossy mit Regler von 0 bis 100 oder Lossless. Transparenz lässt sich erhalten.

Gesammelte Batch-HTML

Alle Codes eines Batches in einer Datei – frei benannt, über mehrere Läufe ergänzbar oder jedes Mal neu.

Sicher gearbeitet

Arbeitet auf Kopien, fragt vor dem Überschreiben, zeigt Fortschritt und lässt sich jederzeit abbrechen.

Dein Look, deine Sprache

Automatisches, dunkles oder helles Farbschema. Oberfläche auf Deutsch und Englisch.

So geht’s in drei Schritten

Vom geöffneten Bild zum fertigen Code – ohne Umwege.

1

Bild wählen

Dokument in Photoshop öffnen – oder im Batch-Modus Dateien hinzufügen.

Panel im Einzelbild-Modus mit Basisname
2

Größen & Qualität

Breiten eintragen, Qualität einstellen, HTML-Optionen prüfen – oder ein Preset wählen.

Reiter Größen mit Breiten-Preset und Breitenliste
3

Export starten

Ein Klick: Dateien im Zielordner, Code in der Zwischenablage, Zusammenfassung im Panel.

Ergebnisbereich mit Liste der gespeicherten Dateien

Sauberer Code, den du direkt einfügen kannst

Der Browser wählt aus srcset automatisch die passende Bildgröße für Bildschirmbreite und Pixeldichte. Besucher auf dem Smartphone laden kein Desktop-Bild – das spart Datenvolumen und verkürzt Ladezeiten.

  • Bildpfad-Präfix, z. B. images/
  • sizes-Angabe, z. B. 100vw oder 50vw
  • Eigene Vorlage mit Platzhaltern {srcset}, {sizes}, {src}
<img srcset="hero-400.webp 400w,
        hero-800.webp 800w,
        hero-1200.webp 1200w"
     sizes="100vw"
     src="hero-1200.webp">
Batch-Modus mit Dateiliste Projekt-Preset speichern

Hundert Bilder? Derselbe Klick.

Im Batch-Modus verarbeitest du beliebig viele Dateien mit denselben Einstellungen – auf Wunsch fortlaufend nummeriert. Und wer für mehrere Kunden arbeitet, speichert alles als Projekt-Preset: Breiten, Qualität, HTML-Optionen, Dateinamen-Muster und sogar den Zielordner.

  • Dateiliste per Dialog hinzufügen, einzeln entfernen oder leeren
  • Fortlaufende Nummerierung mit Basisname und Startnummer
  • Gesammelte Batch-HTML mit frei wählbarem Namen
  • Projekt-Presets mit einem Klick laden

Fühlt sich an wie Photoshop

Das Panel passt sich deinem Photoshop-Farbschema an – oder du wählst Dunkel bzw. Hell selbst. Die Oberfläche gibt es auf Deutsch und Englisch, alle Einstellungen findest du hinter dem Zahnrad.

Panel im hellen Farbschema Einstellungen: Farbschema, Sprache, Unterstützung, Zurücksetzen

Für alle, die Bilder ins Web bringen

Webdesigner:innenFotograf:innenEntwickler:innen AgenturenShop-Betreiber:innenBlogger:innen & Redaktionen

Häufige Fragen

Was kostet das Plugin?

Der Preis wird zum Marktstart im Adobe Marketplace bekanntgegeben. WebImage-Pro erscheint in Kürze.

Welche Photoshop-Version brauche ich?

Photoshop 24.0 (2023) oder neuer. Das Plugin läuft als Panel (UXP) und wird über den Adobe Marketplace erworben und über die Creative Cloud Desktop-App installiert.

Werden meine Originaldateien verändert?

Nein. Das Plugin arbeitet auf Kopien; Batch-Dateien werden geöffnet und ohne Speichern wieder geschlossen. Vor dem Überschreiben vorhandener Exportdateien wirst du gefragt.

Werden Bilder hochskaliert?

Nie. Breiten, die größer als das Original sind, werden übersprungen – im Panel siehst du einen Hinweis dazu.

Welche Dateien kann ich im Batch verarbeiten?

JPG/JPEG, PNG, TIFF, PSD, PSB, BMP und GIF. Dokumente müssen im RGB-Modus vorliegen; andere Farbmodi werden übersprungen und im Ergebnis gemeldet.

Gehen Daten an einen Server?

Nein. Das Plugin arbeitet lokal und überträgt keine Bilder oder Einstellungen. Es benötigt Dateizugriff (für deinen Zielordner), die Zwischenablage (für den Code) und das Öffnen von Dateien/Links im Browser.

Kann ich den HTML-Code anpassen?

Ja: Bildpfad-Präfix, sizes-Angabe und eine frei editierbare Vorlage mit den Platzhaltern {srcset}, {sizes} und {src}. Mit „Standardvorlage wiederherstellen“ setzt du sie jederzeit zurück.

Gibt es eine Anleitung?

Ja – ein ausführliches Handbuch mit Screenshots als PDF: Handbuch herunterladen. Es gibt auch eine englische Ausgabe.

Bald verfügbar

Demnächst im Adobe Marketplace

WebImage-Pro steht kurz vor der Veröffentlichung. Alle Funktionen sind fertig: Einzelbild- und Batch-Export, Presets, HTML-Vorlagen, Batch-HTML, Farbschema und zwei Sprachen.

Photoshop 24.0 (2023) oder neuer · Installation über die Creative Cloud Desktop-App

Bereit für schnellere Bilder?

Installiere WebImage-Pro und spare dir ab dem ersten Export die Handarbeit.

Im Adobe Marketplace ansehen Handbuch als PDF