40 of the Best Horizontal Scrolling Websites

By / Nov 17, 2009 / Inspiration
shares

Horizontal websites have become an underground phenomenon. A horizontal website is a lot like your artsy younger sister who dresses weirdly and doesn’t seem to acknowledge a world outside of her own imagination. Since horizontal websites are not universally embraced by the web design community, those who design in this genre must live with a hope that they are advancing design in some small way.

Horizontal designs are not for every type of website. It works superbly well with portfolios or photo galleries, but not so much with word-driven sites like blogs.

Horizontal designs are not for every type of audience. Grandparents can’t handle it. Basically, anyone born before 1970 can’t handle it. These designs are best suited for those looking to make their website an extension of their art. It also says a lot about your brand. If your brand is quirky, bold and mind bending, your audience will expect an equally expressive web design.

But What About Usability?

Let’s face it. Usability is an extremely important part of web design and horizontal websites are not very user friendly– yet. However usability is not the most important part of the equation. Those who elevate usability above all often minimize the “design” part of web design. Yes, you can design a very stylized and usable website, but where’s the futuristic and imaginative thinking within a vertical rectangle? The future is a horizontal rectangle. Let’s not forget that there was a time on the internet when the JPEG was not welcomed in web design, because it caused slower loading times. Technology advanced, designers created and users adapted. One day, the same will happen with horizontal websites.

Usability aside, horizontal websites are here to stay. Here’s a look at some of the most inspiring, cutting edge, in-your-face-and-not-going-anywhere horizontal sites.

1. Alex Flueras Photography

This art gallery style website features clean lines and lots of negative space. The simple color scheme makes it very easy on the eyes.

2. Bartle Bogle Hegarty

Keep your eye on the sheep, it leads you home. Aside from the fact that this site is horizontal, it features spectacular transitional animation well worth the loading time.

3. Carrot Creative

Carrot Creative features smooth transition and an understated humor. Take a few minutes to explore this site for hidden photos of robots and directions by dinosaur. Very creative.

4.Charlie Gentle

If you like bokeh, you’ll love the way that this site makes it multi-dimensional. The site is simple, but beautiful.

5. Candice Holloway

Another art gallery, this time with framed images and a smoothing background color. It’s straight forward and no frills, but it makes its point effortlessly.

6. C’N'C Costume National

For those of you (ahem, including this writer) who think that blogs should not be horizontal, this site seeks to prove us wrong. Admittedly, this style is not for everyone, but it does have an urban vibrancy that makes you want to scroll through.

7. Dean Oakley

What list would be complete without this entry? Dean Oakley is practically synonymous with horizontal scrolling.

8. Dustin Curtis

Slightly morbid, but none the less compelling, Dustin Curtis’ horizontal website probably reveals a bit more than you ever wanted to know about him.

9. Exit 10 Advertising

This is not your average horizontal scrolling site. It takes you in all types of directions. Fortunately for the user, the navigation bar is always on top so that users can easily move through the site.

10. Elfletterig

Elfletterig is a Dutch site that features a straight-forward horizontal scroll. The reason this website wins a place on this list is the tag-a-long navigation that keeps you from having to scroll all the way back home.

11. Eolo Perfido Photography

The images will haunt you long after you’ve move on to another website. Horizontal scrolling is the most appropriate way of showing Eolo Perfido’s achingly amazing photographs. The scroll silently narrates you through the range of human ideology.

12. Eric Johansson

And for something in a totally different direction, here is Eric Johansson’s cutesy website with its own scroll bar at the bottom of the page. Love the use of lens flare.

13. Faub

Faub is a different type of website, similar to Exit 10 from the no. 9 spot. What makes Faub stand out is unusual navigation. Probably the least usable website on this list, but also the most extraordinary, users must drag the page in order to view content… what little content there is.

14. Frank Giacobbe

Not only does the whole website scroll, so does the menu bar. It features a huge amount of white space and efficient navigation.

15. Front End Design Conference

This site features adorable mascots and bold arrows. Although it’s not exactly the most innovative design, the site works, and keeps users moving forward.

