Websites with left and right arrow keyboard navigation
I wrote this post a while back. The content can still be relevant but the information I've linked to may not be available.
Over the last week or so I have come across several websites that allow users to navigate using the left and right arrow keys. I think this is an interesting approach and I really like this method of navigating a website. Perhaps it's just me but I like using keyboard shortcuts (because they seem to allow me to do things faster) …. so it's interesting to see websites using the left and right keys in this way. Here are the website examples I have spotted that use this method.
- Crush + Lovely. This is a fantastic design and the left and right keys enable you to scroll between the various content sections. Try it and see!
- Pictory is a photo story website and it uses left and right keyboard navigation in a similar way.
- Thinking for a Living uses left and right keys for horizontal scrolling between sections/pages.
- OnSugar uses a left-right arrow key method to navigate between images in a gallery.
There is an adding keyboard navigation tutorial at jQuery for Designers which explains how a similar effect is achieved with an image slider. The jQuery Tools website has Scrollable which enables a content slider to be navigated with left-right keys.
There may be disadvantages to this method but I'm keen to find out more about it so if you know of other websites that use this approach, let me know.
Comments
08 Mar 2010 09:31:14
This is a different approach to website design that I’ve not really seen done successfully before. In many ways it’s a modern version of the original one page websites that filled the internet in the early days, however much more refined. The multiple background capabilities and smooth scrolling options offered by the jQuery implementation gives the sites a very polished effect, and the usability of the keyboard enhances this.
I can see many applications for this type of site design, most notably for freelancers who quite often prefer a single page portfolio. The capability of being ably to style each section accordingly, with a floating left menu makes the design very usable and adaptable.
I wonder how much of this style we will see in the coming months, if it will catch on and have widespread implementation. I would like to know how SEO could be successfully performed on the site, as the obvious lack of pages means meta data must be limited.
08 Mar 2010 13:05:01
@Stephen: One page sites seem to be more prevalent recently but they do have their SEO disadvantages as you mention… and for most clients I would not advise this type of website.
23 Mar 2010 17:42:41
I have a one page site with left + right + up + down arrow navigation :)
25 Mar 2010 12:55:22
@Manu: Nice one. Thanks for sharing.
Comments are OFF for this post.