molily Navigation

Was kommt nach Popups und Lightboxen?

Einer der ersten Artikel zur Webentwicklung, den ich geschrieben habe, ist Popups mit JavaScript. Er stammt aus dem Jahr 2002 und wurde seitdem mehrfach überarbeitet. Dennoch blieb er thematisch in diesem Jahr verhaftet.

Zurück ins Jahr 2002

Popup-Fenster mit JavaScript waren damals allgegenwärtig. Fast jede Website öffnete Werbebanner in Popups. Die Browser hatten noch keine Popup-Blocker und machten keine Einschränkungen in puncto Fenstereigenschaften. Das Nervpotenzial war dementsprechend enorm. Rückblickend ist window.open() wohl die am häufigsten missbrauchte JavaScript-Technik.

Kein Browser unterstützte das W3C-DOM korrekt, sodass dynamische Änderungen am Dokument (»DHTML«) schwierig bis unmöglich waren. Kurzerhand wurde für jede Zusatzinformation ein neues Fenster geöffnet. Außerdem glauben einige, sich mit Vollbild-Popups fester Größe der Herausforderung der unterschiedlichen Viewport-Größen entziehen zu können.

Hinzu kam, dass JavaScript nicht so breit unterstützt war wie heute – oder es wurde aufgrund des Missbrauchs deaktiviert. Ein falscher Einsatz von JavaScript führte dazu, dass die Inhalte ohne JavaScript unzugänglich waren.

In dieser Situation sollte mein Artikel folgende Appelle transportieren:

  • Macht es so, dass es auch ohne JavaScript funktioniert. Hier wird gezeigt, wie es geht.
  • Schränkt die Benutzbarkeit nicht ein. Erlaubt Zugriff auf die geöffnete Adresse, die Browserfunktionen, die Größenänderung des Popups usw.
  • Vermeidet Popups möglichst, nutzt integrative Lösungen.

Die heutige Situation

Aus heutiger Sicht sind Popup-Fenster anachronistisch. Die Situation hat sich seit 2002 grundlegend gewandelt, sodass diese Herangehensweise nicht mehr passt:

  • Die JavaScript-Unterstützung ist weiter verbreitet. Browser schützen besser vor JavaScript-Missbrauch. Popup-Blocker machten automatisch aufspringenden Werbe-Popups schnell den Garaus.
  • Die Browser krempelten ihre Oberfläche radikal um. »Tabbed Browsing« macht mehrere Browser-Fenster überflüssig. Es ist heute selbstverständlich, dass wir selbstbestimmt Tabs öffnen, um mehrere Seiten und Informationen parallel darzustellen. Die ursprüngliche Funktion von window.open wird beim Tabbed Browsing nur noch als störend empfunden. Browser kompensieren dies dadurch, dass sie je nach Verwendung Tabs statt vollwertiger Fenster öffnen.
  • JavaScript-Bibliotheken kamen auf. Man konnte plötzlich mit DOM und CSS grafisch opulente Effekte innerhalb des Dokuments umsetzen. Mit Ajax wurden einzelne Inhalte im Hintergrund nachgeladen, anstatt immer das gesamte Dokument durch ein neues vom Server auszutauschen.

Es gibt also eigentlich keinen Grund mehr, Popups zu verwenden. Nichtdestoweniger erfreut sich mein Popup-Artikel soviel Aufmerksamkeit wie alle anderen Artikel auf molily.de zusammen, deswegen habe ich ihn immer wieder ergänzt. Bereits vor vielen Jahren hat sich der Artikel durch ein paar eingehende Links die Pole Position bei Google gesichert. Seitdem dreht sich die Popularitätsspirale: Was einmal oben in den Suchergebnissen steht, wird gelesen und erneut verlinkt, was die Führungsposition sichert.

Lightboxen wurden die neuen Popups

Am häufigsten wird im Artikel der Link zur Lightbox Clones Matrix geklickt. Das ist verständlich, denn Lightboxen sind schon seit Jahren die neuen Popups. Leider auch im Negativen. Selbst wenn sich der Trend, alles mögliche in einer langsamen, übertrieben geschmückten Lightbox zu öffnen, gelegt hat, so sind sie immer noch weit verbreitet. Sie teilen einige Probleme von Popups und bringen viele weitere mit sich. Schon die Idee hat einige Schwächen, doch die Umsetzungen sind größtenteils katastrophal.

Nach Popups und Lightboxen übernimmt Ajax?

Heute habe ich den Popup-Artikel grundlegend überarbeitet. Dabei ist ein Großteil des Textes entfallen und der Rest wurde entschlackt. Die Kritik an Popup-Fenstern bleibt, zusätzlich habe ich die Kritik an Lightboxen ausgebaut.

Doch wohin geht die Reise? Ich plädiere weiterhin für klassische Site-Strukturen mit adressierbaren Dokumenten (»Ressourcen«). Das funktioniert robust und kann schlank, schnell und benutzerfreundlich sein. Doch heutige Webanwendungen haben diese Grundprinzipien des Webs längst über Bord geworfen. Reine Ajax-Interfaces verabschieden sich gänzlich von Dokumenten und URIs, um von hinten durch die Brust ins Auge eine Kompatibilität mit der Google-Suchmaschine wiederherzustellen.

Zwei Beispiele sind Twitter und Gawker, die mit ihrem »Hashbang«-Desaster kürzlich heftige Kritik auf sich gezogen haben, siehe Breaking the Web with hash-bangs und weitere Artikel. Dabei ist es prinzipiell möglich, beide Welten zu vereinigen, wie Github mit der Nutzung von history.pushState() aus HTML5 zeigt.

Ajax versprach ursprünglich hochperformante Interfaces. Das Warten zwischen den Seitenaufrufen sollte ein Ende haben, Serverkommunikation asynchron verlaufen: »So the user is never staring at a blank browser window and an hourglass icon, waiting around for the server to do something« hieß es 2005 in dem programmatischen Essay, der den Begriff Ajax prägte. Dieses Konzept ist nicht aufgegangen, wirklich schneller ist beispielsweise das neue Twitter-Interface nicht geworden. Auch bei Ajax-Webanwendungen starren wir auf Warteanimationen und leere Flächen, bis die gewünschten Inhalte geladen sind.

In diesem Sinne freue ich mich über Kommentare und Ergänzungen zum überarbeiteten Artikel!