404

Ausgewählte Links

1. Shopify-Dokumentation zum Theme-Editor
2. Company XYZ-Dokumentation zu den Einstellungen für den Abschnitts-Innenabstand
3. Company XYZ-Dokumentation zu den Einstellungen für Abschnittshintergründe
4. Company XYZ-Dokumentation zu den Einstellungen für Trennlinien
5. Company XYZ-Dokumentation zu den Einstellungen für Layout-Breiten

Hilfreiche Videos

Video der Shopify Academy: Ihren Shop anpassen

Video der Shopify Academy: Ihren Shop anpassen

Dieser Abschnitt steuert die Darstellung Ihrer 404-Seite. Der Inhalt der Meldung wird in dem Standard-Inhaltseditor Ihres Themes verwaltet, während Sie mit den Einstellungen hier den visuellen Stil und das Layout der Seite gestalten können. Informationen zur Einrichtung und Navigation im Editor finden Sie in der Shopify-Dokumentation zum Theme-Editor

Inhalt

Verwenden Sie den Standard-Inhaltseditor Ihres Themes, um die eigentliche Not-Found-Meldung zu ändern. Dieser Abschnitt eignet sich am besten dafür, anzupassen, wie diese Meldung auf der Seite wirkt, einschließlich Farben, Abständen und des umliegenden Layouts.

Hinweis

Wenn die Seite nach der Gestaltung immer noch generisch wirkt, aktualisieren Sie auch die Standardmeldung. Eine starke Darstellung funktioniert am besten, wenn auch die Formulierung ebenso bewusst gewählt ist.

Farbeinstellungen

Diese Einstellungen überschreiben Ihre allgemeinen Theme-Farben nur für diesen Abschnitt. Sie sind nützlich, wenn Ihre 404-Seite stärkeren Kontrast, einen weicheren Ton oder einen markanteren Look benötigt, ohne den Rest der Website zu ändern.

Passen Sie Text- und Unterüberschriftenfarben zusammen an, besonders wenn Sie einen benutzerdefinierten Hintergrund hinzufügen. Wenn der Abschnitt einen dunkleren oder detailreicheren Hintergrund verwendet, überprüfen Sie beide Farben erneut, damit die Meldung auf einen Blick lesbar bleibt.

Prüfen Sie den Kontrast nach dem Ändern von Text- und Hintergrundstilen. Eine 404-Seite besteht oft größtenteils aus Text, daher kann zu geringer Kontrast die Nutzung schnell erschweren.

Standard-Abschnittseinstellungen

Padding-Einstellungen

Padding-Einstellungen steuern den Abstand oberhalb und unterhalb des 404-Inhalts auf Desktop und Mobilgeräten. Auf einer kurzen Seite wie dieser hat der Abstand großen Einfluss darauf, ob das Layout ausgewogen oder unangenehm leer wirkt.

Verwenden Sie auf Mobilgeräten weniger Padding, wenn die Seite zu hoch wirkt. Erhöhen Sie das Desktop-Padding, wenn der Inhalt gedrängt wirkt oder zu nah an benachbarten Seitenelementen liegt.

Abschnittshintergrund-Einstellungen

Abschnittshintergrund-Einstellungen ermöglichen es Ihnen, hinter der Not-Found-Meldung eine Farbe, einen Verlauf, ein Bild oder ein Video hinzuzufügen. Overlay-Einstellungen helfen dabei, den Inhalt lesbar zu halten, wenn Sie Hintergrundmedien verwenden.

Verläufe überschreiben Volltonfarben, und Overlay-Verläufe überschreiben Overlay-Farben. Leere oder transparente Werte behalten in der Regel die Fallback-Gestaltung des Abschnitts bei, während explizite Farben, Verläufe oder Medien den 404-Bereich visuell stärker vom Rest der Seite abgrenzen.

Wenn Sie ein Bild oder Video verwenden, halten Sie es dezent, damit die Seite weiterhin als hilfreiche Meldung und nicht als visuelles Feature wahrgenommen wird. Medien können außerdem Zuschnitt, Laden, Fallback und Lesbarkeit beeinflussen, insbesondere wenn Desktop- und Mobilmedien separat konfiguriert sind.

Tipp

Ein weicher Verlauf oder ein Bild mit wenig Detail funktioniert auf einer 404-Seite meist besser als unruhige Medien.

Trennlinien-Einstellungen

Trennlinien-Einstellungen fügen am oberen oder unteren Rand des Abschnitts eine Linie hinzu. Dadurch kann die 404-Seite bewusster eingerahmt wirken, insbesondere wenn sie innerhalb eines größeren Seitenlayouts sitzt.

Wenn Sie die Farbe der Trennlinie transparent lassen, verwendet der Abschnitt die Rahmenfarbe Ihres Themes. In den meisten Fällen wirkt eine dezente Trennlinie besser als eine auffällige.

Breiten-Einstellungen

Breiten-Einstellungen steuern die Breite des Inhaltsbereichs und des äußeren Abschnitt-Containers. Das ist besonders nützlich, um kurzen Text leichter lesbar zu machen oder Hintergrunddarstellungen mehr Raum zu geben.

Für die meisten 404-Seiten wirkt eine moderate Inhaltsbreite lesbarer als ein sehr breites Layout. Wenn Sie die Abschnittsbreite bei einem Hintergrund ändern, sehen Sie sich das Ergebnis in der Live-Storefront-Vorschau an, da Editor-Vorschauen Breitenänderungen ungenauer wirken lassen können.

Nutzungshinweise

1. Stil und Meldung zusammen anpassen. Aktualisieren Sie sowohl die Standardformulierung der 404-Seite als auch das Design des Abschnitts, damit die Seite gezielt wirkt und nicht wie ein Fallback.
   1. Halten Sie den Text klar und direkt.
   2. Stellen Sie sicher, dass die visuelle Gestaltung denselben Ton unterstützt.
2. Text leicht erfassbar halten. Wählen Sie Farbkombinationen und Breiten, die die Meldung auf Desktop und Mobilgeräten schnell lesbar machen.
3. Hintergründe sparsam einsetzen. Dezente Farb-, Verlauf-, Bild- oder Video-Optionen unterstützen die Meldung besser als auffällige Visuals.
4. Den Abstand ausbalancieren. Passen Sie das Padding an die Menge des angezeigten Inhalts an, damit die Seite gepflegt und nicht leer oder gedrängt wirkt.
5. Auf echten Bildschirmen vorab ansehen. Prüfen Sie das Endergebnis in der Storefront, insbesondere nach Änderungen an Breite, Hintergrundmedien oder mobilem Abstand.
6. Beide Viewport-Größen überprüfen. Desktop- und Mobilsteuerungen können unterschiedliche Ausrichtung, Sichtbarkeit und Medienverhalten erzeugen. Prüfen Sie daher die 404-Seite vor dem Veröffentlichen auf beiden Größen.