Screenshots sind keine Fotos — die Grundregel
Fast alles, was über Foto-Optimierung geschrieben wird, ist für Screenshots falsch. Ein Foto besteht aus weichen Verläufen und Rauschen; ein Screenshot aus harten Kanten, einfarbigen Flächen und vor allem: Text. JPG — für Fotos ideal — zerlegt Bilder in 8×8-Blöcke und verwirft hohe Frequenzen. Genau diese hohen Frequenzen sind aber die Buchstaben-Kanten eines Screenshots. Das Resultat kennt jeder: matschige, von grauen Geister-Rändern umgebene Schrift.
Deshalb Regel Nummer eins: Screenshots mit Text niemals als JPG speichern. Die richtigen Formate sind PNG oder WebP-Lossless — beide verlustfrei, beide mit perfekter Text-Schärfe.
Format-Entscheidung in 10 Sekunden
| Screenshot-Typ | Bestes Format | Warum |
|---|---|---|
| UI, Code, Tabellen, Chats | PNG (oder WebP-Lossless) | Verlustfrei, Text bleibt scharf |
| Screenshot mit großem Foto-Anteil (z. B. YouTube-Standbild) | JPG Q85 oder WebP-Lossy | Foto-Anteil dominiert, verlustfrei wäre riesig |
| Screenshot für Web-Doku/Blog | WebP-Lossless | 20–40 % kleiner als PNG, überall unterstützt |
| Screenshot für E-Mail/Ticket-System | PNG | Maximale Kompatibilität, kein Empfänger-Risiko |
Das Retina-Problem: 5120 Pixel für ein Dialogfenster
Moderne Displays rendern mit doppelter oder dreifacher Pixel-Dichte. Ein Vollbild-Screenshot eines 27-Zoll-Retina-Macs ist 5120 × 2880 Pixel groß — für ein Support-Ticket oder eine Doku-Seite absurd überdimensioniert. Drei Wege damit umzugehen:
- Nur den relevanten Ausschnitt aufnehmen. macOS: Cmd+Shift+4 und Bereich aufziehen. Windows: Win+Shift+S. Das spart den Nachbearbeitungs-Schritt komplett.
- Nachträglich zuschneiden. Wer schon ein Vollbild hat: mit dem Zuschneide-Tool auf den relevanten Bereich reduzieren. Weniger Pixel = kleinere Datei = schnellerer Blick des Lesers aufs Wesentliche.
- Für Web-Doku auf 50 % skalieren — aber nur dort. Ein Retina-Screenshot bei halber Anzeige-Größe eingebunden bleibt gestochen scharf. Wer Speicher sparen muss, skaliert auf die tatsächliche Anzeige-Breite (typisch 1200–1600 px) mit dem Skalier-Tool. Für Text-Screenshots gilt: lieber großzügig bleiben, Text-Schärfe schlägt Datei-Größe.
PNG nachträglich verkleinern — ohne Pixel zu ändern
System-Screenshots sind erstaunlich schlecht komprimiert: die Betriebssysteme schreiben schnelle, aber ineffiziente PNGs. Eine verlustfreie Nach-Optimierung — bessere Filter-Wahl, aufgeräumte Chunks, gegebenenfalls Palette-Reduktion — spart bei typischen UI-Screenshots 30 bis 60 Prozent, ohne dass sich ein einziger Pixel ändert. Genau das macht unser PNG-Optimierer browser-lokal. Bei Screenshots mit wenigen Farben (Terminal, Code-Editor mit dunklem Theme) sind sogar 70 % drin, weil sich die Farbtabelle auf eine indizierte Palette reduzieren lässt.
Sensible Inhalte: schwärzen statt verwischen
Screenshots aus dem Arbeitsalltag zeigen oft mehr als beabsichtigt: E-Mail-Adressen in der Menüleiste, Kundennamen in Tabs, Tokens in URLs. Zwei Sicherheits-Regeln:
- Deckend übermalen, nicht verpixeln oder blurren. Verpixelte und geblurrte Texte sind mit heutigen Rekonstruktions-Werkzeugen teilweise wiederherstellbar — besonders bei bekannter Schriftart. Ein volldeckendes schwarzes Rechteck ist nicht rekonstruierbar.
- Im Pixel-Format schwärzen, nie im PDF-Layer. Ein schwarzes Rechteck, das in einem PDF-Editor über den Text gelegt wird, lässt sich entfernen — der Text darunter bleibt in der Datei. Erst schwärzen, dann exportieren.
Zusätzlich lohnt der Blick auf Metadaten: manche Screenshot-Tools schreiben Gerätename und Benutzerkonto in die Datei. Kontrolle und Bereinigung übernimmt der Metadaten-Editor.
Rezepte für die drei häufigsten Fälle
Support-Ticket / Bug-Report
Ausschnitt statt Vollbild, PNG, relevante Stelle gegebenenfalls mit Pfeil oder Rahmen markiert. Datei unter 500 KB halten — manche Ticket-Systeme (Jira, Zendesk-Konfigurationen) haben knappe Limits.
Software-Dokumentation / Blog-Beitrag
WebP-Lossless für die Web-Auslieferung, PNG als Master behalten. Einheitliche Breite über alle Screenshots des Dokuments (z. B. immer 1400 px) wirkt professionell. Alt-Text nicht vergessen — was auf dem Screenshot zu sehen ist, gehört in Textform dazu (siehe Barrierefreiheits-Beitrag).
Social Media / Messenger
Hier re-komprimiert die Plattform ohnehin. PNG hochladen (X/Twitter überträgt PNGs unter 5 MB unverändert — gut für Text-Screenshots), bei WhatsApp den Dokument-Versand nutzen, wenn Lesbarkeit zählt.
Was du dir sparen kannst
Zwei verbreitete Praktiken bringen bei Screenshots nichts: JPG mit Qualität 100 (immer noch verlustbehaftet, aber fast so groß wie PNG — die schlechteste beider Welten) und doppelte Kompression(einen bereits optimierten Screenshot nochmal durch einen Lossy-Kompressor schicken erzeugt nur neue Artefakte). Einmal das richtige Format, einmal verlustfrei optimiert — fertig.
Quellen
Apple-Support — Screenshots auf dem Mac · Microsoft-Support — Snipping Tool · W3C — PNG-Spezifikation · Google — WebP-Lossless-Spezifikation.