In unserer visuellen Wirtschaft dreht sich bei Websites und Anwendungen alles um Bilder. Der moderne visuelle Workflow, der mit dem routinemäßigen Hochladen dieser Bilder einhergeht, erfordert jedoch neue Fähigkeiten. Lass uns prüfen, ob du fit für diese visuelle Meisterschaft bist und die Bildoptimierung fürs Web beherrscht.

Der State of Visual Media (SoVM) Report 2021 hat Daten von mehr als 670 Kunden und eine repräsentative Auswahl von über 80 Milliarden Transaktionen pro Monat analysiert. Er zeigt, dass die meisten Marken bereits die gängigsten visuellen Transformationen und Automatisierungen nutzen. Werfen wir einen genaueren Blick auf ein paar Basics, die diese Unternehmen richtig machen:

Größenanpassung/ Seitenverhältnis

Das Seitenverhältnis eines Bildes ist das proportionale Verhältnis von Breite zu Höhe. Wenn deine Kampagnenbilder mit einem Seitenverhältnis von 16:9 aufgenommen wurden, aber mit einem Seitenverhältnis von 1:1 angezeigt werden, sehen sie verzerrt aus. Dann müssen sie in der Größe angepasst werden. Das ist wichtig, denn soziale Medien spielen bei den meisten Kampagnen heutzutage eine wichtige Rolle. Allerdings verwenden verschiedene Kanäle unterschiedliche Seitenverhältnisse: Instagram- und Facebook-Feeds nutzen das quadratische Format 1:1 beziehungsweise das vertikale Format 4:5. Instagram und Facebook „Storys“ hingegen verwenden das 9:16 Hochformat beziehungsweise das 2:3 Hochformat.

EXTRA: Bildgrößen für Social Media 2021: Instagram, Facebook, TikTok & Co.

Laut des SoVM Reports nutzen die meisten Unternehmen Transformationen zur Größenanpassung. Wenn du das auch tust, hast du einen der wichtigsten Aspekte der Bildoptimierung fürs Web richtig gemacht. Weiter so!

Die Balance zwischen Dateigröße und Qualität finden

Das ist vielleicht ein Punkt, den du mit deinen EntwicklerInnen besprechen musst.

In unserer visuellen Wirtschaft sind Bildqualität und schnelle Ladezeiten gleichermaßen wichtig.

Dabei kann es schwierig sein, die richtige Balance zu finden. Nimm etwa die Bildkomprimierung: Viele ProgrammiererInnen ziehen es vor, Bilder nicht zu stark zu komprimieren, weil sie befürchten, dass die Bildqualität darunter leidet. Sie neigen dazu, auf Nummer sicher zu gehen, indem sie höhere Qualitätswerte zuweisen, als wirklich nötig sind. Aber die Anpassung der Qualitätskomprimierung führt nicht immer zu einem Verlust an visueller Qualität. KI-basierte Tools können automatisch die optimale Dateigröße und visuelle Qualität für ein Bild bestimmen.

Auch diese wichtige Grundlage beherrschen die meisten Unternehmen. Wie sieht das bei dir aus?

Automatische Formatauswahl

Marken verwenden eine große Vielfalt an Bildformaten. Der SoVM hat gezeigt, dass die meisten Unternehmen drei (32 Prozent) oder vier (29 Prozent) verschiedene Bildformate nutzen. JPEG (95 Prozent) und PNG (73 Prozent) sind immer noch die führenden Bildformate, aber das neuere leichtgewichtige Format WebP (69 Prozent) holt schnell auf. Andere leichtgewichtige Formate wie JP2 (25 Prozent) oder HEIC (2 Prozent) werden ebenfalls langsam aber stetig angenommen.

EXTRA: 5 Bildformate für deine Website: Vor- und Nachteile im Überblick

Wichtig zu wissen ist, dass verschiedene Browser und Geräte nicht alle Bildformate unterstützen. Deshalb ist es wichtig, verschiedene Formate zu verwenden. Einige sind jedoch schwerer als andere und tragen daher zur Belastung deiner Seite bei, so dass sie schwerer und langsamer wird. Das gefällt den Core Web Vitals von Google, einer neuen Kennzahl, die seit diesem Sommer das Suchranking von Websites bei Google beeinflusst, überhaupt nicht. Deshalb solltest du immer das Format liefern, das den Anforderungen am besten entspricht. Oder, wenn dein Optimierungstool es zulässt, Bildformate automatisch in neuere, leichtgewichtigere Formate umwandeln.

