Sammlung HTML-Vorlagen

Katalogverlage, Kuratoren, Einzelhändler und visuelle Marken können Artikelgruppen präsentieren, ohne die Seitenabschnitte von Grund auf neu erstellen zu müssen. Vorgefertigte HTML-Layouts sorgen dafür, dass Kollektionskarten, Beschreibungen, Bilder und zugehörige Abschnitte in responsiven Ansichten übersichtlich strukturiert bleiben.

Andere Mode & Schönheit HTML-Vorlagen

Übersichtliche HTML-Vorlagen für Kollektionen – Exportieren und weiterbearbeiten

Ein Geschäft mit vierzig Keramikstücken und ein Archiv mit mehreren hundert Drucken stehen vor demselben Problem: Das zehnte Stück muss genauso gut aussehen wie das erste. HTML-Vorlagen für Kollektionen sind vorgefertigte Designs für Kataloge, Galerien oder Archive. Die HTML-Bezeichnung gibt an, wo das Projekt letztendlich landet. Nicepage exportiert es als statische Website. So wird die visuell angeordnete Kollektion zu HTML-, CSS- und JavaScript-Code, den Sie hosten oder im Code weiter bearbeiten können.

Was eine exportierte Galerie enthält

Der Export funktioniert sowohl aus den Nicepage-Anwendungen als auch aus dem Online-Editor. Das Ergebnis hängt also nicht davon ab, mit welcher Anwendung Sie gearbeitet haben. Ordner- und FTP-Exporte sind in den Anwendungen integriert, was wichtig ist, wenn der Veröffentlichungsweg bereits festgelegt ist. Die Anleitung zum Exportieren von HTML-Websites beschreibt die verfügbaren Modi.

Eine aus Nicepage exportierte Kollektionswebsite enthält:

  1. Das Markup jeder erstellten Seite, inklusive des Kollektionsindex;

  2. Das Stylesheet und die Skripte, auf denen das Design basiert;

  3. Die Bilder für Produktfotos, Lookbook-Seiten und Archivscans.

Alles davon wird auf einem herkömmlichen statischen Webserver gehostet, und derselbe Ordner kann einem Entwickler, der an einem größeren Projekt arbeitet, zur Verfügung gestellt werden.

Rasterzellen auf schmalen Bildschirmen

Kollektionslayouts platzieren mehrere Bilder nebeneinander auf einem breiten Bildschirm. Das Rasterelement hält sie in Zellen, die sich bei schmaleren Bildschirmen stapeln. Für eine Katalogseite ist dieses Verhalten besonders wichtig, da eine lange Liste ähnlicher Objekte die erste Schwachstelle eines Designs darstellt.

Bei kleineren Bildschirmbreiten erfordern oft dieselben Stellen Aufmerksamkeit:

  1. Artikelnamen, die länger als der Demotext sind und dadurch eine Karte öffnen;

  2. Bildunterschriften, die sich vom zugehörigen Bild entfernen;

  3. Galerien mit mehr Spalten, als der Bildschirm darstellen kann.

Layouts für Produktlinien und Kunstserien

Nicht alle Kollektionen benötigen dasselbe Seitenlayout. Eine Produktlinie wirkt übersichtlich als übersichtliches Raster mit Artikeln, Preisen und Kurzbeschreibungen, während ein Archiv Platz für Bildunterschriften und Referenznummern neben jedem Scan benötigt. Der Demo-Inhalt gibt Aufschluss über das zugrundeliegende Layout.

Fotos in einer Kollektion haben selten das gleiche Format, und das entscheidet meist darüber, ob eine Vorlage beim Austausch funktioniert. Produktfotos werden in der Regel auf ein bestimmtes Seitenverhältnis zugeschnitten geliefert; Grafiken und Archivscans hingegen selten. Am schnellsten testen Sie das, indem Sie einen Abschnitt mit Ihren eigenen Bildern und Artikelnamen erstellen, insbesondere einen mit einem doppelt so langen Namen wie im Demo-Abschnitt. Was auch immer das Design dort bewirkt, es wird sich im gesamten Katalog auswirken.