Spiegel HTML-Vorlagen

Nützliche Spiegel-HTML-Vorlagen

Große Spiegelfotografien können eine Seite leicht dominieren, sodass Abmessungen, Oberflächen und Montagehinweise schwer zu erfassen sind. Spiegel-HTML-Vorlagen bieten Ihnen programmierte Seiten, auf denen Produktfoto und Datenblatt meist in separaten Blöcken liegen – bereit zur Wiederverwendung für das nächste Modell. Die meisten Anpassungen erfolgen visuell in Nicepage, und Sie können die exportierten HTML-Dateien auf Ihr eigenes Hosting hochladen oder an Entwickler weitergeben, die mit dem Quellcode arbeiten.

Von der Galerie zum Anfrageformular

Kundinnen und Kunden bewundern einen Spiegel vielleicht zunächst, doch die Kaufentscheidung hängt oft von Maßen, Montageanforderungen oder Sonderanfertigungen ab. Daher lassen sich die Blöcke einer Spiegel-Produktseite am besten in dieser Reihenfolge anordnen:

1. Eine Galerie mit mehreren Ansichten desselben Spiegels.
2. Eine Liste technischer Daten oder eine kompakte Tabelle mit Breite, Höhe und Rahmenoberfläche.
3. Ein Optionsblock für Maßanfertigungen mit einem kurzen Montagehinweis darunter.
4. Ein Anfrageformular nah genug an den Spezifikationen, damit niemand zurückscrollen muss, um die Zahlen zu finden.

Auf dem Smartphone werden diese Blöcke untereinander gestapelt, sodass die Maße weiterhin oberhalb des Formulars stehen sollten. Auch der Alt-Text erfordert Aufmerksamkeit, denn ein Spiegelfoto zeigt immer das, was das Glas reflektiert. Er sollte den Rahmen und die Form benennen, da ein Hinweis auf den gespiegelten Raum für Screenreader-Nutzer keinen Mehrwert bietet.

Anpassungen nach Tiefe gegliedert

Sobald diese Reihenfolge für ein Produkt funktioniert, lassen sich spätere Bearbeitungen in vier Gruppen unterteilen – von der schnellsten bis zur tiefgreifendsten:

1. Austauschen von Fotos und Datenzeilen innerhalb eines bestehenden Blocks.
2. Duplizieren des Blocks für Schmink-, Wand- oder Ganzkörperspiegel.
3. Umbenennen von Formularfeldern für Breite, Form und Montageanfragen.
4. Hinzufügen von individuellem Code nach dem Export, etwa eines Preisrechners für Glas nach Maß.

Die Nicepage-Dokumentation zur Verwendung von Seitenelementen erklärt, wie Elemente innerhalb von Blöcken hinzugefügt, bearbeitet und verschoben werden können. Alles, was auf diese Weise geändert wird, landet im exportierten Markup, sodass für die ersten drei Gruppen keine Datei geöffnet werden muss. Der Quellcode erfordert nur dann die Aufmerksamkeit von Entwicklern, wenn eine Funktion über das Layout hinausgeht, wie etwa dieser Rechner.

Was Entwickler übernehmen

Nach dem Export bleiben die HTML-Dateien für direkte Bearbeitungen offen, was bei wachsendem Sortiment wichtig ist. Ein Shop für Dekorationsspiegel wiederholt meist dieselbe Produktkarte, sodass Entwickler darauf angewiesen sind, dass sich jedes Duplikat wie das Original verhält. Layouts für Sondermaße sind anspruchsvoller, da Galerie, Spezifikationstabelle und Anfrageformular um denselben Platz auf dem Bildschirm konkurrieren. Demo-Inhalte zeigen selten, wie der Bildschirm mit echten Daten zurechtkommt. Füllen Sie diese Tabelle mit allem, was ein beleuchteter Spiegel benötigt, einschließlich Wattzahl und Farbtemperatur. Wenn die Blöcke ohne eine einzige Codeänderung in der richtigen Reihenfolge bleiben, bewährt sich diese Vorlage auch für die nächste Kategorie.