Sehen Sie sich unsere Kundenstimmen an HTML5-Vorlage

Der Block „Das sagen unsere Kunden“ gliedert Kundenstimmen in eine klare interne Hierarchie. Eine Abschnittsüberschrift führt das Feedback ein, gefolgt von einem zentrierten Karussell mit zwei wiederholten Folien. Innerhalb jeder Folie steht ein kreisförmiges Porträt über einem Zitatabsatz und dem Kundennamen. Vor- und Zurück-Bedienelemente sowie zwei Indikatoren unterstützen das Zusammenspiel des Karussells, anstatt eigenständige Inhaltsbereiche zu bilden. Der hellgraue Hintergrund, die zentrierte schwarze Typografie, orangefarbene Akzente, großzügige Abstände und der Bildnachweis unterhalb der Interaktion runden die interne Struktur des Blocks ab. Es handelt sich um einen wiederverwendbaren Abschnitt mit einer definierten Inhaltsreihenfolge.

Überschrift, wiederholte Folien und Bedienelemente bilden die interne Hierarchie

Die interne Organisation des Blocks beginnt mit der Überschrift „Das sagen unsere Kunden“, die den Zweck des Abschnitts benennt, bevor der Karussellinhalt erscheint. Die Hauptinhaltsgruppe wiederholt sich anschließend über zwei Kundenstimmen-Folien. Jede Folie bewahrt dieselbe verschachtelte Beziehung: Ein kreisförmiges Porträt dient als visueller Identifikator, ein Zitatabsatz transportiert das Feedback und ein Kundenname nennt die sprechende Person. Diese drei Elemente als eine sich wiederholende Einheit zu betrachten, ist entscheidend für das Verständnis der Blockstruktur.

Die Vor- und Zurück-Bedienelemente gehören zur Karussell-Interaktion, während die beiden Indikatoren einen separaten Positionshinweis für dieselbe Folienabfolge liefern. Sie ersetzen die Testimonial-Inhalte nicht, sondern helfen Besuchern zu verstehen, wie auf die beiden wiederholten Gruppen zugegriffen wird. Das zentrierte einspaltige Layout sorgt dafür, dass Überschrift, aktive Folie und Steuerelemente entlang eines vertikalen Lesepfads ausgerichtet bleiben.

Der hellgraue Hintergrund und die orangefarbenen Akzentrahmen unterstützen die Gruppierung visuell, während die zentrierte schwarze Typografie dem Text eine einheitliche Hierarchie verleiht. Großzügige vertikale Abstände trennen das Porträt von Zitat und Name, sodass die verschachtelten Beziehungen nicht zu einem dichten Cluster verschwimmen. Unterhalb des Karussells erscheint der Nachweis „Bild von Freepik“ als zusätzliches Textelement des Blocks. Diese HTML5-orientierte Betrachtung bezieht sich daher auf die Organisation innerhalb dieses Abschnitts und nicht auf die Gesamthierarchie einer Seite.

Mit Nicepage anpassen

Wenn Sie HTML5 Template Builder verwenden, können Sie Farben, Schriftarten, Kopf- und Fußzeilen, Layout, Spalten und andere Designelemente sowie Inhalte und Bilder anpassen.

Herunterladen

Vorlage offline bearbeiten

1. Laden Sie die Nicepage-Anwendung für Windows und Mac herunter und installieren Sie sie. Oder WordPress- und Joomla-Plugins von Download-Seite
2. Erstellen Sie eine neue Seite oder wählen Sie eine vorhandene aus
3. Klicken Sie auf Neuen Block hinzufügen, suchen Sie nach der ID 1168427 und klicken Sie auf die Eingabetaste

Vorlage online bearbeiten

Starten Sie Online-Baukasten diese Vorlage auf unserem Hosting

Erstellen Sie fantastische Websites

WordPress

Windows App

Joomla

Mac OS App

HTML5

Online

Kostenloser Nicepage Builder

Mehr als 15.000 Vorlagen

Einfaches Ziehen und Ablegen

Keine Codierung

Für Mobilgeräte geeignet

Schlüsselwörter

Erkunden Sie die Struktur dieser HTML5-Vorlage

Navigieren Sie durch die Seitenstruktur

Passen Sie diese vorgefertigte HTML5-Vorlage im Nicepage-Editor visuell an und behalten Sie dabei die Übersichtlichkeit der Seitenstruktur bei. Nutzen Sie das Ebenen-Panel, um die Hierarchie von Kopfzeile, Blöcken, Containern, Elementen und Fußzeile anzuzeigen, zwischen verschiedenen Seitenbereichen zu navigieren und Elemente im Layout schnell auszuwählen.

Das Ebenen-Panel bietet außerdem praktische Steuerelemente für die Arbeit mit komplexeren Seiten. Blöcke, Container und Elemente können zur besseren Identifizierung umbenannt, während der Bearbeitung vorübergehend ausgeblendet oder gesperrt werden, um versehentliche Änderungen zu verhindern. Die Gliederung zeigt auch die interne Struktur von Elementen wie Menüs und Kontaktformularen an.

Arbeiten Sie mit organisierten Seitenabschnitten

Blöcke unterteilen die Seite in Hauptinhaltsabschnitte, während Container und Elemente den Inhalt innerhalb dieser Abschnitte organisieren. Durch die sichtbare Hierarchie wird das Verständnis der Zusammenhänge zwischen den einzelnen Seitenteilen erleichtert, insbesondere bei Layouts mit vielen verschachtelten Elementen.

Sie können das Ebenen-Bedienfeld verwenden, um durch diese Struktur zu navigieren, anstatt alles direkt auf der Arbeitsfläche auszuwählen. Dadurch lassen sich komplexe Layouts als übersichtliche Seitenhierarchie leichter überprüfen und verwalten.

HTML überprüfen und erweitern

Nach der visuellen Anpassung der Seite kann der resultierende HTML-Code überprüft und bei Bedarf angepasst werden. Benötigt ein Projekt zusätzliches Markup oder Funktionen, die über die Standardseitenelemente hinausgehen, verwenden Sie das HTML-Element, um gezielten benutzerdefinierten HTML-Code hinzuzufügen.

Dieser Workflow kombiniert visuelle Bearbeitung mit einer übersichtlichen Darstellung der Seitenhierarchie. Dadurch eignet sich die Vorlage sowohl als fertiges Design als auch als HTML5-Projekt, dessen Struktur überprüft, verwaltet, angepasst und erweitert werden kann.