Bild-Lexikon

HTML-Element für Format-Fallbacks und Art Direction.

Lädt das erste `<source>`, dessen Format der Browser unterstützt, und fällt auf das `<img>`-Element zurück. Standard-Pattern: AVIF → WebP → JPG. Auch für unterschiedliche Crops je nach Viewport (Art Direction).

Android-Icon-System mit Foreground- und Background-Layer.

Seit Android 8 (2017). Der Launcher maskiert das Icon je nach Hersteller-Style (rund, squircle, Pixel). Der Foreground-Layer braucht 25 % Safe-Zone-Padding — siehe Maskable Icon.

Adobe Illustrators natives Vektor-Format, intern PDF mit Illustrator-Layern.

Seit Illustrator 9 (1999) PDF-kompatibel — jede AI-Datei ist gleichzeitig ein PDF, plus Illustrator-spezifische binäre Editier-Informationen. Web-untauglich; für Web-Auslieferung als SVG oder PNG/WebP exportieren.

Überlagerung von Bildern unter Berücksichtigung der Transparenz.

„Source Over“ ist die Standard-Operation: das neue Bild deckt das alte teilweise ab. Premultiplied vs. straight Alpha sind die zwei Varianten — Premultiplied vermeidet Halo-Effekte.

Vierter Bildkanal, der Transparenz pro Pixel speichert (0–255).

RGB + A. 0 = vollständig transparent, 255 = vollständig undurchsichtig. PNG und WebP unterstützen Alpha; JPG nicht.

Alternativer Bild-Text — Pflicht für Barrierefreiheit und Bilder-SEO.

Screen-Reader lesen den `alt`-Wert vor. Suchmaschinen werten ihn als wichtigsten Bild-Kontext. Beschreibend, knapp, ohne „Bild von …“. Leerer `alt=""` ist erlaubt für reine Deko-Bilder.

Animated PNG — Mozillas rückwärts-kompatible PNG-Animation.

2004 von Mozilla vorgeschlagen, vom PNG-Komitee abgelehnt, trotzdem in Firefox, Safari, Chrome implementiert. 2025 als PNG-3 offiziell normalisiert. Verlustfreie Animation mit voller 24-Bit-Farbtiefe und 8-Bit-Alpha.

iOS-Homescreen-Icon — 180×180 px, Pflicht für iPhone-PWAs.

`<link rel="apple-touch-icon" href="…">`. Ohne dieses Icon zeigt iOS auf dem Homescreen einen unscharfen Webseiten-Screenshot statt eines sauberen App-Symbols.

Royalty-freier Video-Codec der Alliance for Open Media — Basis von AVIF.

2018 als royalty-frei finalisiert. YouTube und Netflix liefern AV1-Streams an unterstützende Clients. Encoding ist rechenintensiv; SVT-AV1 ist heute der schnellste Open-Source-Encoder.

Nächste Generation nach WebP (2019) — bis 50% kleiner als WebP.

AV1 Image File Format, basiert auf dem AV1-Video-Codec der Alliance for Open Media. Bietet höhere Effizienz als WebP, mit 12-Bit-Farbtiefe und HDR-Unterstützung. Browser-Support: Chrome 85+, Firefox 113+, Safari 16.4+.

Stufige Übergänge in Verläufen bei zu geringer Farbtiefe.

Klassisch sichtbar in 8-Bit-Himmel-Verläufen. Mit 10-Bit-Codierung (HDR-Formate) verschwindet das Phänomen, mit Dithering wird es maskiert.

Kodierung binärer Daten als ASCII-Text — 33% Größen-Overhead.

Standard-Verfahren zur Einbettung binärer Daten in Text-Formate wie HTML, CSS, JSON. Drei Byte werden in vier ASCII-Zeichen kodiert. Sinnvoll nur für sehr kleine Assets (unter 5 KB).

Farb-Filter-Anordnung auf Kamera-Sensoren — RGGB-Mosaik.

Bryce Bayer, Kodak 1976. Jeder Sensor-Pixel sieht nur eine Farbe; die fehlenden zwei werden per Demosaicing interpoliert. Fujifilms X-Trans nutzt ein abweichendes 6×6-Pattern.

Datenmenge pro Sekunde — zentrale Größe für Video- und Audio-Komprimierung.

Bei Video gemessen in kbit/s oder Mbit/s. Niedrige Bitraten produzieren Block- und Banding-Artefakte; hohe Bitraten lassen die Datei groß. Constant Bitrate (CBR) vs. Variable Bitrate (VBR) sind die zwei Hauptansätze.

Misch-Modus zwischen zwei Layer-Bildern — Multiply, Screen, Overlay, ...

Mathematische Operation pro Pixel-Paar. In Photoshop seit 1994, in CSS seit 2015 (`mix-blend-mode`). Wichtig für Foto-Composites, Doppelbelichtungen, UI-Effekte.

Binär-Daten-Repräsentation im Browser — Grundlage jeder lokalen Bild-Pipeline.

Ein `Blob` ist ein unveränderlicher Byte-Stream mit MIME-Typ. `File` ist ein `Blob` mit Datei-Namen. Über `URL.createObjectURL(blob)` werden Blobs als Bild-Quelle nutzbar.

Low-Quality Image Placeholder — Vorschau-Trick gegen Layout-Shift.

Hochskaliertes Daumennagel-Bild (oft 10 × 10 Pixel als Base64) wird sofort angezeigt und beim Erscheinen des Original-Bildes überblendet. Eliminiert die wahrgenommene Lade-Verzögerung.

Windows-Bitmap (1987) — unkomprimiertes Legacy-Format.

