Optimieren von Bildern mit Dynamic Media mit OpenAPI-Funktionen Optimize-images-using-Dynamic-Media-with-OpenAPI-Capabilities
Dynamic Media with OpenAPI capabilities bietet Bildoptimierungsfunktionen wie Smart Crop, Image Presets und Smart Imaging. Mit diesen Funktionen können Sie hochqualitative, responsive Bilder bereitstellen, die auf verschiedenen Geräten und Netzwerken schnell geladen werden.
Intelligenter Zuschnitt smart-crop-using-dynamic-media-with-openapi-capabilities
Smartes Zuschneiden ist eine dynamische Größenänderungsfunktion von Dynamic Media with OpenAPI capabilities. Smart Crop ist eine fortschrittliche Bildverarbeitungstechnik, die KI-gestütztes inhaltsorientiertes Zuschneiden verwendet, um Bilder für verschiedene Bildschirmgrößen intelligent zuzuschneiden, während der visuelle Kontext in zugeschnittenen Versionen erhalten bleibt. Die KI analysiert das Bild, um den Fokus oder den Zielpunkt zu identifizieren, und schneidet dann das Bild automatisch zu, um den Fokus in allen zugeschnittenen Versionen beizubehalten. Smart Crop, ein Schlüsselelement des responsiven Designs, bietet eine kostengünstige und zeiteffiziente Möglichkeit, Bilder zuzuschneiden.
Im Artikel Dynamic Media-Bildprofile erfahren Sie, wie Sie Ausgabedarstellungen für smartes Zuschneiden erstellen in Admin View, sie auf Ordner anwenden oder Ausgabedarstellungen bearbeiten die bereits auf ein Bild oder einen Ordner angewendet wurden. In diesem Video erfahren Sie, wie Sie Schritt für Schritt einen Smart Crop erstellen.
Der Smart Crop Parameter erwartet, dass „named-smartcut-profiles“ vorhanden sind und auf das Asset angewendet wurden. Weitere Informationen Parameter "" und Smart Crop Anwendung von Profilen mit Smart Crop Namen finden Sie unter „Smartes Zuschneiden“.
Bildvorgaben image-presets-using-dynamic-media-with-openapi-capabilities
So wandeln Sie Bilder mithilfe der Bildvorgaben in Dynamic Media with OpenAPI capabilities um. Ein image preset ist ein vordefinierter Satz von Größenangaben und Formatierungsregeln für ein Ausgabebild.
Dynamic Media with OpenAPI capabilities verwendet Vorgabennamen, um ein Bild dynamisch zu transformieren und sofort seine Ausgabedarstellung zu generieren. Wenn Sie ein Bild über eine Dynamic Media with OpenAPI Versand-URL anfordern, die einen vordefinierten Parameter enthält, wendet DM with OpenAPI die Transformationen der Vorgabe an, erstellt die Ausgabedarstellung bei Bedarf und stellt sie dem Benutzer bereit.
Sie können eine einzelne Vorgabe über die Dynamic Media with OpenAPI Versand-URLs auf mehrere Bilder anwenden. Dadurch wird eine konsistente Formatierung aller Assets sichergestellt, ohne dass jedes Asset manuell bearbeitet werden muss.
Weitere Informationen Erstellen von Bildvorgaben in der Admin-) und „Erstellen responsiven Bildvorgaben“, Assets automatisch an unterschiedliche Bildschirmgrößen , finden Sie unter „Verwalten Bildvorgaben .
Vorteile der Verwendung von Bildvorgaben benefits-of-image-presets
Image Presets bieten mehrere Vorteile für die Verwaltung und Bereitstellung von Bildern in Dynamic Media with OpenAPI. Zu den wichtigsten Vorteilen gehören die folgenden:
- Voreinstellungen verkürzen URLs zur Bildbereitstellung. Verwenden Sie eine einzige Vorgabe, anstatt mehrere Bildmodifikatoren hinzuzufügen, die die Versand-URL verlängern. Kürzere URLs sind einfacher zu verwalten und stellen eine konsistente Bildbereitstellung über Websites, Mobile Apps, E-Mails und andere Kanäle hinweg sicher.
- Bildvorgaben erstellen Just-in-time-Ausgabedarstellungen aus einer Quellbilddatei. Durch diese Funktion zur Erzeugung von Ausgabedarstellungen auf Anfrage entfällt die Notwendigkeit, mehrere statische Ausgabedarstellungen derselben Datei zu erstellen und zu speichern, was Zeit und Speicher spart.
- Gleichzeitiges Anwenden einer einzelnen Vorgabe auf eine große Anzahl von Assets, Vermeidung manueller Bearbeitungen an jedem Asset einzeln, Sicherstellung einer konsistenten Formatierung und Ermöglichung von Skalierbarkeit.
- Wenn Sie die Parameter einer Vorgabe aktualisieren, werden alle Bilder, die diese Vorgabe verwenden, automatisch neu formatiert. Dadurch wird die Bearbeitung durch Zentralisierung von Formatierungsaktualisierungen optimiert, sodass einzelne Assets oder Web-Code nicht mehr neu bearbeitet werden müssen.
- Verbessert Effizienz und Leistung mit dynamischen Ausgabedarstellungen, die vom CDN zwischengespeichert werden, was zu schnellerem Laden und optimierter Leistung auf allen Geräten und Netzwerken führt.
Verwenden von Bildvorgaben use-image-presets-using-dynamic-media-with-openapi-capabilities
Nachdem Sie die Image Presets erstellt haben, können Sie sie für die folgenden Workflows verwenden:
Verwenden von Vorgaben in Bildbereitstellungs-URLs use-presets-in-delivery-urls
Voreinstellungen machen Ihre Versand-URLs kürzer und benutzerfreundlicher. Jeder Vorgabenname dient als eindeutige Kennung in der Versand-URL. Anstatt der Bereitstellungs-URL eines Assets mehrere Modifikatoren hinzuzufügen, verweisen Sie auf den Vorgabennamen, um die Ausgabedarstellung sofort zu generieren. Erfahren Sie, wie Sie Dynamic Media-Bildvorgaben auf Ihr Bild anwenden.
Im folgenden Beispiel wird eine URL mit einer Voreinstellung mit einer URL ohne Voreinstellung verglichen.
URL ohne Voreinstellung (lange URL):
https://delivery-p30902-e145436-cmstg.adobeaemcloud.com/adobe/assets/urn:aaid:aem:393d5579-5be2-49a5-ac5f-8fed72bfb614/as/AdobeStock_63266433.avif?width=400&height=300&fit=crop&qualit=85&sharpen=true
URL mit einer Voreinstellung (kurze URL):
https://delivery-p30902-e145436-cmstg.adobeaemcloud.com/adobe/assets/urn:aaid:aem:393d5579-5be2-49a5-ac5f-8fed72bfb614/as/AdobeStock_63266433.avif?preset=thumbnail
Die vordefinierte Miniaturansicht enthält die gleichen Bildmodifikatoreinstellungen.
Verwenden von Vorgaben beim Authoring in AEM Sites use-presets-during-authoring-in-aem-sites
Autoren können während der Seitenbearbeitung auf Image Presets Authoring-Seite AEM Sites auswählen, wenn Dynamic Media Unterstützung aktiviert ist.
Führen Sie die folgenden Schritte aus, um Bildvorgaben auf Ihrer Authoring-Seite zu verwenden:
- Navigieren Sie zu Ihrer Sites-Authoring-Seite.
- Führen Sie die Schritte im Abschnitt Zugriff auf Remote-Assets im AEMSeiteneditor aus, um das Asset Selector-Bedienfeld zur Auswahl eines Assets zu verwenden.
- Scrollen Sie im asset selector nach unten zu Vorgabetyp und geben Sie
Preset=Preset Nameim Feld Bildmodifikatoren an und klicken Sie auf Fertig.
Intelligente Bildbearbeitung use-smart-imaging-using-dynamic-media-with-openapi-capabilities
Wenn Sie Dynamic Media with OpenAPI capabilities für die Bildbereitstellung verwenden, werden Bilder automatisch durch intelligente Bildbearbeitung optimiert. Die optimierte Bereitstellung stellt sicher, dass Bilder schneller geladen werden, eine maximale visuelle Qualität aufweisen und eine minimale Dateigröße aufweisen. Dies führt zu schnellsten Seitenladevorgängen und einer konsistent hohen visuellen Qualität auf allen Geräten und in allen Netzwerken. Gleichzeitig wird nur minimale Bandbreite beansprucht, was Ihre Website schneller und reaktionsfähiger macht.
Smart Imaging umfasst die folgenden Funktionen:
Automatische Formatkonvertierung auto-format-conversion
Dynamic Media with OpenAPI konvertiert Bilder automatisch in moderne, Web-optimierte Formate wie AVIF oder WEBP. Die Konvertierung hängt von den Browserfunktionen und Lizenzberechtigungen ab, unabhängig vom angeforderten Format.
AVIF- und WEBP-Formate bieten eine bessere Komprimierung, sodass Bilder kleiner und schneller bereitgestellt und geladen werden können. AVIF wird als Standardformat verwendet, da es alle Browser-Funktionen verarbeitet.
Dynamic Media with OpenAPI verwendet den auto-format Abfrageparameter, um das Verhalten des Browsers zur Konvertierung eines Bildes in verschiedene Formate für eine optimierte Bereitstellung zu steuern. Die automatische Formatkonvertierung umfasst automatische Promotion und automatische. Wenn das System ein Web-optimiertes Format (AVIF oder WEBP) über JPEG oder PNG für die Bereitstellung fördert, wird dies als automatische Promotion bezeichnet.
Standardmäßig ist der auto-format Abfrageparameter auf true festgelegt. Wenn auto-format aktiviert ist (true), ignoriert das System das angeforderte Format und wählt automatisch ein Web-optimiertes Format (AVIF oder WEBP) basierend auf Bildeigenschaften, Browser-Funktionen und Lizenzberechtigungen aus.
Wenn auto-format „true“ ist, liefert das System das Bildformat in der folgenden Reihenfolge:
- AVIF: AVIF wird bereitgestellt, wenn der Browser dies unterstützt und die Lizenz dies zulässt. Dies wird als automatische Promotion bezeichnet.
- WEBP: WEBP wird bereitgestellt, wenn AVIF nicht unterstützt oder lizenziert wird. Dies ist auch eine automatische Promotion.
- JPEG: JPEG wird nur bereitgestellt, wenn AVIF und WEBP nicht unterstützt werden und das Bild keinen Alphakanal aufweist (Transparenz). Dies wird als automatische Herabstufung bezeichnet.
- PNG: PNG wird bereitgestellt, wenn der Browser moderne Formate nicht unterstützt und das Bild einen Alphakanal (Transparenz) aufweist. Dies wird auch als automatische Herabstufung bezeichnet.
Deaktivieren Sie auto-format, indem Sie den Abfrageparameter auf false setzen, und geben Sie dann das erforderliche Format an, um das Bild in diesem Format bereitzustellen.
Optimierung der Netzwerkbandbreite network-bandwidth-optimisation
Bilder werden automatisch auf Basis der Netzwerkbedingungen des Kunden optimiert, um eine schnellere Bereitstellung und ein reibungsloses Laden zu gewährleisten. Die Parameter Qualität und Max-Qualität passen die Qualität automatisch an, indem sie die Bildkomprimierungsstufen mit Werten zwischen 1 und 100 steuern.
Siehe die folgenden Verhaltensweisen von quality- und max-quality:
- Wenn sowohl quality als auch max-quality angegeben sind, hat quality Vorrang.
- Wenn nur quality angegeben ist, wird die Qualität unabhängig von der Ladezeit basierend auf der Netzwerkgeschwindigkeit bereitgestellt.
- Wenn nur max-quality angegeben wird, passt sich die Bildqualität automatisch an die Netzwerkbedingungen an und liefert die bestmögliche Qualität bis zum angegebenen max-quality.
- Wenn keines von beiden angegeben ist, wendet das System die dynamische Optimierung mit dem
max-quality85an.
Qualitätsparameter quality-parameter
Der Qualitätsparameter priorisiert die Bildqualität vor der Ladegeschwindigkeit. Die Qualität des ausgegebenen Bildes wird auf den angeforderten Wert (zwischen 1 und 100) festgelegt und die Netzwerkbedingungen werden ignoriert. Erfahren Sie mehr über den Qualitätsparameter.
Parameter für maximale Qualität max-quality-parameter
Die maximale Qualität gleicht die Bildqualität und die Ladezeit basierend auf der Netzwerkgeschwindigkeit des Clients aus. Es priorisiert schnellere Ladezeiten, indem es die Bildqualität in langsameren Netzwerken senkt, während es dennoch die höchstmögliche Qualität (1-100) für die gegebenen Netzwerkbedingungen liefert. Weitere Informationen zum Parameter max-quality.