Site Critique - ID

It doesn't matter if you do all the error checking in the world, or if you have the most beautiful graphics, if your site or application design isn't usable, it's not going to do well. Get input and advice on usability and user interface issues here.

Moderator: General Moderators

User avatar
Luke
The Ninja Space Mod
Posts: 6424
Joined: Fri Aug 05, 2005 1:53 pm
Location: Paradise, CA

Site Critique - ID

Post by Luke »

NOTE: The links in this have been removed (so as to not be indexed by Google). Send me a PM if you want to see the site.

It's time again to debut another ecommerce site. You know the routine... please try your hardest to break it in as many browsers and OS's as you can. Let me know where I've screwed the pooch. Nitpick nitpick nitpick. Thanks!

Site launch announcement...
[removed]

Direct link to the website...
[removed]
Last edited by Luke on Mon Aug 20, 2007 10:46 am, edited 1 time in total.
User avatar
superdezign
DevNet Master
Posts: 4135
Joined: Sat Jan 20, 2007 11:06 pm

Post by superdezign »

Eh, I got frustrated. Large images and 56k don't mix. I'm sure that was a choice of the client, but the headers could have been done textually. The lack of anti-aliasing on text is a user choice. Also, the sub-links at the top display the same URL in the status bar as the parent. Freaky. :P
User avatar
Luke
The Ninja Space Mod
Posts: 6424
Joined: Fri Aug 05, 2005 1:53 pm
Location: Paradise, CA

Post by Luke »

The lack of anti-aliasing on text is a user choice.
I totally agree. That was a battle I unfortunately lost. :(
Also, the sub-links at the top display the same URL in the status bar as the parent.
Yea, isn't that strange. It's something to do with an invisible parent element or something... annoying, but as of now I have no fix. Thanks for the nitpickiness. :)

EDIT: I must add though, that this is a fashion website. It was very important to them that their site be very pretty. A lot of things about the design were strongly enforced by the client.
User avatar
superdezign
DevNet Master
Posts: 4135
Joined: Sat Jan 20, 2007 11:06 pm

Post by superdezign »

The Ninja Space Goat wrote:EDIT: I must add though, that this is a fashion website. It was very important to them that their site be very pretty. A lot of things about the design were strongly enforced by the client.
And that it is. :)
Hehe, at first, I thought the home page was going to be Flash or JavaScript-controlled and the images would move upon mouseover. ^_^

I thought the squiggle lines in the menus that where on the left seemed a bit.. out of place to me.
User avatar
TheMoose
Forum Contributor
Posts: 351
Joined: Tue May 23, 2006 10:42 am

Post by TheMoose »

Nothing major I can find, but one really tiny itty bitty thing I did notice was that on a product with only 1 color choice, you can still get a hand-cursor in the blank space next to the main color choice.

Example: http://www.indigenousdesigns.com/shop/p ... n-pullover

Mouse over the space to the left of the Wheatgrass color box, it'll look like there should be another color choice (this is in FF 2.0.5). The average person won't notice it, nor care, but I figured I'd point it out anyway.

Hey, you said nitpick so I did! ;)
User avatar
Luke
The Ninja Space Mod
Posts: 6424
Joined: Fri Aug 05, 2005 1:53 pm
Location: Paradise, CA

Post by Luke »

you can still get a hand-cursor in the blank space next to the main color choice.
Thanks! Fixed.
User avatar
kaszu
Forum Regular
Posts: 749
Joined: Wed Jul 19, 2006 7:29 am

Post by kaszu »

If you enter in search 'cloating "Indigenous"' and search, quotes are escaped twice and appears in text box as " instead of "
I guess it would be fine if i wouldn't want to change a little query and search again.
User avatar
Ollie Saunders
DevNet Master
Posts: 3179
Joined: Tue May 24, 2005 6:01 pm
Location: UK

Post by Ollie Saunders »

Ninja in future come here before it's finished! That's how usability testing should be done.

Yeah the big images with text in them are quite eww but fair enough if your fought for it. You should however make them <img> tags and set the alt text to the text content instead of using CSS background images, same applies for the nav and a few other things. If you've got the web developer extension for Firefox and you choose Image > Disable Images > All Images you'll see you miss a lot of content. This is how screen readers (blind or those with impaired sight) and some 56kers will be experiencing your site. It looks like fixing that might be quite a big job though, sorry.

I would change the text on your search button from "Go" to "Search". Go is very ambiguous. I would also remove the navigation at the bottom because it's just duplication of what has already been seen at the top. Usually less important links go at the bottom, like legal stuff.

