Erfolgreich
Header-Einstellungen
Passen Sie Überschriften, unterstützenden Text, Symbole und Schaltflächen für klarere Seiten-Einleitungen und Aktionen an.
Verwenden Sie diese Einstellungen, um einen klaren Einstieg für Inhaltsbereiche im Theme zu erstellen. Ein gut strukturierter Header hilft Besuchern zu verstehen, was als Nächstes kommt, verbessert das Scannen und gibt wichtigen Inhalten einen stärkeren visuellen und semantischen Einstieg. Einen umfassenderen Überblick darüber, wie Theme-Inhalte organisiert sind, finden Sie in der Shopify-Dokumentation zu Abschnitten und Blöcken
Header-Inhalte
Abschnitt betitelt „Header-Inhalte“Diese Gruppe steuert den Textstapel oben in einem Inhaltsbereich: Ausrichtung, ein optionales Icon, eine Beschriftung, die Hauptüberschrift und unterstützenden Text. Die stärksten Header bleiben in der Regel fokussiert, wobei jedes Element eine eigene Aufgabe erfüllt, statt dieselbe Botschaft zu wiederholen.
Wählen Sie die Textausrichtung basierend auf dem Inhaltstil um sie herum. Zentrierte Ausrichtung eignet sich für Werbe- oder redaktionelle Layouts, während linke Ausrichtung in der Regel leichter zu lesen ist, wenn Sie längeren unterstützenden Text einfügen.
Das Icon-Feld akzeptiert entweder ein Emoji oder einen Icon-Namen. Verwenden Sie es, wenn ein schneller visueller Hinweis die Botschaft unterstützt, etwa bei einer hervorgehobenen Funktion oder einer thematischen Inhaltsbeschriftung. Wenn es eher dekorativ als informativ wirkt, lassen Sie es für ein klareres Ergebnis leer. Hinweise zur Benennung von Icons finden Sie unter Icons.
Verwenden Sie die Beschriftung der Überschrift als kurzes Label über der Hauptüberschrift. Sie eignet sich am besten für kurzen Kontext, etwa eine Kategorie, Kampagne oder ein Inhaltsthema.
Die Hauptüberschrift sollte die primäre Botschaft tragen. Halten Sie sie spezifisch und beschreibend, damit sie sowohl Besuchern als auch der Seitenstruktur hilft. Mit dem Überschriftentyp können Sie festlegen, wie prominent und strukturell diese Überschrift sein soll.
Wählen Sie Überschriftenebenen basierend auf der Seitenstruktur und nicht nur auf dem Erscheinungsbild. Reservieren Sie die Überschriften der höchsten Ebene für die wichtigsten Titel, damit die Seite gut organisiert bleibt.
Verwenden Sie die Unterüberschrift für kurzen unterstützenden Kontext, eine Wertbotschaft oder eine kurze Erklärung. Wenn die Überschrift bereits genug sagt, funktioniert eine knappe Unterüberschrift in der Regel besser als ein langer Absatz.
Schaltflächenaktion
Abschnitt betitelt „Schaltflächenaktion“Sie können eine optionale Schaltfläche hinzufügen, wenn der Header auf einen klaren nächsten Schritt hinführen soll. Das ist nützlich, wenn der Inhalt etwas Handlungsorientiertes einführt, etwa das Durchsuchen, Mehr erfahren oder das Öffnen eines hervorgehobenen Ziels. Einzelheiten zur Einrichtung im Editor finden Sie in der Shopify-Dokumentation zum Theme-Editor
Fügen Sie Schaltflächentext und Link zusammen hinzu, damit die Aktion vollständig und klar wirkt. Wenn Sie ein Schaltflächensymbol einfügen, sollte es das Label unterstützen und nicht ersetzen. Das Icon-Feld akzeptiert Emojis oder Icon-Namen; Hinweise zur Benennung finden Sie unter Icons.
Der Schaltflächenstil steuert, wie viel visuelles Gewicht die Aktion erhält. Stärkere Stile eignen sich gut, wenn die Schaltfläche der wichtigste nächste Schritt ist, während leichtere Stile helfen, den Fokus auf den Inhalt zu halten.
Das Schaltflächenlayout steuert, ob das Icon neben dem Label oder allein angezeigt wird. Schaltflächen nur mit Icon sollten am besten für Fälle verwendet werden, in denen die Aktion aus dem umgebenden Kontext eindeutig hervorgeht.
Sie können die Schaltfläche oberhalb oder unterhalb des Textinhalts platzieren, bei Bedarf mit einer separaten Position für Mobilgeräte. So lässt sich das Desktop-Layout leichter ausgewogen halten, während mobilen Besuchern dennoch ein flüssigerer Lesefluss geboten wird.
Aktivieren Sie die Option für eine mobile Schaltfläche in voller Breite, wenn die Aktion auf kleineren Bildschirmen deutlicher hervorstechen soll. Das ist besonders nützlich, wenn das Tippen auf die Schaltfläche das Hauptziel ist.
Das Öffnen eines Links in einem neuen Tab ist in der Regel am besten für externe Ziele oder Fälle, in denen Sie nicht möchten, dass Besucher ihre Position verlieren. Für die normale Navigation fühlt sich das Verbleiben im selben Tab oft natürlicher an.
Nutzungshinweise
Abschnitt betitelt „Nutzungshinweise“- Halten Sie die Botschaft fokussiert. Verwenden Sie Überschrift, Beschriftung und Unterüberschrift zusammen, um eine klare Idee einzuführen, statt denselben Text in mehreren Feldern zu wiederholen.
- Passen Sie die Hierarchie an die Wichtigkeit an. Wählen Sie einen Überschriftentyp, der zur Seitenstruktur passt, damit wichtige Inhalte hervorgehoben werden, ohne die gesamte Überschriftenreihenfolge zu schwächen.
- Verwenden Sie Icons gezielt. Fügen Sie Icons nur hinzu, wenn sie Besuchern helfen, den Inhalt oder die Aktion schneller zu erkennen.
- Machen Sie Schaltflächenaktionen ausdrücklich. Kombinieren Sie klaren Schaltflächentext mit einem passenden Link und vermeiden Sie es, sich nur auf ein Icon zu verlassen, es sei denn, die Aktion ist offensichtlich.
- Prüfen Sie die mobile Darstellung. Überprüfen Sie Ausrichtung, Schaltflächenposition und Vollbreitenverhalten auf kleineren Bildschirmen, damit der Header gut lesbar bleibt und sich leicht antippen lässt.
- Prüfen Sie beide Ansichtsfenster-Layouts. Wenn Sie separate Desktop- und Mobil-Steuerelemente verwenden, überprüfen Sie beide Größen, damit Ausrichtung, Sichtbarkeit und Medienverhalten weiterhin beabsichtigt wirken.
- Halten Sie Überschreibungen sinnvoll. Lassen Sie Werte im Standardstil unverändert, wenn der Header sich in den umgebenden Bereich einfügen soll; verwenden Sie explizite Farben oder Medien nur dann, wenn sich der Header deutlich abheben soll.