Aus dem OS/2-Projekt von IBM und Microsoft hervorgegangen. Heute nur noch in Embedded-Systemen, Windows-System-APIs und als Zwischenformat relevant. Ein 1920×1080-Foto als BMP ist 6 MB.

Googles HTTP-Nachfolger von gzip — 15–25 % effizienter bei Text.

Brotli, 2015 als RFC 7932 spezifiziert. Browser-Unterstützung universell über `Accept-Encoding: br`. Höhere CPU-Kosten beim Encoden, aber identisch schnelle Dekodierung wie gzip.

HTTP-Header, der dem Browser sagt, wie lange Assets gecachet werden dürfen.

Für unveränderliche Bilder mit Hash-Filename: `Cache-Control: public, max-age=31536000, immutable`. Spart Round-Trips bei Wiederkehr-Besuchern komplett.

Browser-API zum Zeichnen und Auslesen von Pixeln in JavaScript.

Erlaubt JNRT Pixel die clientseitige Bildverarbeitung: Bild wird auf ein `<canvas>` gezeichnet, manipuliert und als komprimiertes Blob ausgegeben — alles im Browser, kein Server.

Greenscreen-Technik — Pixel einer bestimmten Farbe werden transparent.

Klassische Composite-Technik aus Film und Live-TV. Heute in OBS, DaVinci Resolve, After Effects per Algorithmus oder ML-Modellen umgesetzt. Grüner Hintergrund, weil menschliche Haut wenig Grün enthält und Sensoren in Grün die höchste Auflösung haben.

Speichert Farb-Info in niedrigerer Auflösung als Helligkeit.

Das Auge ist empfindlicher für Helligkeit als Farbe. Standard-Notation: 4:4:4 (volle Farbinfo), 4:2:2 (halbe horizontale Farbinfo), 4:2:0 (halbe horizontale und vertikale — Web-Standard).

Misst, wie stark sich Layout-Elemente während des Ladens verschieben.

Bilder ohne explizite `width`/`height`-Attribute verursachen Layout-Shifts und verschlechtern den CLS-Wert. Google empfiehlt CLS unter 0,1.

Subtraktiver Druckfarbraum (Cyan, Magenta, Gelb, Schwarz).

Nicht für Web! Browser interpretieren CMYK-JPGs falsch. Wenn ein PSD oder TIFF in CMYK vorliegt, vor dem Web-Export zu RGB konvertieren. Druckereien wollen CMYK-Vorlagen weiterhin als PDF/X.

COder/DECoder — Algorithmus für Komprimierung und Dekomprimierung.

Beispiele bei Bild: JPEG, WebP, AV1, HEVC. Bei Video: H.264, H.265, VP9, AV1. Codec bezeichnet den Algorithmus, Container das Datei-Format (MP4, WebM, HEIF).

Datei-Hülle, die einen oder mehrere Codec-Datenströme bündelt.

HEIF-Container kann HEVC (=HEIC) oder AV1 (=AVIF) halten. MP4 kann H.264, H.265 oder AV1 enthalten. WebM ist VP8/VP9/AV1. Container ≠ Codec.

Googles Metrik-Set zur Mess der Nutzererfahrung — LCP, INP, CLS.

Seit 2021 offizieller Google-Ranking-Faktor. Bilder beeinflussen direkt LCP (Ladezeit) und CLS (Layout-Stabilität).

Bild, das im initialen Viewport sichtbar ist — meist das LCP-Element.

Für kritische Bilder: niemals lazy-loaden, immer mit `fetchpriority="high"` markieren, ggf. preloaden. Below-the-Fold-Bilder dagegen lazy.

Bild inline in HTML/CSS als `data:image/...;base64,...`.

Spart einen HTTP-Request, bläht aber HTML/CSS auf. Sinnvoll für sehr kleine Bilder (<2 KB) oder LQIP-Placeholder. Größere Bilder als Data URI verschlechtern Caching und Compression.

Mathematische Transformation, die JPG-Komprimierung möglich macht.

Zerlegt einen 8×8-Pixel-Block in 64 Frequenz-Koeffizienten — niedrige Frequenzen in der Mitte, hohe Frequenzen am Rand. JPG quantisiert die hohen Frequenzen stärker, weil das Auge sie schwerer wahrnimmt.

`<img decoding="async">` lässt den Browser das Bild non-blocking dekodieren.

Verhindert, dass das Decoding den Main-Thread blockiert. Auf Mobile-Geräten oft 50–200 ms Einsparung. Default in modernen Browsern, aber explizit setzen schadet nicht.

Verlustfreie Komprimierung aus LZ77 + Huffman — Basis von PNG, ZIP, gzip.

Phil Katz, 1993. Wörterbuch-basierte LZ77 sucht wiederholende Byte-Sequenzen, Huffman-Codierung komprimiert die Häufigkeiten. Steckt in praktisch jedem verlustfreien Format und in HTTP-Content-Encoding.

Berechnung fehlender Farbwerte aus Bayer-Sensor-Daten.

Aus einem RAW mit nur einer Farbe pro Pixel wird ein vollständiges RGB-Bild interpoliert. Algorithmen reichen von simpler Bilinear-Interpolation bis zu adaptiv-edge-aware-Verfahren wie AHD.

Apples Wide-Gamut-Farbraum — ~25 % größer als sRGB.

Seit iPhone 7, iPad Pro und MacBook Pro Retina nutzt Apple Display P3. Stärker bei Rot- und Grün-Sättigung als sRGB. PNG und WebP können P3 als eingebettetes ICC-Profil transportieren.

Bewusstes Rauschen, um Farb-Banding zu vermeiden.