16. Paolo Boccardi Photography

The art on Paolo Boccardi’s site is numbered and makes it easy to navigate. The navigation also features a sneak peak of each photo before clicking.

17. Graphic Therapy

No scroll bar but an invitation to drag the screen left or right. Who can resist the smooth dragging motion Graphic Therapy offers its users?

18. Gavin Castleton

There’s no doubt about it. This site makes you sit up and take notice. Who is this guy and why is he decomposing? Clearly, these questions beg to be explored. Features super fast scrolling. No worry about decomposing while waiting for the page to load.

19. Hotel Oxford

This hotel has a site with a smooth scrolling transition. No jarring stops or starts. Elegant and clean.

20. Handmade Interactive / Jason Love

This design gives you the option to go left or right from the start. Where do you go first? For the horizontal newbies, designer Jason Love makes it clear how to use the site with his cleverly hand-drawn arrow.

21. Hasrimy

Surprisingly content-heavy, Hasrimy packs a lot of punch for a genre that normally features sparse content.

22. Les Hautes-Mynes Du Thillot

French website with a smart navigation bar that follows you wherever you travel on the site.

23. Here Design

Here Design features a slower but very smooth scroll between images. Not only can you navigate with arrows, but you can also select numbers.

24. Contraband

Contraband is a photo essay with amazing images and a smart roll over info box. User can scroll on their own pace or choose auto scroll.

25. Ladio

This Russian site features insane navigation that is certainly not user friendly, but its creative approach to design fills all visitors with awe and wonder and curiosity.

26. Lomotek Polymers

Lomotek has a stable navigation that sometimes gets in the way of content, however it’s always a good thing to have an accessible navigation menu.

27. LoveBento

This site has an interesting design scheme with colorful panels. Interesting concept for an often-updated website.

28. Lucuma

The colors on Lucuma are brilliant. The navigation is out of this world. You will find yourself scrolling back and forth just to see the transitions again.

29. Luke Larsen

If you’re not into goldfish, you may want to avoid this next website by Luke Larsen. This website is heavy on the goldfish but just as heavy on the scroll. Be sure to scroll vertically to read all of the information on his site, and to see more goldfish.

30. Magpie Studio

The letter of the day is “M.” Who knew there were so many different types of Ms in the world? Aside from the Ms, be sure to look through the Selected Projects for some real scroll action.

31. Make Pretend

This site is for anyone who can’t take a hint. In no uncertain circumstances, users who visit Make Pretend know to scroll right. Unfortunately, the lack of a visible scroll bar may stump a few people.

32. James Stone / Mime Artist

This beautiful, dark site is striking without relying too heavily on imagery. Navigation is done by clicking menu items. No manual scrolling here. Lots of content but, at times, difficult to read.

33. Peter Pearson

Directions are lovely, and necessary when presenting information through a horizontal scrolling site. Peter Pearson gets it, and explains to users that they need to move to the right. Brilliant and ethereal.

34. Richard Arran Landscape Photography

This site does a good job of conveying an art gallery feel. The images are easily clickable for a close up.

35. Ricky Cox

Ricky Cox features several sliding windows within one vertical website. This is a combination rarely seen, and it works here because of its smooth manual scrolling and clever design.

36. SectionSeven Inc.

Hover your mouse to the left or right part of your screen and watch the coding do all the work. Beautiful colors, easy transition and seamless components make this website a joy to scroll through.

37. Tyler Finck | Sursly

The transition from Home is completely amazing. Worth checking it out just to see the incredible transition.

38. Stephane Tartelin

Artsy, interesting, and well done. This site features a static navigation bar which is a wonderful idea that makes any horizontal site instantly user friendly.

39. Tinkainteractive

Tired of clicking? Tinkainteractive gives you the ability to hover to scroll, giving your index finger a much-needed break. Very nice color scheme.

40. Vanity Claire

Vanity Claire features lightening fast scrolling, bold colors and lots of negative space to ease the transition. There is no scroll bar, but the very prominent menu bar allows you to go back, forward or return home. What a beautiful site.

