Webgrafiken

Webgrafiken sind digitale Bilder und Vektorgrafiken, die speziell für die Anzeige im Web optimiert wurden. Sie unterstützen die visuelle Kommunikation, die Strukturierung von Inhalten und die Markenwirkung auf Webseiten, in Apps und in digitalen Publikationen.

Zu Rasterformaten gehören JPEG, PNG und GIF, sowie moderne Formate wie WebP oder AVIF, die unterschiedliche Kompressionsmethoden nutzen. Vektorgrafiken werden meist als SVG eingesetzt, insbesondere für Icons, Logos und skalierbare Grafiken.

Wichtige Techniken sind verlustbehaftete und verlustfreie Kompression, Größenanpassung und Responsive Images mithilfe von srcset, sizes oder dem picture-Element. Bilder sollten in passenden Abmessungen bereitgestellt, gleichzeitig komprimiert und gegebenenfalls lazy geladen werden, um Rendering- und Ladezeiten zu verbessern.

Barrierefreiheit: Alt-Texte liefern eine beschreibende Textinformation, dekorative Grafiken können ohne Texteinbettung markiert werden. Durch richtige Semantik und Medien-Attribute unterstützen Bilder Screenreader und Suchmaschinen.

Performance und Bereitstellung: Vor der Veröffentlichung sollten Bilder optimiert, Metadaten entfernt und Caching genutzt werden. CDN-Verteilung, progressive Rendering und korrekte Dateigrößen helfen beim Seitenaufbau und der Nutzererfahrung.

Rechtliches/Standards: Nutzungsrechte beachten; lizenzierte oder eigene Grafiken entsprechend kennzeichnen. Im Web gelten Standards wie das HTML-Element img oder picture, sowie Web-APIs für responsive Bilder und optimierte Ladeverhalten.