7 Score and 10 List Items?


Street Art

You’ve done the Information Architecture (IA) of the site months ago, the high resolution (graphic) designs of the side are finished, the site is cut and have been implemented into the CMS. The client has been busy filling the IA structure with content. This is when you discover that the carefully mapped menus are suddenly growing.

Now anyone involved in the web industry knows that a web site will only remain static and unchanged for a few minutes (at best) after you launch. So why the concern about the menu creep. Well just like with your interface style guide you would have left with the client (which they will ignore) you would also ensured that they have a hierarchy and navigation guide.

So how do you tell the client that maybe that new items are a little much, now Donna Spencer ponders this and when is a navigation list too long. As we know the 7 is enough rule is all very well and good but has no real substance in proven research.

In the Past

Interestingly has anyone considered that maybe the 7+2 as the number of items for a navigation list, comes from the the graphical design aspect and not the any IA or wireframing prototype restriction at all.

Let us think back, way back to the early days of the web, back when we were all designing for the base of 640 pixel wide screen. Back then it was about only 7 items that our could get across the top of a horizontal menu system.

As for vertical navigational list, it was around 10 items that drop the list to about 3/4 of the page height. So from a personal view this is where I remember this little gem from. And does it frankly apply to today. No.

Making it Long

Okay so you can have the list as long as you like, as long as it is usable, you have tested it right? That said this still doesn’t allow for the consideration of where you are going to put this navigation. I have seen and worked on some shocker sites, ones with layer on layer of ten to twelve items, and then left and right column lists of 30 to 40 items. Now all these navigation lists may all work well on their own but the total sum on the page is just visual and mental overload. Where do you start. Typically the bounce rate on these sites is very high.

The solution is simple, segment and paint in some white space around it all. Give the eye a break. You can still have your 100 to 200 links off the home page, but by segmenting and categorising on a function or informational level we can present smaller visual segments that can be taken in faster and with ease. Combine this with the use of simple design contrast, to give a little meaning, and a crowded page can be made very usable.

Another consideration is stepping off the grid. Yes, step off the grid, well not really off the grid fully, but the use of minor offsetting and curved elements can force visual direction and breaks.

This use of standard design techniques is something that is some what lacking in the area of wireframing and low resolution prototype development. In a way this is detriment to the overall site design for complex pages. Here is a classic instance where the IA and the designer need to work very closely to formulate the final product. Especially if there is a mandate to maintain the high page link count.

Mind the length

So even if we can have long lists of items, from a personal view I would try and restrict the length of the labels for the navigational items, there is just nothing worse than being presented by a list of navigational items that look like they have been written by a committee of lawyers.

So if the length of the list isn’t important, surely the label length and the placement is, what do you think, right, wrong or maybe?

Tags: , , , , ,

Looks like there is no conversation here yet, why not start one.