Let me explain why.

Horizontal scrolling doesn’t come naturally to most web users.

1. People read vertically. Horizontal scrolling isn’t used in webpages often for the same reason text doesn’t span across a spread in publications: the long scrolls across a page will tire the eyes of readers much faster.
2. The mouse was designed for vertical scrolling. A horizontal website is hard to scroll. As a result, the majority of websites scroll up and down. Some of us has a four-way scrolling mouse and a 27″ widescreen monitor, but don’t you dare assume that all of your website’s users has the same privilege.

Should we always value usability above the “design” part of web design?

Yes! Usability doesn’t have to be uninspiring; it can lead to great designs that are not only practical but highly creative as well.

Today’s viewports are no longer a big horizontal rectangle. The websites we put out there may be viewed on all sorts of devices that supports both landscape and portrait mode.

Horizontal scrolling might work for some dezigner sites – or other sites that people expect to be “different” but not for the general internet public.

Since horizontal websites are not universally embraced by the web design community, those who design those kind of sites must live with a hope that they are advancing design and being innovative. They might think that a horizontal website is the new black.

Technology advance, designers create and users adapt. Maybe one day, the same will happen with horizontal websites. Touch-enabled devices like smartphones and especially iPad apps has made “swiping” a familiar user experience to most people. But swiping through views on an iPad, in an application is not the same as horizontal scrolling and does not provide the same delicious user experience.

So, this was my opinion and arguments against horizontal websites. Feel free to argue!

Launch site!

Credits and technical information

• HTML5 and CSS3
• HTML5 video
• ExpressionEngine CMS
• Zurb foundation
• Isotope by Metafizzy
• Responsive
• Addthis
• Search the site

Thanks to John at Apasje for design, and thanks to Ida Klingvall at Drammens Museum

Russ (singular and plural) is a participant in the traditional Norwegian upper secondary high school (equivalent to high school or the British equivalent to sixth form) graduation ceremony known as russefeiring (russ celebration). Tradition dictates that they wear the overall and the cap from the 1st to the 17th of May (in some places in Norway, they start as early as 16th of April) without interruption (except when sleeping), without washing any of them. Russ commonly drive cars, vans or buses painted in the same colour as their overalls and caps, often sporting large sound systems or lighting rigs.

“Revehiet” means Fox Liar in Norwegian… And this group of young gentlemen who bought the bus are hopefully going to catch some chicks with this?!

So, today I have added Disqus to my little blog here, since some of the topics I’ll be bringing up in the near future would be great to get some feedback on.

I have used Disqus for several client projects now, also in CMS’s that comes with comments out of the box.

Why not Facebook comments?

For a while Facebook comments seemed like a great way to get people to comment. Now, I find that people don’t always want to use their Facebook profile for all sorts of things. For me my Facebook profile is for private stuff, while I use my Twitter profile for work stuff.

Why not standard CMS’s comments?

People like social medias, and they like getting more friends, followers and what ever it’s called. Discus associates a comment with whatever the commenter choose to comment as.

You welcome to try Disqus on this blog-post – and feel free to actually discuss Disqus!

Launch site

Some specifications and credits:

Design by Brandlab OSLO

Html5 and some CSS3
Flexslider for portfolio slideshows
Elastislide for the thumbnail carousel
Tipped for tooltips
Font (Helvetica Neue Condensed) from webfonts.fonts.com
WordPress custom posttypes and custom taxonomy for portfolio and employees
Random background images + taxonomy image functionality by Karl Espegard at Apasje

Launch site

Webdesign and implementation for Union Scene – a concert and culture arena in Drammen rock city! An Apasje job and collaboration with Atle Lillehovde.

Two tips

Use responsive AND touch-enabled sliders. Touch-enabled means that you can use a finger to slide through the content on touch-enabled devices. In stead of tapping. This helps creating a smooth user experience. I have two favorites.

Flexslider is a fully responsive jQuery slideshow that is very easy to use. It also comes with delicious pictures of muffins and cupcakes.

Try Flexslider here

Elastislide is a responsive jQuery carousel.

Try Elastislide here

Your website is viewed on different devices with so many different formats and proportions that you can’t make a new version of your website for each possibility. Laptops, 30″ monitors, iPad’s and smartphones. Clients sometimes asks for a specific iPhone version, but thats often way over the top and a lot of extra work.

The solution is to make a website that responds and adapts to all of these possible formats and proportions. It’s built with percents and ems in stead of pixels. and responds to the size of the browser window that it’s views in. It doesn’t ask what kind of  device it’s on. It simply adapts.

Either if you are a web designer, front-end developer (or both) you must read this book by Ethan Marcotte. I believe Ethans approach represents a shift in how we code websites in the decade to come.