More Critique Please

**Clippy** · 1 February 2010, 01:25

Originally posted by Ardesco View Post

Getting closer with this now:

http://test.lazeryattack.co.uk/

Things to do at the moment:

Set up a tab path
Fix IE6 (knackered atm, thinking of just disabling stylesheets for it... )
Text Colour on featured items block (Where it says new look and feel)

Apart from the above can anybody see anything that doesn't work, or does anybody have any suggestions for things to do moving forward?

Its only the main homepage atm

Some basic critique after a quick look:

Wrt the point in your list above (highlighted), the text is not easy to read because it goes across the image of the screenshot. IMHO, you should re-format so it stays within the red box.

Personally, I think the red boxes at the top should be amended to match the boxes on the right hand side so that they have a red accent at the top of the box instead of being completely red. Will 'soften' the site for users eyes.

Hope my comments make sense.

**Ardesco** · 1 February 2010, 01:30

Those top boxes are going to be unique graphics each time, the one there at the moment happens to be red, but no guarantee that they will always look like that. (I have a mainly black one that will take one of those spots, and it could be anything in the future).

(Just updated it so it shows a black one and a red one)

**Clippy** · 1 February 2010, 01:37

Originally posted by Ardesco View Post

Those top boxes are going to be unique graphics each time, the one there at the moment happens to be red, but no guarantee that they will always look like that. (I have a mainly black one that will take one of those spots, and it could be anything in the future).

(Just updated it so it shows a black one and a red one)

The black one looks much better.

One other point, the menu on the left (Game List, Server Prices etc) should, for symmetry, be the same height as the boxes we have been talking about.

Failing that, it should fill all of the height of the dark grey area it currently sits in - at the moment, it doesn't seem to be very well positioned.

Just my tuppence worth.

**Zippy** · 1 February 2010, 01:47

I'm using FF3.0.5
Home page
-----------
The text in the second and third columns is overwriting the images. It looks a bit odd and makes it hard to find the "comments" links in the text.
The tab between "Teamspeak Admin" and "Contact Sales" is missing
I'd be inclined to add underlining when you hover over the LH menu options

If you try to log in with rubbish details you get a "Bad Request" message (I appreciate you may not have got round to this yet). I'd suggest all non-functional links are redirected to a holding page. It helps to be tidy

Red underlining on the Subscribe option - nooo. Not enough contrast for me. I don't think yellow/grey on the menu options is a good enough contrast either.
You need to be putting alt text on your images
I'm sure NickFitz will be along soon, but I hope this helps a bit.

**NickFitz** · 1 February 2010, 03:20

Originally posted by Zippy View Post

You need to be putting alt text on your images
I'm sure NickFitz will be along soon, but I hope this helps a bit.

tomorrow

Until then, WSS about the alt attribute; and remember that the alt attribute is intended to be used when the image cannot be seen - this isn't necessarily the same thing as describing the image

**Zippy** · 1 February 2010, 03:33

Originally posted by NickFitz View Post

tomorrow

Until then, WSS about the alt attribute; and remember that the alt attribute is intended to be used when the image cannot be seen - this isn't necessarily the same thing as describing the image

I'll look forward to your comments NF. It''s good to learn!

**Ardesco** · 1 February 2010, 08:48

Originally posted by Zippy View Post

I'm using FF3.0.5
Home page
-----------
The text in the second and third columns is overwriting the images. It looks a bit odd and makes it hard to find the "comments" links in the text.
The tab between "Teamspeak Admin" and "Contact Sales" is missing
I'd be inclined to add underlining when you hover over the LH menu options

If you try to log in with rubbish details you get a "Bad Request" message (I appreciate you may not have got round to this yet). I'd suggest all non-functional links are redirected to a holding page. It helps to be tidy

Red underlining on the Subscribe option - nooo. Not enough contrast for me. I don't think yellow/grey on the menu options is a good enough contrast either.
You need to be putting alt text on your images
I'm sure NickFitz will be along soon, but I hope this helps a bit.

Modified the the highlight on the subscribe link so that it matches the main menu highlight colours (currently the yellow).

By the second and third columns do you mean the featured blocks? (i.e. one is red with an image of the website and black text that is not too readable at the moment, and one is black with white text)

As for alt tags, they are all there

(unless I've missed something). The markup should all be compliant and pass any W3C validation checks.

**NickFitz** · 1 February 2010, 19:18

The overall structure of the page looks good without styles.

The alt attribute of the shopping basket should be "View shopping basket", not "Shopping basket icon"; however, at the moment it's outside the link, so clicking on it does nothing. Best thing though is to move it inside the link and set the alt attribute to "", as it becomes superfluous when the link text contains all the information required. (You can't just leave the attribute out though, you have to set it to the empty string.)

There shouldn't be a "label" element around the shopping basket link: "label" is for associating text with form controls, not links. At the moment, you're using the "label" to hang some styles on, such as setting the cursor and underlining on hover. Once the icon is inside the link you can set those styles on "a:hover" instead. If you still need an enclosing element for styling purposes, a "span" would be appropriate (not a "div" as you're inside a "p", and only inline elements are allowed), but I reckon you can probably manage without one by rejigging the styles slightly.

Rather than having an "a" around the "Remember me" checkbox and its associated "label", you could wrap the "label" around the checkbox and the text, and style that. If you need to add some additional styling to the text but not the checkbox, it could be wrapped in a "span".

In the "Support" table, the cell containing the text "Support online" should be a "th" rather than a "td", as it is the heading for the other cells. (You may then need to override the default browser styles for "th" such as bold text.) Furthermore, give it a "rowspan" attribute of "4" and remove the empty cells at the start of the remaining three rows: then that heading will be associated with all the data, rather than just the first row.

On IE6, the message telling me that my browser is outdated is broken

You're using the "#nav > li" child selector to set styles on the navigation list; this of course won't work on IE6. Unless you're planning on having nested lists, you could just use the descendant selector "#nav li", although if you do plan to have nested lists you then finish up having to use "#nav li li" to override styles on them. Still, that could go in your IE6 stylesheet.

That's all for now; I'll try to find time to have another look at the IE6 issues at some point, but I'll have to set up one of my debugging proxies to really get into it, and I ought to be making my dinner instead

**Ardesco** · 1 February 2010, 21:46

Thanks NF, as helpful as ever

The IE6 warning thing is actually this:

http://code.google.com/p/sevenup/

Just can't find the javascript snippets these days hey...

I'll prolly just grab another one so that I don't have to think about it.

More Critique Please