Site Review

[cheechm]

Hi,
Can you review the general layout of my site please. I realise that the 3rd menu button rollover doesn't look good. Still working on that one.

Thanks

http://nicks-world.co.uk/tt/

[oesxyl]

attribute names must be lower case and you miss few alt attributes:

http://validator.w3.org/check?verbos....co.uk%2Ftt%2F

I don't like the right side div, it overlap the text.
you must have a footer or padding bottom.
I'm not sure but I think is something wrong with js at first load, I can't reproduce.
I like the layout idea.

regards

[mjlorbet]

looks nice enough, i'd maybe rethink the tabs bit a little, it just looks too large & a little, i don't quite know how to describe it, but it just doesn't feel quite right. also, ie7 at least, your layout gets broken while resizing the window.

[cheechm]

It breaks up, I know, but is there anything I can do about that?

Thanks for C+C.

[mjlorbet]

set your sizes based on the percentage of the screen they should take up instead of a concrete size, that way the content will scale to match the browser's current size

[cheechm]

Originally Posted by mjlorbet

set your sizes based on the percentage of the screen they should take up instead of a concrete size, that way the content will scale to match the browser's current size

I'm lazy.. Is there something that does that for me?

LOL.. Thanks

[oesxyl]

Originally Posted by cheechm

It breaks up, I know, but is there anything I can do about that?

Thanks for C+C.

some bad things:
- overflow: hidden, make it auto or better remove it
- put all content in a wrapper div, and clear at the end( you use float) with clear: both
- table for layout, is not good, use a div instead
- right side, must be float left too.
- don't use position absolute

regards

[mjlorbet]

not really, but here's what you can do; if you've given your elements ids then you can use a script like this

 
var elements = document.getElementsByTagName("div");
for(var a = 0; a < elements.length; a++)
    alert(elements.id + " :: WIDTH: " + parseInt(elements.style.width)*100/document.documentElement.clientWidth + "% HEIGHT: " + parseInt(elements.style.height)*100/document.documentElement.clientHeight);

and that'll tell you what percentages to use, just make sure to change the tagname to each set of elements that you'll need to size, note if the element is nested within another and is supposed to fill the whole thing then you can just set the width or height (whichever is appropriate) to 100% for that item instead of having to code the size manually. also note that this script should work for internet explorer 7 in xhtml compat mode but i'm not sure what other browsers will support document.documentElement, so be aware of that, really you just want to get the width and height of the objects, convert it to an integer (as when you extract them from the style property, you'll have the unit appended to the end of it), multiply it by 100 and divide it by the corresponding size dimension of the window. so you could use window.innerHeight and window.innerWidth for firefox or document.body.clientHeight and document.body.clientWidth for internet explorer 6 and prior. *note not 100% on that, haven't messed around with client sizes in some time now.

[oesxyl]

Originally Posted by mjlorbet

not really, but here's what you can do; if you've given your elements ids then you can use a script like this

 
var elements = document.getElementsByTagName("div");
for(var a = 0; a < elements.length; a++)
    alert(elements.id + " :: WIDTH: " + parseInt(elements.style.width)*100/document.documentElement.clientWidth + "% HEIGHT: " + parseInt(elements.style.height)*100/document.documentElement.clientHeight);

....

I'm not agree with that. You can do a lot of things with javascript others then fixing something what can be done very easy with html/css.

regards

[mjlorbet]

that's not to fix it, it's to get the values for him so he doesn't have to do the division by hand

[oesxyl]

Originally Posted by mjlorbet

that's not to fix it, it's to get the values for him so he doesn't have to do the division by hand

if the layout is correct it don't need the values, using a width: 100% for wrapper and proper css/html inside, is enough.

regards

[mjlorbet]

very true

[cheechm]

But it is an image based website. So wouldn't percentages muck up the imageS?

[mjlorbet]

if you only set the width or only set the height it'll be fine, if you set both then it'll do bad things. setting one or the other will keep the aspect ratio constant.

[oesxyl]

Originally Posted by cheechm

But it is an image based website. So wouldn't percentages muck up the imageS?

as mjlorbet said, if you change only width the height will be changed to keep the aspect ratio constant.
Change what I said in my post and will work. Probably after that you must also make some adjustment to get what you want.
Your layout idea is fine, I like it,

regards