Site Critique - ID
Moderator: General Moderators
Site Critique - ID
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]
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.
- superdezign
- DevNet Master
- Posts: 4135
- Joined: Sat Jan 20, 2007 11:06 pm
I totally agree. That was a battle I unfortunately lost.The lack of anti-aliasing on text is a user choice.
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.Also, the sub-links at the top display the same URL in the status bar as the parent.
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.
- superdezign
- DevNet Master
- Posts: 4135
- Joined: Sat Jan 20, 2007 11:06 pm
And that it is.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.
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.
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!
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!
- Ollie Saunders
- DevNet Master
- Posts: 3179
- Joined: Tue May 24, 2005 6:01 pm
- Location: UK
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:
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
- Ollie Saunders
- DevNet Master
- Posts: 3179
- Joined: Tue May 24, 2005 6:01 pm
- Location: UK
- The Phoenix
- Forum Contributor
- Posts: 294
- Joined: Fri Oct 06, 2006 8:12 pm
- iknownothing
- Forum Contributor
- Posts: 337
- Joined: Sun Dec 17, 2006 11:53 pm
- Location: Sunshine Coast, Australia
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..
As the scrollbar gets bigger when you mouseover the links more towards the right.
Other than that, looks good.
Code: Select all
.flyout {width: 100%;}Other than that, looks good.
- The Phoenix
- Forum Contributor
- Posts: 294
- Joined: Fri Oct 06, 2006 8:12 pm
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.
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.
- Ollie Saunders
- DevNet Master
- Posts: 3179
- Joined: Tue May 24, 2005 6:01 pm
- Location: UK
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.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.
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

Ok, enough with all these words, I'll go back and try to find more things to break there

Hmm... 6 emoticons in one post and a lot of meaningless words, I must be really bored
(oops... that's 7 emoticons now).
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
Ok, enough with all these words, I'll go back and try to find more things to break there
Hmm... 6 emoticons in one post and a lot of meaningless words, I must be really bored