Erfolgreich
Farbeinstellungen
Legen Sie benutzerdefinierte Text-, Überschriften-, Rahmen- und Symbolfarben für einen bestimmten Theme-Bereich fest.
Verwenden Sie diese Einstellungen, um einem bestimmten Theme-Bereich eine eigene Vordergrundfarbgestaltung in der Shopify-Dokumentation zum Theme-Editor zu geben. Sie überschreiben umfassendere Theme-Farben, was nützlich ist, wenn ein hervorgehobener, werblicher oder inhaltsreicher Bereich besseren Kontrast oder ein passenderes Erscheinungsbild benötigt.
Eine allgemeine Referenz dazu, wie diese Überschreibungen funktionieren, finden Sie in der Referenz zu Farbeinstellungen.
Farbüberschreibungen
Abschnitt betitelt „Farbüberschreibungen“Diese Gruppe steuert die Farben für Rahmen, Symbole, Überschriften, Unterüberschriften und Fließtext. Anstatt die unternehmensweite Palette zu ändern, können Sie fein abstimmen, wie Inhalte in einem Bereich dargestellt werden, damit sie klarer, ausgewogener oder markanter wirken.
Verwenden Sie Überschreibungen, wenn sich der Hintergrund ändert, wenn eine Kampagne einen Markenakzent benötigt oder wenn Standardfarben nicht genug Abgrenzung zwischen Inhaltsebenen bieten. Wenn ein Bereich mit Ihrer Hauptpalette bereits gut lesbar ist, ist es in der Regel besser, diese Einstellungen unverändert zu lassen.
Diese Einstellungen überschreiben die umfassenderen Theme-Farbwahlmöglichkeiten für den Bereich, in dem sie angewendet werden. Verwenden Sie sie bewusst, damit benutzerdefinierte Bereiche absichtlich und nicht visuell abgekoppelt wirken.
Eine klare Texthierarchie aufbauen
Abschnitt betitelt „Eine klare Texthierarchie aufbauen“Überschriften-, Unterüberschriften- und Textfarben sollten zusammenarbeiten, um den Blick zu lenken. Verwenden Sie den stärksten Kontrast für den wichtigsten Text, eine verlässliche Farbe für den Fließtext und einen weicheren unterstützenden Ton für Unterüberschriften nur dann, wenn er gut lesbar bleibt.
Wenn alle Textfarben zu ähnlich sind, kann der Inhalt flach wirken. Wenn sie zu unterschiedlich sind, kann das Design unruhig wirken. Streben Sie eine einfache Hierarchie an, die über ähnliche Inhaltsbereiche hinweg konsistent bleibt.
Rahmen und Symbole sinnvoll einsetzen
Abschnitt betitelt „Rahmen und Symbole sinnvoll einsetzen“Rahmen und Symbole funktionieren in der Regel am besten als unterstützende Elemente. Rahmen können Inhalte trennen, Karten einrahmen oder Struktur hinzufügen, während Symbolfarben kleine Hinweise verstärken, ohne mit der Hauptbotschaft zu konkurrieren.
Wenn Symbole innerhalb umrandeter Formen erscheinen, stellen Sie sicher, dass die Symbolfarbe und die Symbolrahmenfarbe weiterhin harmonisch wirken. Ein dezenter Rahmen kann hochwertig aussehen, aber wenn er zu schwach ist, kann er vor dem Hintergrund verschwinden.
Lesbare Kombinationen wählen
Abschnitt betitelt „Lesbare Kombinationen wählen“Prüfen Sie Ihre Farbauswahl im Zusammenspiel, nicht nur eine Einstellung nach der anderen. Eine Überschriftenfarbe, die für sich genommen stark wirkt, passt möglicherweise nicht gut zu weicherem Unterüberschriftentext oder hellen Rahmenlinien, sobald der gesamte Bereich zusammengesetzt ist.
Achten Sie besonders auf den Kontrast bei kleinerem Text, dekorativen Symbolen und feinen Rahmen. Diese Elemente sind oft die ersten, die schwer zu erkennen sind, wenn die Farben zu hell oder zu kontrastarm sind.
Nutzungshinweise
Abschnitt betitelt „Nutzungshinweise“- Gezielt überschreiben. Verwenden Sie benutzerdefinierte Farben, wenn ein Bereich wirklich eine andere Vordergrunddarstellung benötigt, nicht nur zusätzliche Variation.
- Lesbarkeit schützen. Prüfen Sie Überschriften, Unterüberschriften, Text, Symbole und Rahmen vor dem tatsächlichen Hintergrund, der in diesem Bereich verwendet wird.
- Beide Viewports prüfen. Desktop- und Mobile-Steuerelemente können sich unterschiedlich verhalten. Bestätigen Sie daher Layout, Ausrichtung, Sichtbarkeit und Medienverhalten auf beiden Bildschirmgrößen.
- Fallback-Styling im Blick behalten. Leere, transparente oder standardmäßige Werte behalten in der Regel den umfassenderen Look bei, während explizite Farben, Verläufe oder Medienüberschreibungen den lokalen Bereich unabhängiger machen.
- Akzente als sekundär behandeln. Verwenden Sie Rahmen- und Symbolfarben, um Struktur und Hervorhebung zu unterstützen, ohne von den Inhalten abzulenken.
- Medienauswahl sorgfältig prüfen. Wenn Desktop- und Mobile-Medien getrennt konfiguriert werden, prüfen Sie Zuschneiden, Laden, Fallback und Lesbarkeit in beiden Versionen.