Cookies & Privacy Settings

Das Online-Shop-System TYRIOS erstellt vollautomatisch optimierte Bilder aus dem zur Verfügung gestellten Rohmaterial. Deshalb ist es ratsam, Bilder möglichst in hoher Auflösung in die Medienbibliothek zu laden. Heutige Serverkonfigurationen lassen es dabei in der Regel problemlos zu, Bilder direkt von der Digitalkamera Online zu stellen.

Bild-Bereitstellung

Um ein konsistentes Erscheinen über alle Produkte und Seiten zu gewährleisten, sind Standard-Größen im System hinterlegt. TYRIOS erstellt aus dem Rohmaterial in einem mehrstufigen Prozess Bilder für diese Standardgrößen. Hierbei wird festgelegt:

• wie hoch ein Bild sein soll
• wie breit ein Bild sein soll
• ob und welche Hintergrundfarbe verwendet werden soll, wenn die Höhe oder die Breite von der Vorgabe abweicht.

Ein Bild der Artikeldetailansicht hat so im Standarddesign eine Auflösung von 

• 800 Pixel Breite
• 600 Pixel Höhe
• #FFFFF (weiß) als Hintergrund

TYRIOS erstellt immer Bilder in dieser Größe. Wenn du größere Bilder in der Medienbibliothek hinterlegt hast, werden die Bilder entsprechend verkleinert. Dadurch entstehen keine Qualitätseinbußen, die Ladegeschwindigkeit wird aber deutlich erhöht. Ist das hinterlegte Bild jedoch kleiner, so muss es hochgerechnet werden. Dadurch entstehen unscharfe und verpixelte Bilder. Du solltest deshalb darauf achten, möglichst hochauflösende Bilder zu hinterlegen. Du siehsrt in der Medienverwaltung schlechte Bilder mit einem Ausrufezeichen versehen.

Bild-Optimierung im Editor

Im Editor hast du ebenfalls Zugriff auf die Medienbibliothek. Allerdings ist es dem System nicht automatisch möglich, Bilder in der optimalen Größe bereitzustellen, weil hier die Einsatzmöglichkeiten nicht vorab bekannt sind. Du kannst aber optimal berechnete Bilder selbst festlegen. 

Mit der Auswahl eines Bildes aus der Medienbilbliothek wird automatisch die URL zum Anzeigen des Bildes erzeugt. Diese URL hat folgenden Aufbau:

/media/[ID]-[Dateiname]-[Breite]-[Höhe]-[Version].png

 Du kannst die Höhe und Breite hier durch Veränderung der URL selbst festlegen. Dabei wird das Bild immer im Verhältnis zur tatsächlichen Höhe und Breite berechnet. Das berechnete Bild ist also maximal so wie gewünscht groß. Solltest du zusätzlich eine Hintergrundfarbe festlegen, dann ist das Bild exakt in der gewünschten Größe:

/media/[ID]-[Dateiname]-[Breite]-[Höhe]-[Farbe im HEX-Format]-[Version].png

Beachte insbesondere im Editor, dass du Bilder auf Wunsch responsiv einbinden kannst. Verwende hierzu die CSS-Klasse "img-responsive", damit sich das Bild automatisch an die verfügbare Breite anpasst.