Bei reduzierter Farbpalette (GIF, indizierte PNGs) wird mit Punkt-Mustern simuliert, was die Palette nicht direkt darstellen kann. Floyd-Steinberg ist der berühmteste Algorithmus.

Adobes offenes RAW-Format (2004) — Digital Negative.

ISO 12234-2 seit 2009. Soll das proprietäre RAW-Chaos ablösen. Hersteller wie Leica, Hasselblad und Pentax adoptierten; Canon, Nikon, Sony nicht. Lightroom kann existierende RAWs beim Import zu DNG umwandeln.

Druckpunkte vs. Bildschirm-Pixel pro Zoll.

DPI (Dots Per Inch) ist eine Druck-Metrik, PPI (Pixels Per Inch) eine Bildschirm-Metrik. Im Web-Kontext werden beide oft synonym verwendet, technisch korrekt ist PPI. Für Druck-Standardqualität: 300 DPI bei finalem Druckmaß.

Klassische Komposition: Hauptmotive auf den Drittel-Linien platzieren.

Das Bild wird gedanklich in 3×3 geteilt. Wichtige Motive an den Schnittpunkten (Power Points) wirken dynamischer als mittig. Unser Cropper blendet das Raster automatisch ein.

Encapsulated PostScript — Legacy-Vektor-Austausch der DTP-Ära.

1987 von Adobe definiert. Bis Anfang der 2000er Standard für Vektor-Austausch in Druck-Workflows. 2017 von Adobe als veraltet markiert. Für moderne Pipelines durch SVG (Web) oder PDF/X (Druck) abgelöst.

Metadaten-Block in Bildern: Kamera, Linse, Belichtung, GPS.

Exchangeable Image File Format, von der japanischen JEIDA 1995 standardisiert. Eine moderne Smartphone-Kamera packt 100–500 KB EXIF in jedes Foto.

Definiert, wie RGB-Werte in tatsächliche Farben übersetzt werden.

International Color Consortium Profile. Web-Standard ist sRGB. Adobe RGB und Display-P3 haben größere Farbräume, werden aber von älterer Software ignoriert.

Bits pro Pixel-Kanal — bestimmt mögliche Farbabstufungen.

8 Bit = 256 Werte pro Kanal (Web-Standard), 10 Bit = 1024 (HDR-TV), 12 Bit = 4096 (DCI-Kino), 16 Bit = 65 536 (Foto-RAW). Bei niedriger Farbtiefe entsteht Banding in Verläufen.

Mini-Icon im Browser-Tab — `/favicon.ico` plus moderne PNG-Link-Tags.

Seit Internet Explorer 5 (1999) De-facto-Standard. Heutige Best Practice: ein 32×32-PNG plus 180×180 Apple-Touch-Icon plus 512×512 PWA-Icon plus klassisches `favicon.ico` als Fallback.

First Contentful Paint — wann erscheint der erste Text- oder Bild-Inhalt?

Web-Vital, das die wahrgenommene Lade-Erfahrung beeinflusst. Gute Werte: <1.8 s. Wird durch Critical-CSS, Preloads und schnellen TTFB verbessert.

HTML-Attribut für Lade-Priorität — `high` für LCP-Bilder, `low` für Below-the-Fold.

Seit 2023 in Chrome, Edge, Firefox. `fetchpriority="high"` auf dem Hero-Bild verbessert messbar LCP. `low` auf Karussell-Bildern verhindert Bandbreiten-Konkurrenz.

Fabrice Bellards Universal-Codec-Suite für Video, Audio, Bild — seit 2000.

Konvertiert zwischen praktisch allen Formaten. Steckt in YouTube, Netflix, jedem Browser-Video-Decoder und unzähligen Toolchains. Spitzname „Schweizer Taschenmesser der Medien“.

Nicht-lineare Helligkeits-Codierung — sRGB nutzt Gamma ~2.2.

Menschen sehen Helligkeit nicht linear. Gamma-Codierung verteilt Bit-Tiefe so, dass mehr Werte für dunkle Töne reserviert sind — genau dort, wo das Auge empfindlicher ist.

Animations-Format aus 1987, max. 256 Farben, binäre Transparenz.

Graphics Interchange Format, von CompuServe entwickelt. Veraltete LZW-Komprimierung und 8-Bit-Farbraum machen es heute für Animation deutlich schwächer als animiertes WebP — typischerweise 3–4× größer.

Standort-Koordinaten in Foto-Metadaten — Datenschutz-Risiko beim Sharing.

Smartphones speichern den Aufnahmeort meterscharf. Wer Fotos auf Instagram, Twitter oder per E-Mail teilt, gibt den Standort oft unbeabsichtigt preis. Vor dem Teilen entfernen.

HTTP-Standard-Komprimierung seit 1992 — Deflate plus Headers.

GNU zip. Wird von Browsern via `Accept-Encoding: gzip` ausgehandelt; spart bei Text (HTML, CSS, JS, JSON) typisch 60–80 %. Für vorkomprimierte Bilder bringt es nichts.

Web-Video-Codec-Standard seit 2003 — überall unterstützt.

ITU-T H.264 / MPEG-4 Part 10. Patentbelastet (MPEG LA), aber universell hardware-beschleunigt. YouTube, Netflix, Zoom — fast jedes Video, das nicht explizit auf AV1 setzt, ist H.264.

Nachfolger von H.264 — 50 % effizienter, aber patent-belastet.

High Efficiency Video Coding. Drei Patent-Pools (MPEG LA, HEVC Advance, Velos Media) machten HEVC für Open-Source-Software unattraktiv. Im Web nie etabliert; AVIF und AV1-Video sind die royalty-freien Alternativen.

