Navigation - look, feel, layout, conventions...

[gogo]

Hi I've been looking at a lot of mobi sites esp navigation (planning my own!) and it seems there are some conventions or trends out there.

I'm interested in what you've seen, what you like/dislike, what you think is effective.

What I've noticed is:


1. many start links with a little triangular arrow

2. some use access keys, sometimes number is in a box of its own

3. often the background colour of links alternates so the page is striped (is this to add interest or to make it easier to read/scroll?) Do you like/dislike this striped effect?

4. often the convention of underlining links is ignored (not just on mobi) - on mobi does the user find it obvious what is a link?

5. few indicators of what page you're on, no obvious convention of how to show that... often a link at top and bottom of page to "home" - how best to indicate that you are on the home page?
(elsevier.mobi gives a nice tabbed indicator at the top of the page, unusual)

Do the users know how to use these sites? Torbay.mobi gives them a good page of instructions.

6. Should whole nav menu repeat on all pages? Faster than going back to home to look for it - I was thinking you could place the content above it and just repeat the nav menu below that on each page.

There are a lot of possible strategies...

[Scandiman]

Hi I've been looking at a lot of mobi sites esp navigation (planning my own!) and it seems there are some conventions or trends out there.

I'm interested in what you've seen, what you like/dislike, what you think is effective.

What I've noticed is:

Glad to see I am not alone in my quest for the "best" mobile user interface. Of course there is no "best", just different concepts that are being used and without a doubt many people will have their unique preferences.


1. many start links with a little triangular arrow
The ability of phones to display icons like this will vary so I won't be basing a design on it.


2. some use access keys, sometimes number is in a box of its own
Using access keys on a site requires a commitment to keep the number of links to 10 or less per page. If used I think it should be used consistently throughout a site and the numbers need to be included.


3. often the background colour of links alternates so the page is striped (is this to add interest or to make it easier to read/scroll?) Do you like/dislike this striped effect?
I like the effect with the appropriate colors used but I think sites can work fine without it as well. This is a "taste" thing that is an easy way to add some color to a site that aids in navigation rather than just adding color for color's sake. It is useful to test colors on real phones in real conditions. What looks good on our computer in our office won't necessarily look good on a mobile device while sitting on a sunny bench. If people struggle to see a site they will likely move on.


4. often the convention of underlining links is ignored (not just on mobi) - on mobi does the user find it obvious what is a link?
This is one of those things that varies from phone to phone as well. What's most important is the links are dealt with consistently in an entire site and that they are obvious. A slight color change with no underline or highlight can easily be missed by a mobile user in real world environments.


5. few indicators of what page you're on, no obvious convention of how to show that... often a link at top and bottom of page to "home" - how best to indicate that you are on the home page?
(elsevier.mobi gives a nice tabbed indicator at the top of the page, unusual)[quotes] I like clickable breadcrumbs at the top and bottom of every page to give a mobile user easy access to any stage in their nav path. A change in page title and header text is also useful. Again, consistency is imperative.

[quote=gogo;14192] Do the users know how to use these sites? Torbay.mobi gives them a good page of instructions. an instructions page is a great idea. Hadn't considered it before.


6. Should whole nav menu repeat on all pages? Faster than going back to home to look for it - I was thinking you could place the content above it and just repeat the nav menu below that on each page.For me I'm going with breadcrumbs to help people get back to where they want. But I probably won't have the same homepage links on every page. For one, if using nav keys it will consume the available numbers and I'm also concerned with page bloat and content relevancy for the page. But that is my preference and I don't see anything "wrong" with doing it, just keep it consistent throughout the site.

[gogo]

Hi Scandiman, thanks for all the comments. I completely agree about the need for consistency.

My idea for a small site is just 10 pages so it can all be done with access keys, just repeating the menu each page and showing the current page differently in the menu.

Not sure that the hover property exists in all mobile phones, nor am I sure they'll all show the state of the link - visited link may not change colour? So it seems better to use other indicators.

Are you using a simple breadcrumb trail with active links in it?

Love to hear what anyone else has to say about navigation.

http://torbay.mobi/howto.php

[Scandiman]

Are you using a simple breadcrumb trail with active links in it?Yea, check out creeds.mobi

[GijsZePa]

Yea, check out creeds.mobi