You could argue against the heading text on the 90 degree angle from a readability stand-point but personally I think it's cool enough to be worth of the sacrifice. What was the thinking behind the "Back to top" links? Does anyone ever use them?

I have to confess to feeling confused on the product detail pages. How do I get back to the product selection page I was on previously? I found this especially difficult when I had clicked on a few of the colours or added the item to my cart because I then had to press back several times to get off the page. It wasn't initially obvious that you can click on those colours and when I did I wondered which colour I had just chosen? Why hasn't the image changed (some instances)? Why are the colours moving around? The light colour choices have borders around them which makes them look like they have been selected, that really threw me. I liked the way you handle users forgetting to choose a size.

The search result page is nice. Personally I'd loose the line that appears under the thumbnails, there's another line directly below anyway. Your search result page doesn't validate incidentally. Also I noticed on this search, towards the bottom, there's an image is missing and perhaps this wasn't handled as well as it could have been.

Finally try using the text resize in a few different browsers.

Stuff I like:
  • Clean, engaging design
  • Breadcrumb
  • Strong site identity + moto
  • Obvious intuitive navigation
  • Sub section contents
User avatar
Luke
The Ninja Space Mod
Posts: 6424
Joined: Fri Aug 05, 2005 1:53 pm
Location: Paradise, CA

Post by Luke »

Wow, thank you ole! I agree with almost everything you said. I don't have to time to fix most of that right now, but I will definitely bring it up to my boss and the client. Thanks all of you!
User avatar
Ollie Saunders
DevNet Master
Posts: 3179
Joined: Tue May 24, 2005 6:01 pm
Location: UK

Post by Ollie Saunders »

Oh yeah and by the way I was impressed, very nice work Ninja.
User avatar
The Phoenix
Forum Contributor
Posts: 294
Joined: Fri Oct 06, 2006 8:12 pm

Post by The Phoenix »

The 1 second review: Looks pretty solid in Camino on OSX.
User avatar
iknownothing
Forum Contributor
Posts: 337
Joined: Sun Dec 17, 2006 11:53 pm
Location: Sunshine Coast, Australia

Post by iknownothing »

On 1024 x 786 Resolution in IE (at least), the Nav Bar mouseover throws a horizontal scrollbar to accomodate for the links that come below it, even though its not necessary, mayble having something to do with..

Code: Select all

.flyout {width: 100%;}
As the scrollbar gets bigger when you mouseover the links more towards the right.

Other than that, looks good.
User avatar
The Phoenix
Forum Contributor
Posts: 294
Joined: Fri Oct 06, 2006 8:12 pm

Post by The Phoenix »

Now I have more time to test, so..

CSS has some errors and lots of warnings. Most seem like easy fixes.

You have four navigation paradigms going. Top right, left, bottom, and then breadcrumbs below the top right. Thats a huge repetition of information, and really confuses things.

Adding an item to my cart results in a warning about an ssl cert for google analytics v. google itself. Not sure what the deal is there.

The news display wastes almost a fourth of the page on the left for no reason.

The search isn't well-indexed. Searches for wool, or merino both fail.

Some of the sub-pages aren't valid (x)html. (Search results = none).

The colors are nice, the layout of the content and the use of images is solid. But the confused layout for navigation makes it very cluttered.
User avatar
Ollie Saunders
DevNet Master
Posts: 3179
Joined: Tue May 24, 2005 6:01 pm
Location: UK

Post by Ollie Saunders »

You have four navigation paradigms going. Top right, left, bottom, and then breadcrumbs below the top right. Thats a huge repetition of information, and really confuses things.
I disagree. The only repetition is the bottom nav. Breadcrumbs and left are either showing something you can't ordinarily see or representing it in a different way both of which are important.
User avatar
Oren
DevNet Resident
Posts: 1640
Joined: Fri Apr 07, 2006 5:13 am
Location: Israel

Post by Oren »

As ole said, try to resize the text with Firefox - 2 steps and the layout is messed up.

P.S By 2 steps I mean: [Ctrl + "+"] x2 lol in case you can't read it, I mean while holding the Ctrl button press "+" (the plus sign in the keyboard) twice. Ctrl + "+" is like resizing with Ctrl + mouse wheel but with one difference: each step with Ctrl + "+" makes the text size much bigger than one step with Ctrl + mouse wheel. I really hope you understand this P.S :P :lol:

Ok, enough with all these words, I'll go back and try to find more things to break there :twisted: :wink: :lol:
Hmm... 6 emoticons in one post and a lot of meaningless words, I must be really bored :P (oops... that's 7 emoticons now).
Post Reply