High Dynamic Range — hellere Highlights und tiefere Schatten als SDR.

HDR braucht mindestens 10 Bit pro Kanal, einen Wide-Gamut-Farbraum (Rec. 2020) und eine OETF wie PQ (HDR10) oder HLG. Bei Bildformaten unterstützen AVIF und JPEG XL HDR; WebP und klassisches JPG nicht.

Apple-Standard seit iOS 11 — 30–50% kleiner als JPG.

High Efficiency Image Container, basiert auf dem HEVC/H.265-Video-Codec. Standard auf iPhones seit 2017. Außerhalb des Apple-Ökosystems oft inkompatibel — Windows 10 braucht eine kostenpflichtige Erweiterung.

Verteilungs-Diagramm der Pixel-Helligkeiten von 0 bis 255.

Wichtig zur Belichtungs-Beurteilung. Bei Spitzen am linken Rand (Underexposure) gehen Schatten verloren, am rechten (Overexposure) brennen Highlights aus. Lightroom und alle RAW-Tools zeigen es prominent.

Wahrnehmungs-nahe Farbmodelle: Hue, Saturation, Lightness/Value.

Intuitiver für Designer als RGB. CSS unterstützt `hsl()` und `hsla()` direkt. HSV (auch HSB) wird in vielen Color-Pickern wie unserer Farbpaletten-Extraktion genutzt.

Multiplexing-Protokoll — viele Bilder parallel über eine TCP-Verbindung.

Ab 2015 in allen großen Browsern. Eliminiert das Domain-Sharding-Anti-Pattern der HTTP/1.1-Ära. HTTP/3 mit QUIC ist 2026 zusätzlich verbreitet.

Variable-Length-Codierung — häufige Symbole kurz, seltene lang.

David Huffman, 1952. In JPEG, Deflate und vielen anderen Formaten als Entropie-Codierungs-Stufe nach der eigentlichen Daten-Transformation eingesetzt. Mozjpeg optimiert die Huffman-Tabellen pro Bild.

Eingebettete Farbraum-Beschreibung — Voraussetzung für korrekte Wiedergabe.

International Color Consortium-Spezifikation seit 1993. Sagt dem Decoder „die RGB-Werte in dieser Datei bedeuten Display P3“ (oder sRGB, Rec. 2020 etc.). Ohne Profil interpretieren Browser als sRGB.

Apples Multi-Resolution-Icon-Container für macOS-Anwendungen.

Aus den Resource-Forks des klassischen Mac System 7 hervorgegangen, mit Mac OS X 10.0 zu einer eigenständigen Datei. Hält PNG- und JPEG-2000-Schichten für alle Auflösungen vom Tab-Icon bis 1024×1024.

Windows-Icon-Container (1985) — bis heute Favicon-Legacy-Fallback.

Multi-Resolution-Container: eine Datei kann mehrere Icon-Größen und Bit-Tiefen halten. Seit Internet Explorer 5 (1999) als /favicon.ico im Web etabliert.

On-the-fly-Bildtransformation an der Edge — Cloudinary, Imgix, Vercel Image.

Liefert pro Request die optimale Größe, Format (AVIF/WebP/JPG) und Qualität. Spart Speicher gegen die manuelle Variant-Generierung. Vercel/Next.js bringt es eingebaut mit.

XML-Sitemap-Erweiterung — sagt Google, welche Bilder zu welchen Seiten gehören.

Im `<image:image>`-Block der Sitemap aufgelistet. Hilft besonders bei Lazy-Loaded und CMS-generierten Bildern, die im HTML schwer zu crawlen sind.

GPU-gestützter Bild-Buffer für schnelles Canvas-Drawing.

`createImageBitmap(blob)` parst und dekodiert das Bild asynchron auf einem Worker-Thread und liefert ein GPU-fähiges Handle zurück. Deutlich schneller als das klassische `<img>`-Decoding für Bulk-Operationen.

Klassische Kommandozeilen-Suite für Bildverarbeitung seit 1987.

Kann praktisch jedes Format lesen und schreiben. Für Skript-Workflows und Batch-Konvertierungen unschlagbar. Etwas langsamer als Sharp/libvips bei großen Pipelines.

Interaction to Next Paint — Core-Web-Vital seit März 2024.

Ersetzt FID. Misst die längste Verzögerung zwischen Nutzer-Interaktion und sichtbarer UI-Reaktion. Gute Werte: <200 ms. Wird durch Reduktion langer Main-Thread-Tasks verbessert.

Browser-API zur Sichtbarkeits-Erkennung — Basis modernes Lazy-Loading.

Liefert Events, wenn ein Element den Viewport betritt oder verlässt. Ersetzt die alten Scroll-Listener-Hacks. Heute das Standard-Pattern für Bild-Lazy-Loading-Polyfills.

Pressefoto-Metadaten — Bildunterschrift, Urheber, Stichwörter, Standort.

International Press Telecommunications Council, seit 1990 standardisiert. Verlage, Bildagenturen und CMS-Systeme lesen IPTC-Headlines, Captions und Keywords automatisch. In JPG und TIFF eingebettet.

JPEG File Interchange Format — der eigentliche Container hinter „JPG“.

Eric Hamilton, C-Cube Microsystems 1992. JPEG standardisiert den Komprimierungs-Algorithmus, JFIF die Datei-Struktur. Heute oft mit eingebettetem EXIF kombiniert.

Wavelet-basierter JPEG-Nachfolger (2000), dominant in Kino und Medizin.

