Website Usability Thread

[Hazo]

I've been going through a fair bit of stuff recently on readability, usability and web standards. I seem to come into conflicting thoughts on many of the different issues and would like to hear others' thoughts.

Some of the questions I have:

1. To have the text change on hover? It seems all the old school authority sites do not have this. Then I hear that times have now changed and users expect it?

2. Size of the font? I actually prefer bigger text. It is easier to read and I find the page is broken up better. Things like bold stand out a lot more. But I believe the web standard is 12pt?

If you take a look here 113 Design Guidelines for Homepage Usability (Nielsen Norman Group) the text looks much bigger than 12pt. I actually like the text on the page.

3. Font - I have changed to Verdana because I read that it is the best for reading Web-Safe Fonts for Your Site I used to have it set to Arial.

4. Underline links - Is this how it should be or is it outdated? What about if the links underline when hovered instead? What is best?

5. Colours - I am using blue for links, purple for visited links and yellow for active clicks or whatever you call it. Is that standard? What do you use?

6. What about spacing, padding, htags. I don't know much about these at all. All I know is I like bigger htags. Do you guys play with the settings or leave as is?

Nick

[themike537]

1. No I don't do this.

2. I also prefer bigger text. I'm redesigning a few of my sites right now to have bigger text. All of Randy Ray's sites have very easy to read text, so I am going to use a similar set up on my sites.

3. I almost always use Verdana, but would like to learn more about different fonts.

4. I always underline my links, and remove the underline when a user hovers. I've always read that converts the best, and it seems to look the best IMO.

5. I use blue for links, purple for visited. I don't do anything for active links.

6. I like bigger htags, and sometimes I like to put a bottom border on H2's to help break up the page (the border stretches across the entire page).

[sirtiner]

You do what you think looks best, Htags should be bigger and links should be a color so you know its a link, other than that it dosent madder really, everyone have different taste.

I like to use either 12px or 11px for my text, 11px looks really nice in my opinion.

I like to be able to "feel" the site so hover is great, either by images or in links.

[Hazo]

You do what you think looks best, Htags should be bigger and links should be a color so you know its a link, other than that it dosent madder really, everyone have different taste.

I like to use either 12px or 11px for my text, 11px looks really nice in my opinion.

I like to be able to "feel" the site so hover is great, either by images or in links.

I don't want to do what I think is best - I want to do what my visitors think is best. That is why I am trying to ascertain the standards that they expect.
-------------------------------------------------------------------------

Is 14px too big for text?

[sirtiner]

everyone have different taste.

"Is 14px too big for text? "
I think its to big, make your code correct and have a zoom button so that 70 year+ ppl can zoom your site

[GregW]

1) I like having the text change on hover. Removing the underline or something like that. I like clicking on text links more than I do on images and images don't often change when you hover of them, so having them change when you hover is nice to emphasise that it's a simple text link.

2) I definitely like bigger text, but I'm guilty of not implementing it enough.

3) Arial and Verdana are obviously the 2 big ones. I've read that Arial works better for smaller font sizes like 10px and lower though. I've also heard that Verdana is slightly better for more standard font sizes but I don't think that there's a lot in it to be honest.

I personally wouldn't want to use any other font for large chunks of text.

4) Underlined links are more common so i'd say having them underlined and then remove the underline when you hover. I don't think this is a huge issue though as long as it's easy to spot links from other text on the page.

5) Sounds perfect. I really like having an active link state fwiw. It's nice to know that your click has been acknowledged. I think this one gets overlooked a lot.

6) I like good amounts of space. A good line height is a must along with adequate spacing between paragraphs. I can't remember but I think I sometimes increase the spacing between words, but it's not by much at all.



Other stuff.

Marking outbound links or links that open pdf files or email clients is great for usability. I wish more websites would make it obvious if a link is an outbound one by adding a little icon after the link through CSS. You can actually make an icon appear after an outbound/affiliate link with one line of CSS too.

You might be interested in the golden ratio for webdesign: The Golden Ratio in Web Design - Nettuts+. I've not designed anything with that in mind though to be honest.

[themike537]

Awesome post Greg, as usual. I'm going to add active links to my sites, I hadn't though about it like that before.

[Hazo]

Hey Greg - In relation to line 6, I don't know the actual code sizing. On your sites, what spacing, line height etc do you have. What is the standard. Does it change with text size etc?

What do you mean by marking outbound links? An icon appearing?
-----------------------------------------------------------------

I also noticed that on the useit.com: Jakob Nielsen on Usability and Web Design website for every link he has a short description of the page it is linking to so users know whether they want to click on it. What is everyone's thoughts on this? I haven't seen any other website do this.

[sirtiner]

"What do you mean by marking outbound links? An icon appearing?"

Having an image next to your outgoing link so ppl know its outgoing.

[Hazo]

Can someone show me an example please.