Legen Sie fest, was jedes Foto vermitteln muss
Stellen Sie sich ein Keramikstudio vor, das einen Katalog handgefertigter Tassen vorbereitet. Eine Karte in der Kollektionsübersicht macht die Form erkennbar; die Produktseite zeigt Henkel, Rand und Glasur. Halten Sie diese Zwecke im Fotobriefing fest. Eine eindrucksvolle Tischszene passt vielleicht zur Kollektion, lässt die einzelne Tasse aber schwer beurteilen.
MDN unterscheidet zwischen einer veränderten Bildauflösung und einem anderen Ausschnitt für ein Layout. Geben Sie für jede Platzierung im Studiokatalog den Bildausschnitt der Tasse frei. Prüfen Sie, ob der Henkel sichtbar bleibt und ein enger Ausschnitt nicht fälschlich das vollständige Produkt suggeriert. Separate Detailfotos können Fragen beantworten, die ein engerer Ausschnitt offenlässt.
Vereinbaren Sie, wie aus einem Original mehrere nützliche Dateien entstehen
Web.dev erklärt, wie srcset und sizes Browsern anhand von Darstellungsinformationen bei der Dateiauswahl helfen. Lassen Sie sich zeigen, welche Datei eine Katalogkarte tatsächlich auf dem Smartphone herunterlädt. Ein klein dargestelltes Bild belegt noch nicht, dass die ausgelieferte Datei angemessen dimensioniert ist.
Bewahren Sie das freigegebene Original auf und dokumentieren Sie die Erstellung der Websiteversionen. Automatische Größenanpassung reduziert Routinearbeit. Manuelle Exporte geben der Redaktion direkte Kontrolle, erfordern bei jeder Fotoänderung aber zusätzliche Schritte. Vereinbaren Sie, wer feine Glasurdetails nach der Verarbeitung prüft. Vergleichen Sie Varianten in der vorgesehenen Darstellungsgröße, bevor Sie die Veröffentlichungsversion wählen.
Halten Sie den Katalog beim Laden stabil
Web.dev empfiehlt Bildabmessungen oder reservierten Platz im passenden Seitenverhältnis, damit Bilder keine Layoutverschiebungen verursachen. Beobachten Sie im Keramikkatalog eine Kartenreihe, während Fotos laden. Produktnamen und Links sollten gut verfolgbar bleiben, statt an andere Stellen zu springen.
Einheitliche Kartenformen erleichtern den Vergleich, brauchen aber eine redaktionelle Regel für ungewöhnlich hohe oder breite Stücke. Entscheiden Sie, ob Sie das vollständige Objekt mit Freiraum zeigen oder eine andere Komposition vorbereiten. Testen Sie eine neu hinzugefügte hohe Vase neben den Tassen, bevor Sie die wiederverwendbare Vorlage freigeben.
Entscheiden Sie, welche Bilder warten können
Die Lazy-Loading-Empfehlungen von Web.dev sehen vor, Bilder außerhalb des sichtbaren Bereichs später und anfangs sichtbare Bilder sofort zu laden. Übertragen Sie diese Entscheidung auf das tatsächliche Kataloglayout. Die erste Produktansicht und eine lange Galerie weiter unten bedienen unterschiedliche Momente der Kaufentscheidung.
Prüfen Sie die Galerie beim Scrollen mit langsamerer Verbindung. Notieren Sie leere Ansichten, die einen sinnvollen Vergleich erschweren, und lassen Sie das Team die Ursache untersuchen. Alle zusätzlichen Fotos zu entfernen kann die Seite verkleinern, Kunden aber nötige Details für eine Anfrage vorenthalten. Behalten Sie Bilder, die jeweils eine eigene Frage beantworten.
Nutzen Sie die nächste Katalogaktualisierung als Probelauf
Lassen Sie die für die Katalogpflege zuständige Person anhand der Übergabeanleitung ein Tassenfoto ersetzen. Prüfen Sie die entstandene Seite gemeinsam und korrigieren Sie den Ablauf vor der nächsten Kollektion. Bewahren Sie bei den freigegebenen Beispielen eine kurze Checkliste auf.
- Prüfen Sie das vollständige Produkt und wichtige Details in Karten- und Produktansichten.
- Kontrollieren Sie ausgelieferte Dateien und übertragene Datenmengen bei repräsentativen Smartphone- und Desktoplayouts.
- Beobachten Sie den Katalog beim Laden und nach dem Hinzufügen eines ungewöhnlich geformten Produkts.
- Scrollen Sie durch die Galerie und prüfen Sie, ob jedes Foto nützliche Informationen ergänzt.
- Benennen Sie die verantwortliche Person für die Freigabe von Exporten, Ausschnitten und späteren Ersetzungen.