ISO/IEC 15444. Nutzt Diskrete Wavelet-Transformation statt DCT. Im Web nie etabliert, aber Pflicht-Codec für digitale Kino-Projektion (DCI/DCP) und DICOM-Medizin-Workflows.

Moderner JPEG-Nachfolger (ISO 18181, 2021) mit verlustfreier JPG-Re-Kompression.

Fusion der Forschungs-Codecs PIK (Google) und FUIF (Cloudinary). Kann existierende JPGs ohne Pixel-Verlust ~20 % kleiner machen, unterstützt HDR und progressives Laden. 2022 aus Chrome entfernt, 2025 wieder aufgenommen.

Microsofts HD-Photo-Format (2006), ISO 29199, im Web nie angekommen.

Aus Windows Media Photo hervorgegangen. Internet Explorer 9 unterstützte das Format, andere Browser zogen nie nach. Mit der Chromium-Umstellung von Edge 2020 endgültig aus dem Mainstream verschwunden.

Verlustbehaftetes Bildformat (1992), Standard für Fotos im Web.

Joint Photographic Experts Group, 1992. Zerlegt Bilder in 8×8-Pixel-Blöcke und nutzt Diskrete Cosinus-Transformation (DCT) plus Quantisierung, um Datei-Größe drastisch zu reduzieren — auf Kosten unsichtbarer Detail-Information. Sweet-Spot-Qualität für Web: 78. Kein Alpha-Kanal.

Sichtbare Komprimierungs-Spuren bei zu aggressivem JPG.

Block-Artefakte (8×8-Quadrate), Mosquito-Noise (Ringeln um Kanten) und Banding (Stufen in Verläufen) treten auf, wenn die Qualität zu niedrig gewählt wird oder ein Bild mehrfach hintereinander als JPG re-encodiert wurde (Generation Loss).

Vollständig codiertes Video-Bild als Anker für Delta-Frames danach.

In H.264, H.265, AV1 als I-Frame bezeichnet. P- und B-Frames speichern nur die Differenz zum nächstgelegenen Keyframe. Bei animiertem WebP/AVIF/GIF ähnliches Prinzip; mehr Keyframes = bessere Sprungfähigkeit, größere Datei.

Khronos-Texture-Container für GPU-Texturen — direkt in den VRAM geladen.

Hält GPU-native komprimierte Texturen (BC, ETC, ASTC) ohne Re-Encoding zur Laufzeit. KTX2 (2020) ergänzt Basis-Universal-Supercompression mit ZSTD. In Game-Engines, glTF und WebGPU der bevorzugte Texturen-Container.

Bilder erst laden, wenn sie in den Viewport scrollen.

Mit `loading="lazy"` nativ unterstützt seit 2019. Spart Initial-Bandbreite und verbessert LCP. Hero-Bilder bewusst `loading="eager"` setzen.

Wichtigste Core-Web-Vitals-Metrik — Zeit bis zum größten sichtbaren Element.

Misst die Renderzeit des größten Inhaltselements im sichtbaren Bereich. Ziel: unter 2,5 Sekunden. Bilder verursachen oft den LCP und müssen entsprechend priorisiert geladen werden.

Referenz-PNG-Library seit 1995 — in praktisch jedem System verbaut.

Steckt in jedem Browser, jedem Betriebssystem, jedem Bildverarbeitungs-Programm. Mit zlib zusammen Basis der gesamten PNG-Welt.

Streaming-basierte Bildverarbeitungs-Library mit niedrigem Speicherbedarf.

Verarbeitet Bilder als pipelined Streams statt als komplette In-Memory-Buffer. Bei 100-MP-Bildern oft 10× schneller und 30× speicher-effizienter als ImageMagick. Basis von Sharp.

Googles Referenz-Implementierung des WebP-Codecs.

In jedem modernen Browser eingebaut. Die CVE-2023-4863 (Heap-Buffer-Overflow) führte 2023 zum bislang breitesten Browser-Notfall-Patch der Web-Geschichte.

JSON-basiertes Vektor-Animations-Format — von Airbnb 2015.

Aus After Effects exportiert. Wird im Browser zur Laufzeit als SVG/Canvas gerendert. Deutlich effizienter als animierte GIFs oder Videos für komplexe Vektor-Animationen, oft <30 KB.

Lempel-Ziv-Welch — der GIF-Algorithmus mit langer Patent-Geschichte.

Terry Welch, 1984. Bis 2004 patentbelastet (Unisys), was 1994 die PNG-Entwicklung als Patent-freien Ersatz auslöste. Heute frei und in GIF, TIFF und PostScript verfügbar.

PWA-Icon mit Safe-Zone-Padding für Android-Launcher-Masken.

Standard seit Android 8 (2017). Das Icon füllt eine 108-dp-Leinwand komplett aus; das Betriebssystem maskiert je nach Launcher rund, eckig oder squircle.

Graustufen-Karte, die Sichtbarkeit pro Pixel bestimmt — weiß sichtbar, schwarz versteckt.

In Photoshop, Affinity und GIMP der Standard für nicht-destruktive Bearbeitung. CSS hat `mask-image` als Web-Äquivalent. Beim PWA Maskable Icon wird die Maske vom OS bestimmt.

Mozilla-Encoder, der JPG-Dateien 5–15% kleiner macht als libjpeg.

Open-Source-Fork von libjpeg-turbo (2014). Bringt Trellis-Quantisierung, optimierte Huffman-Tabellen und eine bessere Standard-Quantisierungs-Matrix mit — vollständig kompatibel mit jedem JPG-Decoder.

Mozillas Optimierungs-Encoder gegen den Standard-JPEG-Encoder.