About the Author

Jacqueline is an award winning writer for hire and brand authority. Find her on her website, and follow her updates on Twitter and Google +.

42 Comments

  1. Josh R.
    November 17, 2009

    Nice list. Some good some not. I humbly submit my design as well.

    Reply
    • Dan
      January 8, 2010

      Josh, I’m liking your minimalist with hidden maximist :) (your multiple horizontals within a nice wide screen frame)

      Reply
      • Josh R.
        June 28, 2010

        Thanks. I appreciate it. The beginning of this year I went in a different direction. Loved the horizontal scroll but I want more stickiness and more interactivity. The new site has been a hit so I hope you like it as well.

        Reply
  2. Jonathan (twit:cjonius)
    November 17, 2009

    I like this compilation, am having a plan to a horizontal website as personal web and this compilation makes me think again the way to implement my idea.

    Kudos…

    Reply
  3. Selvam
    November 17, 2009

    inspiring ;)

    Reply
  4. designfollow
    November 17, 2009

    great collection

    thanks you

    Reply
  5. rodrigo
    November 17, 2009

    include http://www.marianaonate.com

    Reply
  6. Orlando Web Designing
    November 17, 2009

    Good to see such useful articles. Very helpful. Thank You.

    Reply
  7. Adam Wood
    November 17, 2009

    Really like Dean Oakley’s site. Especially in that he achieves an almost identical effect as BBH, without any flash. I almost left BBH waiting for it to load.

    Reply
  8. Freya
    November 17, 2009

    Great list! And this is another post I immensely enjoyed by Jacqueline. She has a great eye and very creative at making lists.

    Reply
  9. Caroline
    November 17, 2009

    Loving Dean Oakley’s site as well.

    Reply
  10. Architela
    November 17, 2009

    Horizontal scrolling still seems outré, but I’ve really come round to it for the right content and if well-designed — it’s a more natural and comfortable eye movement.

    Reply
  11. Sasha
    November 17, 2009

    Very nice list and may I add Cool Iris.

    http://www.cooliris.com/

    While not really a site, more of a search engine, it’s a fantastic example of horizontal scrolling.

    Sasha

    Reply
  12. Web Design Kent
    November 17, 2009

    Some very good and brave web design but a few are let down by their vertical height, it shouldn’t ever be greater than 768 for horizontal scrolling websites, I agree that visitors don’t mind the page fold and its bad design to cram too much in but you can’t live with 2 page folds

    Reply
  13. Chris
    November 17, 2009

    Ugh — pretentious and silly. Horizontal scrolling isn’t natural or easy, and each one of these use a slightly different protocol for the scrolling. With horizontal scrolling, it’s now the user’s task to get text and art positioned perfectly. No Page Up/Page Down/Home/End keys, no scrollwheel action, and woe is you if you’ve got a trackpad.

    Why not diagonal scrolling? That would be even more boundary-shattering.

    Reply
    • Tom
      November 18, 2009

      I agree completely. This is the stupidest trend in “designy” web sites since they were all flash.

      It’s a triumph of form over content.

      Reply
  14. Andy Morris
    November 17, 2009

    This is a great list. There are some really unique sites on there. My company site uses horizontal scrolling of a transparent layer for our team members. http://www.hotcakesnewmedia.com/whoweare.html .

    Reply
  15. Perry
    November 17, 2009

    I was born in 1968.
    I was able to handle all of these sites.

    Nice list by the way.

    Reply
  16. Craig
    November 17, 2009

    Nice list.

    Even though its not just a horizontal scrolling site, Auxiliary’s site is awesome.

    Reply
  17. Greg
    November 17, 2009

    I think there are some nice designs on this list, but some of the sites would probably work better with a vertical sroll, as they become too “messy” when there is a lot of text on them.
    -I prefer to look at images horizontally, but read vertically.

    btw, I also sport a horizontal site. Feel free to take a look and

    Reply
  18. Daria Kempka
    November 17, 2009

    Great post! I love horizontally scrolling websites when they’re done well.

    This guy has a nice collection of horizontal websites too. He won the 2007 SXSW award for best CSS site.

    http://www.thehorizontalway.com/

    Reply
  19. Alex Flueras
    November 18, 2009

    Thanks so much Jacqueline for featuring my site, album.alexflueras.ro !!

    Reply
  20. Noel Wiggins
    November 18, 2009

    I think whenever major changes like this happen it makes it harder for a user to “figure” out what to do.

    Most visitors are used to scrolling down not left and right. But if they can figure it out soon enough which can be measured by the bounce rate from a web stat. This type of navigation and presentation could be a refreshing change.

    Especially for design studios this is a great way to stand out and let future prospects know that you think differently…

    Thanks and Regards

    Noel for Nopun.com
    a graphic design studio

    Reply
    • Tom
      November 18, 2009

      “Especially for design studios this is a great way to stand out and let future prospects know that you think differently…”

      ie. think worse.

      Reply
  21. Peter Pearson
    November 18, 2009

    Thanks for the feature!

    Reply
  22. Lara
    November 20, 2009

    Great list, thanks for featuring Candice Holloway’s site!

    Reply
  23. TinkaInteractive
    November 22, 2009

    Hi Jacqueline! Just want to say a BIG thank you for including my site.

    Reply
  24. Simon Carr
    November 22, 2009

    These are some really great websites. Although I typically don’t like horizontally scrolling sites, many of these are quite intuitive.

    By far my favorite on the list is #37 – Tyler Finck. Wow!

    Great job putting together this list of sites!

    -Simon

    Reply
  25. Waasys
    December 8, 2009

    I really like horizontal scrolling, always loved it!

    Reply
  26. Dan
    January 8, 2010

    I’m loving all the smooth transitions on Lucuma, it’s working for me. I’m just a little wary that I’m getting malicious site reports when I’ve been heading to the blog link. Haven’t gone any further than that, but the ‘safe’ stuff is great for UX inspiration

    Reply
  27. Guga
    February 6, 2010

    My horizontal website: http://www.elastika.org
    Thank you

    Reply
  28. Anna Pitt
    May 5, 2010

    Thanks for the great article about horizontal scrolling which inspired this piece: http://rosieclare.me/O2Tales/tubetrain.html

    Anna

    Reply
  29. Wows
    June 7, 2010

    Hi,

    I really like the list, my own portfolio site is horizontal as well: http://www.wows.nl

    Regards,
    Wouter
    Wows.nl

    Reply
  30. Ryan
    August 12, 2010

    Wow. These sites are designed oh so nice! thanks for the post

    Reply
  31. egyptian web designer
    August 25, 2010

    A really amazing collection,
    My favorite one “Graphic Therapy” it’s clean and good.
    Alex Flueras, I like your website…

    Reply
  32. Sophie
    February 29, 2012

    Amazing job! Thank you

    Reply
  33. Chris Hitchcock
    March 26, 2012

    Great Article, we may use some of the concepts on our next site.

    Reply
  34. Alex
    April 4, 2012

    Thanks a lot for the awesome article. This inspired us to do this masterpiece: http://pinkundadel.de
    Keep on writing good stuff – good job!

    Reply
  35. Web Design Inspiration Today
    September 20, 2012

    Nice list! I haven’t add most of them to my own collection, I will add them soon.
    Here is my collection: http://webdesigninspirationtoday.com/design/style/horizontal

    Reply
  36. Robin
    June 3, 2013

    fabulous list of horizontal scrolling menus.
    Always useful tools to have.

    Reply
  37. Micah Grafsgaard
    June 24, 2013

    I think http://www.myspace.com deserves to be added to this list. Just a suggestion. Cheers!

    Reply
  38. Andreas from 361°
    November 7, 2013

    Very nice list about horizontal scrolling websites.
    We did also a horizontal scrolling website for our ad agency and the usability part was the hard stuff.
    Hope you enjoy it and we would love to hear some feedback. Our website: http://www.361.de

    Reply

Leave a Reply