I use the same 'technique' ...

Developing quite a large site with multiple levels. Breadcrumbs are the best way to deal with it. 1 click and you are back on track...instead of back back back back....

Martin

[gogo]

Hi I like breadcrumbs too... this to me is raising other issues:

how small can you make text?
ie before it gets unreadable or tedious (and who knows what fonts the phones have?)

how much will people scroll?
ie do they prefer to see the max of info on the screen even if it is tiny? or would they rather have larger text and scroll more?

not sure the usual accessibility criteria apply- not heard of a mobile phone with a screenreader in it! Yet!

Not sure I've come across a mobi site yet with liquid/scalable design -
a lot seem to set a width limit in px (not %) so presumably on PDA you get the same small display you get on a mobile.

[Scandiman]

Hi I like breadcrumbs too... this to me is raising other issues:

how small can you make text?
ie before it gets unreadable or tedious (and who knows what fonts the phones have?)

how much will people scroll?
ie do they prefer to see the max of info on the screen even if it is tiny? or would they rather have larger text and scroll more?

not sure the usual accessibility criteria apply- not heard of a mobile phone with a screenreader in it! Yet!

Not sure I've come across a mobi site yet with liquid/scalable design -
a lot seem to set a width limit in px (not %) so presumably on PDA you get the same small display you get on a mobile.Font size is another one of those phone dependent things. We can't sweat it too much. As for scrolling I think it is generally accepted that vertical is OK but horizontal is to be avoided. I've done both fixed and floating width designs. I like the style control of fixed width but of course there are so many phone display sizes out there that one size will never fit all. That's why I'm working on using WURFL to have 2-3 different sized versions of each site and direct the appropriate sized version to a given users phone. It's more work but ultimately is better for the user.

[gogo]

I like the style control of fixed width but of course there are so many phone display sizes out there that one size will never fit all. That's why I'm working on using WURFL to have 2-3 different sized versions of each site and direct the appropriate sized version to a given users phone. It's more work but ultimately is better for the user.

Yes this seems key - seeing an unnecessarily small site on a bigger device could be disappointing.

I'm wondering if when more people realise you can redirect .mobi to various sized sites that will boost sales/use. There are a lot of domains where all the TLD extensions except mobi have been bought up and parked, so if you really want to build a site on that domain you could buy the mobi and offer it as both mobile and PC site. (getting off topic)

Back to navigation and accessibility, does anyone know if there are applicable accessibility requirements for .mobi sites the way there are for others (often ignored)?

Phones may not have got there yet but some seem to at least have screen readers for numbers eg

http://www.guardian.co.uk/technology/2007/oct/11/guardianweeklytechnologysection.mobilephones


For mobile users with hearing or sight problems, there are a couple of specially made handsets that are much easier to use, such as the Emporia Life phone. With large text and a high contrast screen that can be read even in bright light conditions, and with large well-spaced buttons, it is good for partially sighted people who want to use their phone for text messaging.
The Easy5 mobile is a much more basic handset that has five main buttons for pre-programmed numbers only, with no screen for texting or other features. For people with hearing problems, there are many accessories that can aid mobile usage, such as induction loops or hooks which can increase the volume and block out any noise interference.
Even some ordinary handsets have features that make them easier to use for people who may have sight or hearing difficulties, such as a voice that tells you where you are in the menu or phonebook, or which numbers you have dialled.

[coast]

Font size is another one of those phone dependent things. We can't sweat it too much. As for scrolling I think it is generally accepted that vertical is OK but horizontal is to be avoided. I've done both fixed and floating width designs. I like the style control of fixed width but of course there are so many phone display sizes out there that one size will never fit all. That's why I'm working on using WURFL to have 2-3 different sized versions of each site and direct the appropriate sized version to a given users phone. It's more work but ultimately is better for the user.

I agree to keep it vertical - my Samsung doesn't have a horizontal scroll, and I'm guessing most phones designed for voice wouldn't have considered adding a feature like that.

[Scandiman]

I agree to keep it vertical - my Samsung doesn't have a horizontal scroll, and I'm guessing most phones designed for voice wouldn't have considered adding a feature like that.my cheap nokia will scroll horizontal, but it's a serious pain to read text that flows off the screen and then wraps to the next line.