Mozjpeg liefert bei identischer Dekodier-Kompatibilität 5–15 % kleinere Dateien durch Trellis-Quantisierung, optimale Huffman-Tabellen und eine bessere Standard-Matrix. libjpeg-turbo ist schneller, Mozjpeg effizienter.

MPEG-4 Part 14 — der dominante Video-Container des Webs.

Hält H.264, H.265 oder AV1 plus Audio (AAC, Opus). MOV (Apples QuickTime-Container) ist binär nahezu identisch. Für Web-Auslieferung von loopenden Videos die richtige Wahl statt GIF.

Canvas-Rendering im Web Worker — verhindert UI-Blockade.

Erlaubt Bild-Verarbeitung in einem Worker-Thread. Wichtig für Browser-Tools wie unsere Komprimier-Pipeline, damit die UI während der Berechnung interaktiv bleibt.

Vorschau-Bild für Social-Media-Karten — typisch 1200 × 630.

Facebook-Standard, übernommen von Twitter, LinkedIn, Slack, Discord. Per `<meta property="og:image">` referenziert. Bild sollte 1.91:1 sein, JPG oder PNG, unter 2 MB.

HDR-Industriestandard für VFX und 3D-Rendering — von Industrial Light & Magic 1999.

Half-Float 16-Bit pro Kanal (IEEE 754) speichert physikalische Lichtwerte. Multi-Layer-Container für Render-Passes (Diffuse, Specular, Z-Tiefe). Heute bei Pixar, Disney, Netflix und in Unreal/Unity üblich.

EXIF-Feld, das die Anzeige-Richtung bestimmt — verantwortlich für die Hochformat-Falle.

Wert 1 = normal, 6 = 90° im Uhrzeigersinn drehen, 8 = 90° gegen den Uhrzeigersinn. Wer das Tag ignoriert, bekommt iPhone-Fotos teilweise auf der Seite liegend zu sehen.

Portable Document Format (1993) — universelles Dokument-Container-Format.

John Warnocks Camelot-Projekt. Seit 2008 ISO-Standard 32000. Kann Vektor, Raster, Text, Schriften eingebettet und Metadaten kombinieren. PDF/A ist die Archiv-Variante, PDF/X die Druck-Variante.

Verlustfreies Bildformat (1996) mit Alpha-Kanal-Transparenz.

Portable Network Graphics, 1996, als patentfreier Nachfolger von GIF entwickelt. Verlustfreie Komprimierung via Deflate, voller 24-Bit-Farbraum, partielle Transparenz. Ideal für Logos, Diagramme, Screenshots, Pixel-Art. Bei Fotos drei- bis zehnmal größer als JPG.

`<link rel="preload" as="image">` lädt Hero-Bilder vor dem HTML-Parse-Ende.

Wichtig bei LCP-Bildern, die per CSS-Background eingebunden sind — der Browser entdeckt sie sonst spät. Mit `imagesrcset` und `imagesizes` auch für Responsive-Sets möglich.

Adobe Photoshop Document — Master-Format mit Layer, Masken, Smart Objects.

Thomas Knoll, 1990 erste Version. Hält die komplette Bearbeitungs-Sitzung: Pixel-Daten, Adjustment-Layer, Smart Objects, Effekte. PSB ist die Großformat-Variante (bis 300 000 × 300 000 px).

Web-App, die wie eine native App installierbar ist.

Begriff von Alex Russell, 2015. Kombiniert Service Worker (Offline-Cache), Web App Manifest (Icons + Theme) und Push-Notifications. JNRT Pixel ist als PWA installierbar.

Rundung der DCT-Koeffizienten — der eigentliche Verlust bei JPG.

Jeder Frequenz-Koeffizient wird durch eine Quantisierungs-Tabelle dividiert und auf eine ganze Zahl gerundet. Hohe Frequenzen werden stärker quantisiert; niedrige bleiben fast erhalten. Hier passiert der unwiederbringliche Verlust.

Glättung von Sensor-Rauschen — wichtig bei High-ISO-Aufnahmen.

Klassisch via Median-Filter, modern via KI-Modelle wie DeepPRIME (DxO), Denoise AI (Topaz) oder die Lightroom-eigene KI-Entrauschung. Tradeoff: weniger Rauschen vs. erhaltenes Detail.

Unverarbeitete Sensor-Daten direkt aus der Kamera.

Hersteller-spezifisch: Canon CR2/CR3, Nikon NEF, Sony ARW, Olympus ORF, Fujifilm RAF, Panasonic RW2. 12–16 Bit pro Kanal, maximaler Dynamikumfang, ungeplanter Bearbeitungs-Spielraum für Belichtung und Weißabgleich.

UHD-/HDR-Farbraum — das Ziel moderner HDR-Pipelines.

Von der ITU für 4K- und 8K-Fernsehen spezifiziert. Wird in HDR10-, Dolby-Vision- und AVIF-HDR-Workflows verwendet. Nur Hardware mit Wide-Gamut-Displays kann es voll darstellen.

Neuberechnung der Pixel beim Skalieren — Lanczos, Bicubic, Bilinear.

Lanczos liefert die schärfsten Ergebnisse (Standard von Photoshop), Bicubic ist ein guter Allrounder, Bilinear schnell aber weich, Nearest-Neighbor erhält Pixel-Art-Look.

Auflösungs-passende Auslieferung via `srcset`, `sizes`, `<picture>`.

Ziel: jeder Browser bekommt nur die Pixel, die er tatsächlich braucht. Spart auf Mobile typisch 50–70 % Bytes. Kombiniert mit Format-Fallback maximaler Effizienz-Gewinn.

Bildschirme mit doppelter (oder höherer) Pixeldichte.

