Zwischen Oktober und Januar haben viele Betriebe etwas mitzuteilen, das nicht dauerhaft auf die Website gehört: Betriebsferien zwischen den Jahren, verkürzte Öffnungszeiten an Heiligabend, Gutscheine zum Verschenken, eine befristete Aktion oder die Frist für Anfragen zur Weihnachtsfeier. Ein Popup liegt nahe, weil es seitenweit erscheint und mit wenigen Angaben eingerichtet ist. Genau das macht es aber auch heikel. Ein Fenster, das sich über die Seite legt, bevor jemand gefunden hat, was er sucht, wirkt wie ein Türsteher, und viele Besucher schließen es, ohne einen Satz gelesen zu haben. Dieser Beitrag beantwortet vier Fragen: Für welche Anlässe lohnt sich ein Hinweis-Popup überhaupt? Wann ist ein schmales Banner am unteren Rand die bessere Wahl als ein Fenster in der Mitte? Wie greifen Auslöser und Häufigkeit ineinander, damit derselbe Hinweis nicht bei jedem Seitenwechsel wiederkommt? Und wie sieht ein Text aus, der genau ein Ziel hat? Was grundsätzlich in den ersten Bildschirm der Startseite gehört, behandelt der Beitrag zum ersten Bildschirm; hier geht es um die Einblendung selbst und ihre Einstellungen.
Wann ein Hinweis-Popup hilft
Ein Popup ist eine Einblendung, die über dem eigentlichen Seiteninhalt liegt.
Google unterscheidet in seiner Dokumentation zwei Formen und beschreibt sie nüchtern: „Interstitials sind Overlays, die sich über die gesamte Seite erstrecken.“ Dialogfelder dagegen liegen nur über einem Teil der Seite (Google Search Central). Für einen Betrieb ist das keine Begriffsfrage, sondern eine Entscheidung über den Besucher: Ein Hinweis, der die ganze Seite verdeckt, verlangt eine Handlung, bevor weitergelesen werden kann. Ein Hinweis, der nur einen Streifen einnimmt, lässt weiterlesen und bietet einen zusätzlichen Weg an. Ein Popup ist dann sinnvoll, wenn drei Bedingungen zusammenkommen: Die Information ist befristet, sie betrifft viele Besucher unabhängig davon, auf welcher Seite sie einsteigen, und es gibt ein klares nächstes Ziel, auf das der Knopf führen kann. Fehlt eine der drei Bedingungen, gehört die Information an eine andere Stelle. Was dauerhaft gilt, etwa die regulären Öffnungszeiten, steht auf der Kontaktseite und im Fußbereich. Was nur eine Leistung betrifft, steht auf deren Seite. Und was niemanden zu einer Handlung bewegen soll, braucht keinen Knopf und damit meist auch kein Popup. Im vierten Quartal bleiben nach diesem Filter vor allem drei Anlässe übrig:
Geänderte Zeiten
Betriebsferien zwischen den Jahren, verkürzte Zeiten an Heiligabend oder ein Brückentag. Wer an diesen Tagen vor verschlossener Tür steht, hätte den Hinweis gebraucht, auch wenn er über eine Leistungsseite gekommen ist und die Startseite gar nicht gesehen hat.
Aktion oder Gutschein
Ein befristetes Angebot, Gutscheine zum Verschenken oder ein Vorteil für Bestandskunden. Der Hinweis lohnt sich nur, wenn die Befristung echt ist und die Bedingungen auf der Zielseite vollständig stehen.
Termin mit Frist
Ein Tag der offenen Tür, die Frist für Gruppenanfragen zur Weihnachtsfeier oder ein Annahmeschluss vor den Feiertagen. Der Knopf führt direkt auf die Seite, auf der die Anmeldung oder Anfrage möglich ist.
Ebenso wichtig ist die Liste der Fälle, in denen ein Popup schadet. Die Nielsen Norman Group hat in einer Auswertung problematischer Einblendungen eine klare Regel formuliert: Ein Popup soll erst erscheinen, wenn der Besucher bereits einen Nutzen von der Seite hatte (Nielsen Norman Group). Ein Fenster, das noch vor dem ersten Satz nach einer E-Mail-Adresse fragt, verstößt genau dagegen. Wer einen Newsletter anbieten will, findet die rechtlich saubere Anmeldung im Beitrag zum Double-Opt-In; als Erstes auf der Seite gehört sie nicht. Auch mehrere Einblendungen nacheinander, etwa Einwilligungsabfrage, Aktion und Chat-Aufforderung, summieren sich zu einer Hürde, die vor allem auf dem Telefon den Inhalt verschwinden lässt. Dieselbe Auswertung rät, höchstens eine Einblendung zur selben Zeit zu zeigen.
Das Popup ist ein Wegweiser, kein Aushang
Banner oder Fenster in der Mitte
In XICflow liegt das Popup im Bereich „Marke & Design“ und zeigt seinen Hinweis auf den Seiten der Website; Rechtstexte wie Impressum und Datenschutzerklärung bleiben ohne Popup.
Die Dokumentation beschreibt es als „nur Inhalt, kein Tracking, für Besucher jederzeit schließbar“ (XICflow-Dokumentation). Für die Darstellung gibt es zwei Möglichkeiten: „Modal (Mitte)“ und „Banner (unten)“ (XICflow-Dokumentation). Das Modal ist ein Fenster in der Bildschirmmitte, hinter dem die Seite abgedunkelt wird. Das Banner ist ein Streifen am unteren Rand, über dem die Seite lesbar bleibt. Die einzelnen Schritte zum Einrichten stehen im Handbuch im Abschnitt Popup.
Für die Wahl zwischen beiden gibt Google eine deutliche Richtung vor. Unter den häufigen Fehlern, die bei Dialogfeldern und Interstitials vermieden werden sollen, steht an erster Stelle: „Verdecke nicht die gesamte Seite mit Interstitials.“ (Google Search Central). Ausgenommen sind Einblendungen, die gesetzlich vorgeschrieben sind, etwa eine Altersprüfung. Ein Ferienhinweis oder eine Aktion fällt nicht darunter. Für einen Hinweis, den viele Besucher sehen sollen, ohne dass er ihren Weg blockiert, ist das Banner deshalb in den meisten Fällen die passende Form. Das Modal bleibt für Ausnahmen, bei denen der Besucher die Information wirklich zuerst braucht, zum Beispiel wenn der Betrieb umgezogen ist und eine vergebliche Fahrt an die alte Adresse vermieden werden soll.
Tabelle waagerecht wischen
| Frage | Modal (Mitte) | Banner (unten) |
|---|---|---|
| Was der Besucher sieht | Ein Fenster in der Mitte, die Seite dahinter ist abgedunkelt | Einen Streifen am unteren Rand, die Seite bleibt lesbar |
| Was er tun muss | Schließen oder dem Knopf folgen, bevor er weiterliest | Nichts; er kann weiterlesen und das Banner später schließen |
| Auf dem Telefon | Das Fenster füllt einen großen Teil des Bildschirms | Der Streifen nimmt den unteren Rand ein, der Inhalt darüber bleibt sichtbar |
| Geeignet für | Seltene, dringende Hinweise, die vor allem anderen gelten | Ferienzeiten, Aktionen, Termine und Gutscheine |
| Typisches Risiko | Es wird ungelesen weggeklickt oder als Hürde empfunden | Es verdeckt Knöpfe oder Felder am unteren Bildschirmrand |
Wer dabei an die Suchmaschine denkt, sollte die Gewichte richtig einordnen. In Googles Selbsttest zur Nutzerfreundlichkeit von Seiten steht die Frage „Vermeidest du auf deinen Seiten die Verwendung von aufdringlichen Interstitials?“ (Google Search Central). Dieselbe Seite stellt aber klar, dass außer den Core Web Vitals die übrigen Aspekte der Nutzerfreundlichkeit nicht direkt zu einem höheren Rang führen. Die Seite zu Interstitials nennt dafür einen anderen Weg: Störende Einblendungen erschweren es Suchmaschinen, die Inhalte zu verstehen, was sich negativ auf die Suchleistung auswirken kann (Google Search Central). Ein Popup kostet also nicht automatisch Plätze in den Suchergebnissen. Es kostet aber Besucher, die nach dem ersten Eindruck wieder gehen, und das wiegt für einen Betrieb meist schwerer als eine Position in der Trefferliste.
Ein zweiter, technischer Unterschied betrifft die Stabilität der Seite. Wird ein Hinweis nachträglich in den Seiteninhalt geschoben, rutscht alles darunter nach unten, und wer gerade tippen wollte, trifft den falschen Knopf. Solche Verschiebungen misst die Kennzahl Cumulative Layout Shift; als gut gilt ein Wert von 0,1 oder weniger (web.dev). Für Banner und ähnliche Einblendungen empfiehlt dieselbe Quelle, entweder vorab Platz zu reservieren oder das Element aus dem Textfluss zu nehmen und über den Inhalt zu legen (web.dev). Das Banner in XICflow liegt fest am unteren Rand über der Seite, statt sie zu verschieben. Die Regel lohnt sich trotzdem für alles andere, was nachgeladen wird: Was über dem Inhalt liegt, verschiebt nichts; was in den Inhalt eingefügt wird, schon.
Den richtigen Moment wählen
Ob ein Popup stört, hängt weniger an seiner Größe als an seinem Zeitpunkt.
XICflow bietet dafür vier Auslöser: „Sofort“, „Nach Verzögerung“, „Beim Scrollen“ und „Beim Verlassen“; bei „Nach Verzögerung“ wird zusätzlich die Verzögerung in Sekunden eingestellt (XICflow-Dokumentation). Jeder Auslöser beantwortet eine andere Frage. Muss der Besucher den Hinweis sehen, bevor er irgendetwas anderes tut? Soll er erst ankommen und die Seite lesen? Soll den Hinweis nur sehen, wer sich mit dem Inhalt beschäftigt? Oder soll er erst erscheinen, wenn jemand die Seite verlassen will? Die Tabelle ordnet die vier Möglichkeiten den typischen Anlässen zu.
Tabelle waagerecht wischen
| Auslöser | Passt für | Worauf achten |
|---|---|---|
| Sofort | Seltene Pflichthinweise und dringende Änderungen, etwa eine neue Adresse | Erscheint, bevor der Besucher etwas gelesen hat; für Werbung ungeeignet |
| Nach Verzögerung | Ferienzeiten, geänderte Öffnungszeiten, Termine mit Frist | Kurz genug, dass der Hinweis noch gesehen wird, lang genug, dass die Seite zuerst ankommt |
| Beim Scrollen | Aktionen und Gutscheine für Besucher, die sich mit dem Inhalt befassen | Wer nur kurz die Telefonnummer sucht, sieht den Hinweis womöglich nicht |
| Beim Verlassen | Ein letzter Hinweis am Rechner, etwa auf Gutscheine | Reagiert auf die Mausbewegung; auf Telefonen ohne Maus erscheint der Hinweis in der Regel nicht |
Der Auslöser „Beim Verlassen“ verdient einen zweiten Blick. In XICflow reagiert er darauf, dass der Mauszeiger das Browserfenster nach oben verlässt, also typischerweise in Richtung Adressleiste oder Tab. Auf einem Telefon gibt es diese Bewegung nicht. Für Informationen, die alle Besucher erreichen sollen, ist dieser Auslöser deshalb ungeeignet: Die Betriebsferien würden genau die Menschen verpassen, die kurz vor der Anfahrt am Handy nachsehen. Er taugt für einen freundlichen Abschiedshinweis am Rechner, nicht für eine Information, auf die sich jemand verlassen muss.
„Sofort“ ist der Auslöser mit dem größten Störpotenzial, weil er den Besucher abfängt, bevor er gesehen hat, ob er überhaupt richtig ist. Die Richtlinien zur Barrierefreiheit kennen dafür auf der höchsten Stufe ein eigenes Kriterium: Unterbrechungen sollen sich vom Nutzer aufschieben oder unterdrücken lassen, mit Ausnahme von Notfällen (W3C, WCAG 2.2, Erfolgskriterium 2.2.4). Diese Stufe AAA ist für die meisten Websites keine Pflicht, beschreibt aber gut die Haltung dahinter: Ein Hinweis darf sich zurückhalten, wenn er nicht dringend ist. Für die meisten Anlässe ist „Nach Verzögerung“ mit einigen Sekunden deshalb der ruhigere Weg. Eine feste Zahl gibt es dafür nicht; entscheidend ist, dass die Überschrift der Seite gelesen werden kann, bevor sich etwas darüber legt.
Die Häufigkeit festlegen
Mindestens so wichtig wie der Zeitpunkt ist die Frage, wie oft derselbe Hinweis erscheint. XICflow bietet drei Stufen: „Immer“, „Einmal je Sitzung“ und „Nur einmal“ (XICflow-Dokumentation).
Bei „Immer“ merkt sich die Website das Schließen nicht, der Hinweis kann bei jedem neuen Aufruf wieder auftauchen. Bei „Einmal je Sitzung“ bleibt er nach dem Schließen weg, solange die Sitzung läuft. Bei „Nur einmal“ merkt sich der Browser des Besuchers das Schließen dauerhaft, bis der Speicher des Browsers geleert wird. Gemerkt wird dabei nur, dass der Hinweis geschlossen wurde, und zwar im Browser des Besuchers selbst.
Für Ferienhinweise ist „Einmal je Sitzung“ ein sinnvoller Mittelweg: Wer am Montag nachsieht und am Donnerstag in einer neuen Sitzung wiederkommt, bekommt die Information noch einmal, wird aber beim Durchklicken der Leistungsseiten nicht jedes Mal aufgehalten. „Nur einmal“ passt zu Hinweisen, die ein Besucher nach dem ersten Lesen nicht mehr braucht, etwa auf eine neue Online-Terminbuchung. „Immer“ ist selten die richtige Wahl, weil ein Besucher, der den Hinweis geschlossen hat, ihn bewusst nicht mehr sehen wollte. Eine Eigenheit hilft bei der Pflege: Ändern sich Titel, Text, Knopftext oder Ziel, gilt das Popup als neuer Hinweis und erscheint auch bei Besuchern wieder, die die alte Fassung geschlossen haben. Wer im Januar aus dem Ferienhinweis einen Hinweis auf das neue Jahresprogramm macht, erreicht damit wieder alle.
- Betriebsferien und Feiertagszeiten: Banner (unten), Nach Verzögerung, Einmal je Sitzung, Knopf auf die Öffnungszeiten
- Befristete Aktion oder Gutscheine: Banner (unten), Beim Scrollen, Nur einmal, Knopf auf die Seite mit allen Bedingungen
- Frist für Anmeldungen oder Gruppenanfragen: Banner (unten), Nach Verzögerung, Einmal je Sitzung, Knopf auf das Formular
- Umzug oder geänderte Anfahrt in den ersten Wochen: Modal (Mitte), Sofort, Nur einmal, Knopf auf die Anfahrtsbeschreibung
Das eigene Popup erscheint nicht mehr?
Ein Satz, ein Ziel
Das Popup hat vier Textfelder: „Titel“, „Text“, „Button-Text“ und „Button-Ziel (URL)“ (XICflow-Dokumentation). Mehr braucht ein Hinweis nicht, und meist braucht er weniger. Der Titel sagt in wenigen Wörtern, worum es geht.
Der Text nennt das eine Datum oder die eine Bedingung, die der Besucher wissen muss. Der Knopf führt auf die Seite, auf der alles Weitere steht, und sagt mit einem Verb, was dort passiert: „Zu den Öffnungszeiten“, „Gutschein bestellen“, „Termin anfragen“. Wer zwei Ziele in einen Hinweis packt, etwa Ferienzeiten und Gutscheine, halbiert die Aufmerksamkeit für beide. Restaurants, die im Herbst Gruppenanfragen sammeln, lenken den Knopf auf eine eigene Gruppenseite für Weihnachtsfeiern und nicht auf die Startseite.
Titel: Betriebsferien zwischen den Jahren
Text: Wir sind vom TT.MM. bis TT.MM. geschlossen. Anfragen über das
Formular beantworten wir ab dem TT.MM.
Button-Text: Zu den Öffnungszeiten
Button-Ziel: /kontakt/#zeiten
Titel: Gutscheine zum Verschenken
Text: Gutscheine gibt es als PDF zum Ausdrucken, einlösbar für alle
Leistungen. Bestellung bis TT.MM. für die Zustellung vor dem Fest.
Button-Text: Gutschein bestellen
Button-Ziel: /gutscheine/Bei Aktionen kommt zum Schreiben das Recht hinzu, denn ein Popup ist Werbung und unterliegt denselben Regeln wie die Seite dahinter. Wer gegenüber Verbrauchern eine Preisermäßigung für eine Ware bekannt gibt, muss den niedrigsten Gesamtpreis angeben, den er innerhalb der letzten 30 Tage vor der Ermäßigung angewendet hat (Paragraf 11 PAngV). Die Pflicht hängt an jeder Bekanntgabe einer Ermäßigung, also auch an der im Popup. Wie oft das schiefgeht, zeigt eine Prüfung der europäischen Verbraucherschutzbehörden rund um Black Friday und Cyber Monday: Von 314 geprüften Online-Händlern gaben 30 Prozent Rabatte fehlerhaft an (Europäische Kommission). Die allgemeinen Regeln für Preise und Werbeaussagen auf der eigenen Website fasst der Beitrag zu Preisangaben zusammen.
Ähnlich streng ist das Recht bei Zeitdruck. Auf der Liste der stets unzulässigen geschäftlichen Handlungen steht die unwahre Angabe, ein Angebot sei nur für einen sehr begrenzten Zeitraum verfügbar, um Verbraucher zu einer sofortigen Entscheidung zu drängen (UWG, Anhang Nummer 7). In derselben Prüfung setzten 18 Prozent der Händler Drucktechniken wie Countdowns oder Knappheitshinweise ein, und mehr als die Hälfte dieser Fälle war irreführend (Europäische Kommission). Schon eine frühere Prüfung hatte bei 42 von 399 untersuchten Onlineshops gefälschte Countdown-Zähler gefunden (Europäische Kommission 2023). Ein Aktionshinweis nennt deshalb das echte Enddatum und verschwindet, wenn es erreicht ist. Wer die eigene Aktion mit Angeboten anderer Anbieter vergleicht, findet die Grenzen im Beitrag zu vergleichender Werbung.
Befristet heißt: mit echtem Ende
Schließen per Tastatur und Fokus
Barrierefreiheit ist nicht der Schwerpunkt dieses Beitrags, drei Grundsätze gehören aber zu jedem Popup.
Erstens: Wer mit der Tastatur arbeitet, muss jede Einblendung auch mit der Tastatur wieder verlassen können; das verlangt bereits die Grundstufe der Richtlinien (W3C, WCAG 2.2, Erfolgskriterium 2.1.2). Zweitens: Für ein modales Fenster beschreibt das Muster des W3C, dass der Fokus beim Öffnen in das Fenster wandert und die Escape-Taste es schließt (W3C, ARIA Authoring Practices). Drittens: Ein Banner, das fest am Rand steht, darf das Element, das gerade den Tastaturfokus hat, nicht vollständig verdecken. Das W3C nennt als Beispiel ausdrücklich einen Hinweis in der Art eines Cookie-Banners, der dieses Kriterium verfehlt, wenn er das fokussierte Element ganz überdeckt (W3C, WCAG 2.2, Erfolgskriterium 2.4.11). Wer zusätzlich Bewegung auf der Seite einsetzt, findet im Beitrag zu dezenten Animationen, wie sie ruhig bleibt; ob ein Betrieb unter das Barrierefreiheitsstärkungsgesetz fällt, klärt der Beitrag zum BFSG.
- Die Seite mit eingeblendetem Hinweis nur mit der Tabulatortaste durchgehen: Ist jederzeit zu sehen, wo der Fokus steht?
- Beim Banner bis zum Seitenende springen: Verschwindet ein Link oder Formularfeld vollständig hinter dem Streifen?
- Beim Modal prüfen, ob sich das Fenster mit der Tastatur schließen lässt und der Fokus danach sinnvoll weitergeht
- Das Schließen-Kreuz auf dem Telefon antippen: Lässt es sich treffen, ohne daneben auf den Knopf zu geraten?
- Die Schrift im Browser vergrößern: Bleiben Text, Knopf und Kreuz vollständig sichtbar?
Vom Entwurf zum Livegang
- Anlass prüfen: Ist die Information befristet, für viele Besucher wichtig und mit einem klaren Ziel verbunden? Sonst gehört sie auf eine Seite.
- Zielseite vorbereiten: Öffnungszeiten, Aktionsbedingungen oder Formular stehen vollständig dort, wohin der Knopf führt.
- Text schreiben: ein Titel, ein Satz, ein Knopf mit Verb.
- Darstellung wählen: Banner (unten) als Regel, Modal (Mitte) nur für dringende Ausnahmen.
- Auslöser und Häufigkeit setzen und mit „Popup speichern“ sichern.
- Veröffentlichen: Gespeicherte Änderungen sind erst mit der nächsten Veröffentlichung auf der Website sichtbar.
- Im privaten Fenster und auf dem Telefon prüfen und einmal mit der Tastatur durchgehen.
- Ende festlegen: Häkchen „Aktiv“ am Tag nach Aktionsende oder nach den Ferien entfernen und erneut veröffentlichen.
Mit XICflow liegt dieser Ablauf in einem Bereich: Text, Darstellung, Auslöser und Häufigkeit stehen im Abschnitt Popup unter „Marke & Design“, und Änderungen sind dort erst mit der nächsten Veröffentlichung auf der Website zu sehen (XICflow-Dokumentation). Weil das Popup laut Dokumentation nur Inhalt zeigt und kein Tracking enthält, kommt mit ihm kein zusätzlicher Dienst auf die Seite. Welche Bausteine und Gestaltungsmöglichkeiten außerdem zur Verfügung stehen, zeigt die Übersicht der Funktionen. Für die Zeit zwischen den Aktionen bleibt der Beitrag zu aktuellen Öffnungszeiten die Grundlage, denn ein guter Hinweis zeigt auf eine Seite, die stimmt.