Wenn du diese drei Grundlagen so weit beherrschst, bist du auf dem richtigen Weg zur visuellen Meisterschaft. Doch es gibt noch mehr, was du machen kannst.

Zuschneiden

Das Zuschneiden ist eine grundlegende Transformation, bei dem Teile eines Bildes entfernt werden, entweder um es an ein bestimmtes Seitenverhältnis anzupassen oder um einen bestimmten Bildbereich hervorzuheben. Bei den meisten Bildverwaltungsprogrammen passt sich ein Bild automatisch an den Rahmen an, in dem es sich befindet, es sei denn, du gibst etwas anderes an. Das kann dazu führen, dass die Bilder gestreckt oder geschrumpft aussehen. Deine Bilder werden auf vielen Browsern und Geräten angezeigt. Um sicherzustellen, dass sie überall gut aussehen, müssen deine EntwicklerInnen automatische Zuschneidefunktionen verwenden – das ist ein wichtiges Basic, das nicht fehlen darf.

Aber Zuschneiden kann noch mehr.

Fortschrittliche Bildmanagement-Tools nutzen KI, um die beliebtesten Bildmotive zu erkennen.

Bei einigen kannst du auch die Priorität „nicht zuschneiden“ für bestimmte Objekte festlegen, um sicherzustellen, dass die Motive sichtbar bleiben. Wenn du einen solchen intelligenten Zuschnitt verwendest, bei dem die erkannten Gesichter optimal im Bild platziert und angezeigt werden, dann Gratulation zur visuellen Meisterschaft!

EXTRA: Bilder für deinen Content: 7 Tipps & Tools [+Infografik]

Auto-Tagging

Wenn deine Website viele benutzergenerierte Inhalte hat, möchtest du wahrscheinlich verstehen, was auf den Bildern zu sehen ist, damit du sie den richtigen Zielgruppen zuordnen, sie durchsuchbar machen und das Engagement verbessern kannst. Bei einer großen Menge an Bildern würde das manuelle Taggen jedoch zu viel Zeit und Ressourcen in Anspruch nehmen. KI-basiertes Tagging, dass die Inhalte erkennt und entsprechend kategorisiert kann hier die Lösung sein. Glücklicherweise bieten Unternehmen wie Google, Amazon, Microsoft und andere KI-basiertes Auto-Tagging an. Wenn du ein solches Tool verwendest, profitierst du mit Sicherheit von der KI. Das Gleiche gilt auch für den nächsten Punkt.

Hintergrundentfernung

Heutzutage sind schlichte E-Commerce-Websites der Renner. Dazu gehören auch hochwertige Produktfotos. Um sie auf einem weißen, einfarbigen oder dynamischen Hintergrund zu platzieren, muss der Fotohintergrund zunächst transparent sein. Auch hier können KI-basierte Bildtransformationen helfen. Sie erkennen automatisch die wichtigsten Objekte im Bild, segmentieren sie, definieren, was Hintergrund und was Vordergrund ist, und welche Pixel entfernt beziehungsweise angezeigt werden sollen.

EXTRA: Künstliche Intelligenz im Unternehmen nutzen: 5 Schritte

Obwohl die Bildoptimierung es ein riesiges ungenutztes Potenzial bietet, ist es keine Überraschung, dass viele neue KI-basierte Funktionen nur langsam angenommen werden. Wir sind alle unglaublich beschäftigt und investieren oft zu wenig Zeit, uns mit solchen Innovationen zu befassen. Ich kann dich nur ermutigen, das Kind in dir zu finden und mit fortschrittlichen KI-gestützten visuellen Transformationen wie Auto-Tagging, Hintergrundentfernung und intelligentem Zuschneiden herumzuspielen. Du wirst sehen, das Ergebnis wird einen großen Unterschied für deine Website machen und sie in der visuell geprägten Welt hervorstechen lassen.