Fog Creek Software
Discussion Board




Website Critics Welcome

Hey,

I was reading that whole "Hyperlink Fixation" thang and bugger me if it didn't ring a bell.

I've just recently finished designing a web site for a company and had made the links a non-standard, yet site consistent color.

Guess what. My bunnies (non-tech users) first complaint was they had no idea what to click to move about (including the main menu - doh!).

I gave it a bit of a tweak, same color, but now links are outlined (you'll get it if you visit it) and my next set of bunnies didn't have a problem.

Sure, it's a small test using a total of 7 bunnies, but you work with what you've got.

If anyone sees anything else, please feel free to tag it and bag it.

Jack of all
Tuesday, July 01, 2003

hi jack,


did you use the same set of bunnies for both tests?

FullNameRequired
Tuesday, July 01, 2003

No, I used two different sets of bunnies.

and the website is http://www.resultswa.com.au/

Jack of all
Tuesday, July 01, 2003

The problem is you use red as a highlight and a related color orange as a link. And the orange is more muted than the red to boot, making it feel less important than all the red on the page.

Then the pictures have blue outlines around them to indicate that they're links. You should probably also add a "more" link becuase it's not obvious that you click on the photos, I had to check.

Nice use of CSS, btw.

www.marktaw.com
Tuesday, July 01, 2003

Oh, and red is a common link color, so the red framed photo may look like a visited link, and the photo of that woman is outlined in black - visually related to dark blue, and may look like a link.

www.marktaw.com
Tuesday, July 01, 2003

> red is a common link color

i.e. for visited links

www.marktaw.com
Tuesday, July 01, 2003

> Rockingham, W.A 6168

Shouldn't that be W.A. ?


Tuesday, July 01, 2003

My only comment for non-blue links is that I'm not sure if they're a link until I scroll over them. This is more of a problem witrh the link is within blocks of text.  If the link is blue, it's immediately obvious.  If it's not, then I have to guess, is this a link or colored for emphasis?

On the helpful tips pages - a printable version would be nice. 1/4 of the page width in consumed by the (mostly) empty left table column.

Nick
Tuesday, July 01, 2003

You should explicitly set the page background color to white. I have my window background color set to a slightly warmer color than white, and it is used as the color in your pages. Also, please add some whitespace around the links at the top!

Frederik Slijkerman
Tuesday, July 01, 2003

Not trying to bash here, but if you put your site under a microscope it will get dissected.

The main problem with the site is that you got the contrast inverted. Unimportant elements are the ones that are highlighted.

Your site has many bold red elements that pull the attention. Visitors will immediately focus on the Logo on the left, the balloon and especially all the bold red lines. It is hard to focus on the top links because of the thick red lines around it. Same for the main picture.

Make important things important and less important things less important.

The Non-Designer's Design Book, which is in Joel's books review section, goes more into depth about subjects like this.

Jan Derk
Tuesday, July 01, 2003

Hello "Jack of all" I'm from Perth W.A. too. Nice to meet a fellow sandgroper.

Matthew Lock
Tuesday, July 01, 2003

Under the microscope is the prefered method isn't it? Hell, it's not like I _have_ to follow your advice ;)


But seriously, thanks for all your input. It was excellent and most appreciated.

Jack of all
Tuesday, July 01, 2003

I'm afraid your bunnies have got it right. That site is confusing to navigate. It's almost completely mystery meat. Some links don’t look like links, and some non-links do. The only way to tell what’s clickable is to wave the mouse around. With JavaScript turned off, a lot doesn’t work.

Troy King
Tuesday, July 01, 2003

On a Mac with IE 5 or NS 4.7, the site is pretty bad. Nothing displays where it should, and some text is not readable.



But I'm probably the minority. :-)

Mark
Tuesday, July 01, 2003

Why not just use blue links? The orange links don't add anything for me aesthetically, and they don't look like links.

You have some blue in the design, maybe blue links would look good?

Fred2000
Tuesday, July 01, 2003

Fred... Shhh, that's too simple.


Tuesday, July 01, 2003

I just looked at this old site I designed a few years back whose link colors weren't blue, and I think it's pretty obvious what's a link and what isn't because it still follows the "different color, underlined with no other decoration (i.e. bold, italic)" convention.

http://www.marktaw.com/pettycoat/

Your site makes links bold, and not underlined. It may work on other sites - I saw it on a web log to pretty good effect, though I still had that split second of 'is that a link' ? But also the intense density of links on that blog site - one per sentance at least - meant you visually were able to associate the side nav with the text in the paragraphs, etc.

Also, my site has a sort of burgundy background (my girlfriend would be able to tell you what color that is), so you don't expect blue links. But your site has a white background, and the world is trained to think "white background - links will be blue, purple, red, or gray, underlined, non italic, non bold and underlined." - Google follows this convention, even if the use gray not as "visited" but as "not as important."

Stick with blue links, I think they're more professional looking anyway. If sites like http://www.microsoft.com and http://www.citigroup.com can pull off blue links, I think you'd better try to too if you want to emulate them.

Then again the Remax site ( http://www.remax.com ) has red more buttons AND red text on the page. What's up with that? And again red links on the bottom of the page (I call that stuff meta navigation). And none of them are underlined.

I think Remax needs some usability testing.

Good luck with the site.

www.marktaw.com
Tuesday, July 01, 2003

What is wrong with a blue under-lined links?  It seems most websites nowadays seem to get cute when it comes to hyperlinks.  Blue under-lined links are the defacto standard for hyperlinking.  Just like a button on a form is to be clicked, a blue-underlined link is to be clicked.  Makes it very easy for users to deduce functionality.

Unknown
Tuesday, July 01, 2003

*  Recent Topics

*  Fog Creek Home