Apples Marketing-Begriff für Displays mit 2× oder 3× DPR. Für scharfe Darstellung muss ein 600-px-Container ein 1200-px-Bild laden, sonst wirkt es unscharf.

Additiver Farbraum aus Rot, Grün, Blau — das Web-Standard-Modell.

Jeder Pixel als drei Werte: Rot, Grün, Blau. Mit Alpha-Kanal wird daraus RGBA. CSS-Notation `rgb(255, 128, 0)` oder `#FF8000`. Bei Wide-Gamut-Bildern entscheidet das ICC-Profil, welche konkreten Farben gemeint sind.

Run-Length Encoding — primitive verlustfreie Komprimierung für einfarbige Flächen.

Kodiert Wiederholungen kompakt: „20× weiß“ statt 20× das Byte für weiß. In BMP, TGA, ICO und vielen 90er-Spielen verbaut. Heute praktisch immer durch Deflate ersetzt.

Strukturierte Bild-Beschreibung als JSON-LD oder Microdata.

Mit `ImageObject`-Markup teilen Suchmaschinen mit, welches Bild zu einer Seite gehört, welche Auflösung es hat, wer der Urheber ist. Verbessert Google-Bildersuche- und Featured-Snippet-Auswahl.

Verhältnis von Breite zu Höhe — z. B. 16:9, 4:3, 1:1, 9:16.

16:9 ist YouTube und Widescreen, 9:16 ist Reels/Stories/TikTok, 1:1 ist Instagram-Feed-Quadrat, 4:5 ist Instagram-Portrait. Beim Zuschneiden entscheidet das Seitenverhältnis über die Komposition.

Browser-Proxy zwischen Web-App und Netzwerk — ermöglicht Offline.

Einführung ab 2014. Fängt Netzwerk-Anfragen ab und kann Antworten aus dem Cache liefern. Voraussetzung für PWA-Offline-Funktion.

Node.js-Bildbearbeitungs-Library auf libvips-Basis — De-facto-Standard.

Schnell (40–60 % schneller als ImageMagick), produziert WebP, AVIF, JPG, PNG aus Pipelines. Wird von Vercel/Next.js Image Optimization, Cloudinary-Workern und vielen CMS-Plattformen genutzt.

Sagt dem Browser, welche Bildbreite bei welchem Viewport zu erwarten ist.

Geht Hand in Hand mit `srcset`. Beispiel: `sizes="(max-width: 600px) 100vw, 50vw"`. Ohne `sizes` wählt der Browser oft die unnötig großen Varianten und verschwendet Bandbreite.

Start-Bild beim Öffnen einer installierten PWA.

Android generiert ihn automatisch aus dem Manifest-Icon und der `background_color`. iOS benötigt zusätzlich `apple-touch-startup-image`-Links pro Bildschirm-Größe — der PWA Generator deckt das ab.

HTML-Attribute zur Auslieferung passend großer Bilder pro Gerät.

Mit `srcset` listest du Bild-Varianten in verschiedenen Auflösungen; der Browser wählt automatisch die für Viewport und DPR optimale. `<picture>` ergänzt Format-Switching für AVIF/WebP-Fallbacks.

Standard-Farbraum des Webs seit 1996 — Default für alle Browser.

HP und Microsoft definierten sRGB als sicheren gemeinsamen Nenner: relativ schmaler Farbraum, der auf jedem damaligen Monitor halbwegs konsistent darstellbar war. Heute der implizite Default jedes Web-Bildes.

Vektor-Bildformat — beliebig skalierbar, in XML beschrieben.

Scalable Vector Graphics. Definiert Bilder durch Pfade und Formen statt Pixelraster. Perfekt für Logos und Icons (oft unter 5 KB), per CSS stylbar, animierbar, barrierefrei. Für Fotos ungeeignet.

Truevision-Targa (1984) — Spieleindustrie-Standard für Texturen.

32-Bit-RGBA und einfacher RLE-Decoder machten TGA zur Wahl klassischer Spieleengines (Wing Commander, Diablo, Quake, Half-Life). Auch 2026 noch in Substance, Quixel und vielen Game-Engines aktiv.

Farbton der Browser-Statusbar bei mobilen Tabs und PWAs.

`<meta name="theme-color" content="#d4a017">`. Macht den Browser-Header oben farblich passend zur Marke. Optional pro Light/Dark-Modus über `media`-Queries möglich.

Tag-basierter Archiv-Standard seit 1986 — Bibliotheken, Druck, Mikroskopie.

Tagged Image File Format, ursprünglich bei Aldus für Scanner-Workflows, seit 1994 bei Adobe. Verlustfrei, mit BigTIFF auch über 4 GB möglich. Library of Congress und viele Behörden nutzen TIFF als Master-Archiv.

Umwandlung von HDR-Daten in SDR-Display-fähige Werte.

Notwendig, wenn ein HDR-Bild auf einem klassischen 8-Bit-sRGB-Display oder im Web ausgespielt wird. Algorithmen wie Reinhard, ACES oder Hable balancieren Highlights, Mid-Tones und Schatten.

Time to First Byte — Server-Antwortzeit bis zum ersten HTML-Byte.

Ein Frühindikator für LCP. Gute Werte: <200 ms. Bei langsamem TTFB hilft kein noch so kleines Bild — der Server ist das Bottleneck.

X (Twitter) eigene Variante der Link-Vorschau — Summary vs. Summary Large Image.

Eigene `<meta name="twitter:*">`-Tags; greift im Default-Fall auf die Open-Graph-Bilder zurück. Summary Large Image braucht mindestens 300 × 157 px, empfohlen 1200 × 628.

