Vertikal war gestern: 10 schicke Webseiten mit Horizontal Scrolling
Vertikales Scrollen ist langweilig. Jeder macht es, es überrascht einfach nicht. Wir wollen etwas Neues sehen. Na gut, so schlimm ist es natürlich nicht. Dennoch: Der Bildschirm hat nicht umsonst zwei Achsen, und und auch Microsoft versucht mit Windows 8, unseren Horizont zu erweitern. Aber auch die nachfolgenden Seiten zeigen, dass horizontales Scrollen durchaus seine Vorzüge haben kann.
Joey’s Pizza
Pizza geht eigentlich immer. Und Joey’s Pizza weiß, wie man Hunger auf mehr macht. Die Webseite der Pizza-Kette setzt Horizontal Scrolling mit Fotos von lecker belegten Pizzen um. Im Vollbildmodus will man da fast schon in den Bildschirm greifen.
Horizontal Scrolling: Joey’s Pizza
Gavin Castelton
Der Musiker Gavin Castleton nutzt einen horizontalen Scroll-Effekt auf der Webseite zu seinem aktuellen Album. Zwar kann man nicht mit der Maus oder dem Touchpad scrollen, doch der horizontale Scroll-Effekt, der bei der Benutzung der Navigation ausgelöst wird, erzielt zusammen mit den Grafiken der Webseite einen schicken Effekt.
Horizontal Scrolling: Gavin Castelton
Peter Pearson
Peter Pearrcon ist ein Webentwickler aus London und stellt sich auf seiner Webseite mit einer interaktiven Horizontal Scrolling Webseite vor.
Horizontal Scrolling: Peter Pearson
Gudang Damansara
Der Möbelhersteller Gudang Damansara präsentiert sich auf dieser minimalistischen Seite mit einem Horizontal-Scroll-Effekt.
Horizontal Scrolling: Gudang Damansara
Asiance
Asiance ist eine asiatische Werbeagentur, die auf der Unternehmensseite horizontal scrollbare Sektionen einsetzt, um Informationen zum Unternehmen und Referenzen zu präsentieren.
Stephane Tartelin
Der Illustrator Stephan Tartelin nutzt eine horizontal scrollbare Webseite, um eine Kunstwerke in einer Galerie in Szene zu setzen.
Horizontal Scrolling: Stephane Tartelin
Makepretend New York
Makepretend ist ein Zusammenschluss von den New Yorker Kreativen Anna Vokal und Nate Turner. Auf ihrer Webseite nutzen Makepretend auf einen horizontalen Scroll-Effekt, der sowohl durch die Maus als auch durch einen Regler am unteren und oberen Bildschirmrand bedient werden kann und setzen so mit Text, Bild und Video ihre Arbeiten gekonnt in Szene.
Horizontal Scrolling: Marepretend
C.L. Holloway
Der Künstler C.L. Holloway setzt mit der Horizontal-Scrolling-Technik eine „virtuelle Galerie“ für seine Arbeiten um.
Horizontal Scrolling: C.L. Holloway
Collaborative Fund – The Future of Car Sharing
Collaborative Fund will uns mit einer virtuellen Autofahrt das Car-Sharing schmackhaft machen. Da Autos eher selten vertikal fahren, kommt auch hier die Horizontal-Scroll-Technik zum Einsatz.
Horizontal Scrolling: Collaborative Fund
Black 5
Was ist besser als Oreo? Wahrscheinlich gar nichts. Aber die Webseite von Grieson’s Black 5 weiß den schwarzen Klon der Kekse mit Horizontal- und Parallax-Scrolling schmackhaft in Szene zu setzen.
Und welche Seiten kennt Ihr, die Horizontal Scrolling gekonnt einsetzen? Wir freuen uns auf eure Lieblingsseiten in den Kommentaren!
Der Link http://www.joeys.de/list/classics führt beim ersten Aufruf auf eine Fehlerseite, es muss wohl erst der Standort festgelegt sein … 8-/
Teilweise wirklich schöne Beispiele mit dabei. Schade ist aber, dass die meisten Websites das horizontale Scrollen nicht komplett durchziehen, sprich auf mobilen Geräten wieder eine vertikale Version genutzt wird.
Bei unserer Website haben wir versucht, dass Konzept komplett durchzuziehen: http://361.de
War nicht einfach und manche Browser machen hier auch Ärger..aber wenn schon, dann konsequent. ;)
@ Andreas // Wow also eure Seite finde ich von den Beispielen mit Abstand am besten. Vor allem funktioniert sie am Ipad im Gegenstatz zu den anderen Beispielen viel besser und das Design ist schön clean und nicht zu überladen ;)
@David: Vielen Dank für das Lob! Gebe es gerne an unsere Gestalter und Entwickler weiter :)
Ist zwar im Bereich des vertikalen scrollens anzusiedeln,
aber hier kann man wirklich lange scrollen:
http://www.tealjoy.com
Ich glaub vor 10 Jahren hab ich die erste horizontale Site gemacht. Dazwischen immer wieder mal, wenns gepasst hat – und der Kunde mutig war ;-)
http://www.ausgezeichnet.com/karikatur-galerie/karikaturen.php
Mittlerweile auch responsiv:
http://www.manameierei.com/
http://shopdessous.at/ (man beachte die dezente Parallaxe ;-)
Die Sache ist oft etwas heikel. Manche jQuery-PlugIns und Touch-Bedienung machen Ärger, auch manche User beschweren sich.
Also ich kann mich mit dem horizontalen scrollen einfach nicht anfreunden. Das kommt mir einfach immer falsch vor :) liegt vermutlich daran das einem in der Webentwicklung immer eingetrichtert wird „horizontale Scrollbalken sind böse“. Aber gelernt ist gelernt. Ich denke sofort an einen Fehler wenn ich solche Scrollbalken sehe.
Das Beispiel von Andreas ist wirklich sehr schön, aber leider gilt bei vielen Webdesignern immer noch die Faustregel – Horizontal Scrolling ist ein No-go!
Auch ich persönlich habe mit dieser Scrolling-Art meine Schwierigkeiten, aus den gleichen Gründen wie Andi. Sicher, es ist mal „nett“ eine andere Methode zu sehen, doch wird wohl dies immer eine Randgruppe bleiben.
@Andi und @Torsten:
Ich gebe euch beiden Recht, es ist gewöhnungsbedürftig und auch unsere Entwickler haben uns zu Beginn den Vogel gezeigt.
Im Endeffekt sind wir aber der Meinung, dass diese Art von Websites für manche Einsatzzwecke funktioniert (Portfolios etc.), sicherlich aber kein Trend werden kann und sollte.
@Andi @Andreas @Torsten:
Ihr habt schon recht und zwar IMHO liegt es einfach daran, dass man bei den meisten PCs noch gewöhnliche Mäuse mit einem Rad bzw. Touchpads mit Scrollgesten einsetzt, was in der Regel für vertikales Scrollen ausgelegt ist. Die meisten Webseiten bzw. Widgets mit Horizontalen Scrollen lassen genau diese Art Bedienung komplett außer acht.
Horizontales Scrollen funktioniert teilweise besser auf Touch basierten Geräten wo man die Inhalte hin und her wischt. Es gibt aber auch Ausnahmen, z. B. wo durch die Verwendung von mehreren Scrollachsen die Bedienung erschwert wird.
Um Preisvergleiche für LEGO Angebote übersichtlich darzustellen, habe ich auch auf horizontales scrollen gesetzt. Es würde mich interessieren, was ihr davon haltet: http://www.brickmerge.de/
Hi,
da fehlt noch die Webseite von kaisers & tengelmann http://www.kaisers.de. Schön flach gehalten, da nicht viele Inhalte vorhanden sind.
nice day
Für so eine Webseite ist horizontales Scrollen okay….