Key Takeaways
- Die Homepage und die Black Friday Landing Page haben unterschiedliche Aufgaben. Die Landing Page konvertiert Paid Traffic, der bereits eine Ad gesehen hat; die Homepage fängt alle ab, die von selbst kommen und das Angebot noch nicht kennen.
- Ändere fünf Dinge: die Announcement Bar, den Hero-Bereich, eine Leiste mit den Angebotsbedingungen, die kuratierten Einstiegspunkte und den Logistik-Block. Lass die Navigation, die Suche und die Produkt-Templates in Ruhe.
- Die meisten Black Friday Homepages scheitern an denselben zwei Dingen: Layout Shift, wenn die Announcement Bar und der Countdown zu spät laden, und dunkle saisonale Farbpaletten, die klammheimlich beim Kontrast durchfallen.
- Baue den Rollback, bevor du das Takeover baust. Am 1. Dezember muss jemand den Store wieder in den Normalzustand versetzen, und das sollte keine Improvisation sein.
Der Black Friday 2026 läuft von Freitag, dem 27. November, bis Montag, dem 30. November. Deine Landing Pages übernehmen die Conversion, aber die Homepage ist die Seite, die bereits existiert, bereits rankt und bereits Traffic erhält – und am Black Friday Morgen bekommt sie davon noch eine ganze Menge mehr.
Hier erfährst du, was du daran ändern solltest, in welcher Reihenfolge, und was unangetastet bleiben muss.
Warum du uns vertrauen kannst
Über 15 Jahre Entwicklungs-Erfahrung und speziell vier Jahre tief in Shopify-Themes. Wir entwickeln Fudge, einen KI-Storefront-Agenten, der von Hunderten von Shopify-Stores mit einer Bewertung von 4.9 im Shopify App Store genutzt wird. Und der November ist der Monat, in dem er gebeten wird, Kampagnen-States über Themes zu legen, die ansonsten gesperrt (locked down) sind.
Die Homepage ist nicht deine Landing Page
Hier lohnt es sich, präzise zu sein, denn die beiden zu vermischen, ist der häufigste Fehler bei dieser ganzen Übung.
| Black Friday Homepage | Black Friday Landing Page | |
|---|---|---|
| Wer hier landet | Direct, Organic, wiederkehrende Kunden, E-Mail-Empfänger, die aufs Logo geklickt haben | Paid Traffic, der gerade eine bestimmte Ad gesehen hat |
| Was sie wissen | Deine Brand. Nicht das Angebot. | Grob das Angebot aus dem Creative |
| Die Aufgabe | Orientierung bieten, dann weiterleiten | Jetzt konvertieren |
| Navigation | Beibehalten | Meistens entfernen |
| Anzahl der Produkte | Einstiegspunkte zu vielen Produkten | Kuratierte 10-30 Produkte |
Die Homepage muss jemanden abholen, der deinen Namen in den Browser getippt hat, weil er sich dunkel an einen Sale erinnert – und gleichzeitig jemanden, der schon neunmal bei dir gekauft hat. Sie dient zur Orientierung und Weiterleitung. Die Landing Page übernimmt den Abschluss.
Paid Traffic auf die Homepage zu leiten, verschwendet die Ad. Die Homepage unangetastet zu lassen, verschwendet alle anderen Besucher.
Die fünf Dinge, die du ändern solltest
In der Reihenfolge der Umsetzung. Wenn dir die Zeit ausgeht, sind die ersten Punkte wichtiger.
1. Die Announcement Bar
Die wertvollsten Pixel auf der Seite während BFCM und das am günstigsten zu ändernde Element.
Pack das Angebot und die Deadline rein, und zwar in dieser Reihenfolge: „30 % auf alles. Endet am Montag, 30. November.“ Nicht „Black Friday is here“ – das verrät den Kunden nichts, was sie nicht ohnehin schon geahnt hätten.
Drei Dinge, die du richtig machen musst:
- Reserviere die Höhe in CSS. Eine Leiste, die nach dem First Paint injected wird, schiebt die ganze Seite nach unten – und das ist ein Cumulative Layout Shift (CLS) Hit an deinem trafficstärksten Tag. Gib ihr eine feste
min-height, damit das Layout stimmt, bevor der Content geladen wird. - Mach einen Link daraus. Zum Offer-Hub, nicht zur Homepage, auf der man sich schon befindet.
- Eine Message. Die Announcement Bar von Dawn unterstützt bis zu 12 rotierende Ankündigungen. Drei Angebote in acht Sekunden an einem Kunden vorbeiziehen zu lassen, ist nicht dasselbe, wie ein Angebot klar zu kommunizieren.
Wenn du einen Countdown hinzufügst, baue den Countdown ohne App – es ist nur eine einzige Section-Datei, und App-Timer packen Script-Gewicht auf jede Seite an dem Tag, an dem du dir das am wenigsten leisten kannst.
2. Der Hero-Bereich
Tausche das Bild aus, tausche die Headline aus, ersetze den CTA. Behalte die Struktur.
Die Headline formuliert das Angebot in klaren Worten. Die Subline enthält die Daten und die eine Bedingung, die am wichtigsten ist („ausgenommen neue Saison“, „solange der Vorrat reicht“). Der CTA führt zum Offer-Hub.
Zum Bild: Was auch immer du produzierst, muss als Mobile-Crop (mobiler Zuschnitt) funktionieren, denn dort werden es die meisten Leute sehen. Designe zuerst die mobile Version und lass die Desktop-Version diejenige sein, die zusätzlichen Platz bekommt, anstatt ein breites Banner zu entwerfen und zu hoffen, dass die Mitte überlebt. Halte Text aus dem Bild selbst heraus, damit es lesbar, übersetzbar und barrierefrei bleibt.
Achte auf die Dateigröße. Ein Hero-Image ist normalerweise das Largest Contentful Paint (LCP) Element. Ein schweres saisonales Bild verlangsamt also direkt die Metrik, die am meisten beeinflusst, ob ein ungeduldiger Besucher am Freitagmorgen bleibt. Liefere es responsive aus und halte es unter ein paar hundert Kilobyte.
3. Eine Leiste für die Angebotsbedingungen
Eine kurze Zeile direkt unter dem Hero, die die vier Fragen beantwortet, welche der Support ansonsten einzeln beantworten muss:
- Was ist dabei und was ist ausgeschlossen
- Wann es endet, inklusive Datum
- Ob Codes kombinierbar sind (stacken)
- Die Rückgaberichtlinien für Geschenke
Diese einzelne Zeile reduziert einen signifikanten Teil des Black Friday Support-Volumens. Sie ist auch der Block, den die meisten Stores komplett vergessen.
4. Kuratierte Einstiegspunkte
Ersetze die üblichen „Neuheiten“- und „Bestseller“-Reihen durch Wege ins Angebot: nach Kategorie, nach Preis, nach Empfänger.
„Geschenke unter 50 €“ ist ein besseres Black Friday Modul als „Neuheiten“, weil es genau zu dem Intent passt, mit dem die Leute Ende November tatsächlich auf die Seite kommen. Drei bis fünf Wege, nicht mehr. Jeder davon sollte auf einer echten kuratierten Seite statt auf einer gefilterten Collection-URL landen – siehe so erstellst du eine Promo-Seite in Shopify.
Halte die Auswahl klein. Die Aufgabe der Homepage ist hier, jemanden von der Homepage wegzubekommen und in eine Collection zu leiten.
5. Logistik und Trust
Verschiebe Bestellfristen (Shipping Cutoffs), Rückgabebedingungen und Zahlungsoptionen weiter nach oben auf die Seite.
Ende November steht „Kommt es rechtzeitig an?“ über fast jedem anderen Einwand. Wenn die Antwort auf der Homepage sichtbar ist, verhindert das den Absprung zu einem Konkurrenten, der diese Info offensichtlich platziert hat. Nenne die tatsächlichen Daten, nicht einfach nur „bald bestellen“.
Was du in Ruhe lassen solltest
Der Instinkt im November ist es, alles zu verbessern. Widerstehe ihm, denn jede Änderung ist eine Änderung, die du vielleicht am Freitagmorgen um 6 Uhr debuggen musst.
- Navigationsstruktur. Füge von mir aus einen „Black Friday“-Menüpunkt hinzu. Aber strukturiere das Menü nicht um.
- Suche und Filterung. Der Peak-Traffic ist der schlechtestmögliche Zeitpunkt, um einen Bug in der Facettensuche zu entdecken.
- Produkt-Templates (PDPs). Aktualisiere die beworbenen PDPs mit Angebotspreisen und stärkeren Trust-Signalen, aber baue das Template nicht um.
- Checkout. Nicht während BFCM. Für gar nichts.
- Apps. Im November noch eine hinzuzufügen, bedeutet ungetestetes Script-Gewicht auf jeder Seite. Wenn überhaupt, überprüfen und entfernen.
- Das Theme selbst. Strukturelle Theme-Arbeiten sollten bis Ende September abgeschlossen sein. Kampagnen-States liegen auf einem eingefrorenen (frozen) Theme.
Die zwei Dinge, die kaputtgehen
Bei den Stores, die wir sehen, scheitern Black Friday Homepages jedes Jahr auf dieselben zwei Arten.
Layout Shift durch spät ladende Kampagnen-Elemente
Die Announcement Bar, der Countdown und die Sticky Promo Bar werden alle gerne nach dem First Paint per JavaScript injected. Jedes Element ohne reservierten Platz schiebt die Seite nach unten, nachdem der Besucher bereits angefangen hat zu lesen. Auf mobilen Geräten ist das der Unterschied zwischen dem Tippen auf den CTA und dem Tippen auf das, was stattdessen an diese Stelle gerückt ist.
Reserviere die Höhe in CSS für jedes Element, das erscheinen wird. Gib Countdown-Ziffern eine feste Breite mit tabular-nums, damit der Timer die Zeile nicht jede Sekunde neu umbricht (re-flow).
Saisonale Farbpaletten, die beim Kontrast durchfallen
Das ist der Punkt, den fast niemand überprüft. Black Friday Designs werden dunkel, kontrastreich und stark akzentuiert – anthrazitfarbene Hintergründe, rote Sale-Flags, goldene oder neonfarbene Akzente. Viele dieser Kombinationen erfüllen nicht einmal das Kontrastverhältnis von 4,5:1, das die WCAG für normalen Text vorschreibt. Am schlimmsten fallen meistens der Angebotspreis und der Sale-Badge durch: genau die Elemente, wegen derer die ganze Seite existiert.
Es ist auch die schlechteste Jahreszeit, um hier Fehler zu machen. Der European Accessibility Act gilt seit dem 28. Juni 2025. Für Stores, die in die EU verkaufen, ist dies also ein rechtliches Risiko und kein Nice-to-have, und am Black Friday erreicht dein Traffic seinen Höhepunkt.
Zwei Checks, jeweils fünf Minuten:
- Jage den Sale-Preis, den Badge-Text und das CTA-Label in ihrer echten Größe durch einen Contrast-Checker.
- Tabbe mit der Tastatur durch die Homepage. Wenn die neuen Kampagnen-Module nicht erreichbar sind oder der Fokus-Ring auf dem dunklen Hintergrund unsichtbar ist, behebe das noch vor Freitag.
Für das breitere Spektrum, siehe die sechs häufigsten Barrierefreiheits-Fehler in Shopify-Themes und unseren Guide zum European Accessibility Act.
Baue zuerst den Rollback
Am 1. Dezember muss der Store wieder in den Normalzustand zurückkehren. Das ist oft der Moment, in dem etwas kaputtgeht, weil das Takeover als Einweg-Änderung von jemandem eingebaut wurde, der jetzt schläft.
Bevor du den Kampagnen-State veröffentlichst:
- Dupliziere das Theme und benenne es eindeutig – „Pre-BFCM Baseline“, mit dem Datum.
- Schreibe auf, welche Sections geändert wurden und wer sie geändert hat.
- Plane die Wind-down Phase, nicht nur den Aus-Schalter. Über Nacht von „30 % auf alles“ auf nichts zurückzugehen, ist eine schlechte Customer Experience für jeden, der gerade etwas im Warenkorb hat. Ein kürzeres, kleineres Dezember-Angebot erleichtert den Übergang.
- Benenne eine Person, die während des Wochenendes Änderungen freigeben darf, und leite alles über diese Person.
Wenn du das liest und noch 48 Stunden Zeit hast
Die Kurzversion, in der Reihenfolge der Priorität:
- Announcement Bar mit dem Angebot und dem Enddatum, inkl. reservierter Höhe.
- Hero-Headline und CTA, die zum Offer-Hub zeigen. Verwende das bestehende Bild wieder, wenn das neue nicht fertig ist.
- Leiste mit den Angebotsbedingungen unter dem Hero.
- Bestellfrist (Shipping Cutoff) sichtbar „above the fold“ auf dem Smartphone.
- Dupliziere das Theme, damit du den Rollback durchführen kannst.
Das sind ein paar Stunden Arbeit und deckt den größten Teil des Nutzens ab. Die kuratierten Einstiegspunkte und der neu designte Hero sind die Teile, die man weglassen sollte, wenn die Zeit knapp wird – nicht die Bedingungen und die Deadline.
Für den vollständigen Ablauf und die Pre-Launch Checkliste, schau dir das Shopify BFCM Playbook an. Wenn das Angebot selbst noch nicht feststeht, deckt Black Friday Sale Ideen für Shopify Stores die Mechanismen ab und zeigt, was sie jeweils kosten. Änderungen auf diesem Level sind genau das, wofür der Shopify Store Editor gemacht ist: Kampagnen-States auf einem Theme, das du ansonsten nicht anfasst.
FAQ
Passe sie an, designe sie nicht neu. Ersetze die Announcement Bar, den Hero, die Einstiegspunkte und den Logistik-Block, und lass die Navigation, die Suche, die Produkt-Templates und den Checkout genau so, wie sie sind. Ein strukturelles Redesign im November bedeutet, ein neues Layout an deinem trafficstärksten Tag zu debuggen, und der mögliche Conversion-Uplift ist viel geringer als das Risiko.
Das Angebot und die Deadline, in dieser Reihenfolge, und sonst nichts. „30 % auf alles. Endet am Montag, 30. November.“ schlägt „Black Friday is here“, weil es dem Besucher etwas verrät, was er noch nicht wusste. Mach daraus einen Link zum Offer-Hub, reserviere die Höhe per CSS, damit sich die Seite nicht verschiebt, und lass eine Message stehen, anstatt drei rotieren zu lassen.
Auf eine Landing Page, wenn es sich um kalten Paid Traffic handelt. Die Landing Page passt zur Ad, entfernt die Navigation und kuratiert ein kleines Produkt-Set, damit sie einen Besucher konvertiert, der das Angebot bereits kennt. Die Homepage bedient Direct-, Organic- und wiederkehrende Besucher, die ankommen, ohne eine Ad gesehen zu haben – das ist ein anderer Job und erfordert die Navigation.
Aus zwei Gründen. Kampagnen-Elemente wie Announcement Bars und Countdowns werden meist nach dem First Paint injected und schieben die Seite nach unten, was als Layout Shift registriert wird. Und saisonale Hero-Bilder sind schwerer als die, die sie ersetzen, was den Largest Contentful Paint verlangsamt. Reserviere die Höhe in CSS für alles, was spät erscheint, und liefere das Hero-Bild responsive aus.
Häufig. Anthrazitfarbene Hintergründe mit roten Sale-Flags oder Neon-Akzenten fallen oft unter das Kontrastverhältnis von 4,5:1, das die WCAG für normalen Text vorschreiben. Die Elemente, die am häufigsten durchfallen, sind der reduzierte Preis und das Sale-Badge. Überprüfe den Sale-Preis, das Badge und den CTA in ihren tatsächlichen Größen und tabbe mit der Tastatur durch die Seite, um zu bestätigen, dass der Fokus-Ring auf dem dunklen Hintergrund sichtbar ist.
Baue sie im Oktober, veröffentliche sie in der Woche davor. Die meisten Stores schalten die Homepage live, wenn der Early Access für ihre E-Mail-Liste öffnet – meist am Montag oder Dienstag vor dem Black Friday – und gehen am Freitagmorgen in das volle Angebot über. Halte das duplizierte Theme als Rollback bereit, bevor du irgendetwas veröffentlichst.
Dupliziere das Theme, bevor du loslegst, und benenne es mit Datum als „Pre-BFCM Baseline“. So ist die Wiederherstellung eine einzige Aktion und nicht der Versuch, sich daran zu erinnern, was geändert wurde. Plane die Wind-down Phase genauso wie den Aus-Schalter: Ein storniertes seitenweites Angebot über Nacht lässt jeden im Stich, der mitten im Checkout-Prozess steckt. Ein kleineres Dezember-Angebot sorgt hier für einen besseren Übergang.