Klassische Schärfungs-Technik — Differenz zur weichgezeichneten Kopie.

Vom Foto-Vergrößerer der Analog-Zeit übernommen. Wirkt überzeugender als simple Kantenverstärkung, weil sie Mid-Tone-Kontraste betont. Standard in Photoshop, Lightroom und Capture One.

Verwirft gezielt Information, die das Auge schlecht wahrnimmt.

Lossy Compression. Nutzt psychovisuelle Modelle, um Daten zu reduzieren, die das menschliche Auge ohnehin schlecht erkennt. JPG, WebP-Lossy und AVIF arbeiten so. Bei richtigem Qualitätswert (78–82 für JPG) unsichtbar.

Pixel bleiben byte-exakt erhalten, nur Speicherung wird effizienter.

Lossless Compression. PNG, WebP-Lossless und AVIF-Lossless arbeiten verlustfrei — kein Pixel wird verändert. Erreichbar durch Entropie-Kodierung (Deflate, Huffman) und Prediction-Modelle.

Googles royalty-freier Video-Codec — Vorgänger von AV1.

Ersetzte VP8 für YouTube-Streaming. Vergleichbare Effizienz wie HEVC, aber ohne Patent-Probleme. Bei Standbildern wurde VP9 nie zum Format erweitert — Google ging direkt zu AV1/AVIF.

Sichtbarer Markenname oder Logo-Overlay als Marken- und Diebstahlschutz.

Klassisch unten rechts mit reduzierter Deckkraft. Bei Pressefotos oft zentriert, damit Cropping es nicht entfernt. Unsichtbare digitale Wasserzeichen (Steganografie) sind eine eigene Klasse.

Mathematische Zerlegung in Frequenz- und Orts-Anteile — Basis von JPEG 2000.

Anders als DCT mit fester Blockgröße arbeitet die Discrete Wavelet Transform (DWT) auf dem Gesamtbild mit mehreren Detail-Schichten. Vermeidet die typischen JPEG-Blockartefakte, ist aber rechenintensiver.

JSON-Datei, die deine PWA als installierbare App registriert.

`<link rel="manifest" href="/manifest.json">`. Definiert Name, Icons, Theme- und Background-Color, Display-Mode, Start-URL. Unser Icon Studio und der PWA Generator geben den Schnipsel mit aus.

Browser-Runtime für C/C++/Rust-Code, nahezu nativ schnell.

Erlaubt komplexe Encoder wie libwebp, Mozjpeg, libavif im Browser laufen zu lassen — mit Performance, die Server-Tools vergleichbar ist. Geladen wird die WASM-Datei einmal pro Sitzung.

Low-Level Browser-API für Video- und Bild-Encoder/Decoder.

Seit Chrome 94 (2021). Erlaubt programmatischen Zugriff auf VideoFrame-Streams und Hardware-beschleunigte Codecs. Basis moderner Browser-Video-Editoren und schneller Frame-Extraktion.

GPU-beschleunigte 3D- und 2D-Grafik im Browser via OpenGL ES.

Seit 2011 in allen großen Browsern. Basis für Three.js, A-Frame, Google Maps. WebGL 2 mit modernen Features ist seit 2017 verbreitet. Nachfolger: WebGPU.

Moderne GPU-API für den Browser — Nachfolger von WebGL.

2023 in Chrome 113 erschienen, 2024 in Safari Tech Preview, 2025 in Firefox. Bietet Compute-Shader und niedrigere Overhead-Kosten als WebGL. Wird für Browser-LLMs und schnelles Bild-Processing genutzt.

Googles offener Video-Container — VP8/VP9/AV1 + Vorbis/Opus.

2010 mit WebP gemeinsam vorgestellt. In Chrome, Firefox, Edge und allen Chromium-Browsern. Safari unterstützt seit Big Sur (2020) ebenfalls WebM.

Modernes Bildformat von Google (2010) — 25–35% kleiner als JPG.

Basiert auf der VP8-Video-Codec-Technologie. Unterstützt Lossy + Lossless + Animation + Alpha-Kanal in einem Format. Universelle Browser-Unterstützung seit 2020.

Adobe-Standard für erweiterte Bild-Metadaten in XML.

Extensible Metadata Platform, eingeführt 2001. Strukturierte Speicherung von Bearbeitungs-Historie, Lizenz-Angaben, Tags, Urheberrechtsinformationen.

Helligkeits-/Chrominanz-Farbraum — Basis fast aller Video- und JPEG-Codecs.

Y trägt die Helligkeit, Cb und Cr die Farbabweichungen. Weil das Auge auf Helligkeit empfindlicher reagiert als auf Farbe, kann Chroma-Subsampling (4:2:0 etc.) die Farbkanäle stark komprimieren ohne sichtbare Verluste. JPEG, MPEG, H.26x und AV1 nutzen YCbCr intern.

Graustufen-Kanal mit der Entfernung jedes Pixels zur Kamera.

Aus 3D-Render-Pipelines (OpenEXR-Multi-Layer) und modernen Smartphones (iPhone-Portrait-Mode, Google-Pixel). Erlaubt nachträgliches Bokeh, AR-Composites und 3D-Effekte. HEIC kann Tiefenkarten als separaten Auxiliary-Layer mitspeichern.

Open-Source-Bibliothek für Deflate — Software-Basis von PNG, gzip, ZIP.

Jean-loup Gailly und Mark Adler, 1995. Compact, BSD-artige Lizenz, in praktisch jedem Betriebssystem und jeder Sprache verfügbar. Über drei Jahrzehnte stabil, hat das gesamte Web-Komprimierungs-Ökosystem getragen.