Mit Opera Reader und CSS-3-Erweiterungen durch das Web blättern

Eine Pagination ist im Web oft nicht vorgesehen. Mit der CSS-3-Technikdemo Opera Reader zeigt Opera, dass Pagination auch für Webseiten machbar ist und nicht nur E-Book-Readern vorbehalten sein muss.

In Pocket speichern vorlesen Druckansicht 78 Kommentare lesen
Lesezeit: 1 Min.
Von
  • Robert Lippert

Opera hat sich über die Pagination im Web, (sprich, die seitenweise Aufteilung von Informationen auf Webseiten) Gedanken gemacht. Es sei ein Rückschritt, wenn man nach der Erfindung des Buches wieder auf das von Schriftrollen bekannte Schieben zurückfalle. Dank CSS 3 könnten Webseiten heute wieder ähnlich durchblättert werden, wie man es von Büchern her kennt. Eine Technikdemo zeigt das Verfahren, das sich besonders für Touch-gestützte Eingabegeräte eignen solle.

Der Opera Reader demonstriert die Technik unter Windows, Mac OS, Linux und Android. Es handelt sich im Prinzip um eine experimentelle Version des Opera-Browsers, die einige der im Entwurf zu CSS Generated Content for Paged Media Module beschriebenen Verfahren umsetzt (wenn auch zunächst mit herstellerspezifischem Präfix).

Ein einfaches Beispiel sehe wie folgt aus:

@media -o-paged {
html {
height: 100%;
overflow: -o-paged-x;
}
}

Die Media Query legt fest, dass Opera Reader die Inhalte einer Webseite paginieren soll. Anschließend wird alles, was nicht mehr im aktuellen Browserfenster Platz findet, auf die nächste Seite ausgelagert. Opera beschreibt weitere Beispiele auf der Projektseite, dabei würden auch mehrspaltige Layouts, wie sie auf Magazinseiten häufig Anwendung fänden, unterstützt. Wesentlicher Vorteil der Technik sei es, dass sie rein per CSS angewendet werden könne (sofern vom Browser unterstützt), was eine wenig komplizierte, aber gleichzeitig flexible Implementierung in eigene Seiten erlaube. (rl)