Heading in the right direction? css, usability, etc

[Nightfire]

Before I get any further with this, am I heading in the right direction? using small, xx-small etc for font sizes, divs for positions, dtd etc? It's my first site I've done without tables, so point errors out to me before I get too far :)

http://blinded.org.uk

<edit>Just realised I'm in the wrong forum *prepares to be moved to the css forum*</edit>

[bazz]

I suppose there are many ways to do this and others will (no dount) know of a better way than mine but here goes.

I have just built the bulk of a site (5000 files) and with two external styles sheets. (I hope i went the right way!!!) :D

One style sheet is used for general menu pages (which each are positionally (?) identical. The other 3000 odd pages are controled by the other stylesheet as they are all identical in appearance.

Now if I need to change one page, it affects all the others (where they are the same), so that the consistency of the site remains constant with the least effort :thumbsup:

When I first started with a wysiwyg program (HotM*t*l5), each section of text was controlled by <font> tags etc and was a real pain when I finally decided on an appearance half way thru creation. from this opint of view css must surely be the way to go

fyi, css controls text font size color position layout (H + W of para) which renders tables unnecassary.


whatcha rest of u think?

[Mhtml]

Well code wise it's looking nice, near as I can tell.. I don't think I missed anything, as for suggestions, I'd change top:33 to about 35 in your links class as it overlaps a little over the header... unless of course that is what you want to happen..

A js error in IE 6 (and should in every browser!) you are missing a ) at the end of your first line of javascript.

if((document.all) && (navigator.appVersion.indexOf("MSIE"))){

[ronaldb66]

Altough your site looks good codewise, and the background image is a stunner, it really is unusable; hardly any text color will have sufficient contrast with the really dark parts in the corners as well as with the white-out part in the middle, which causes your present white (or light grey) text to disappear there.

[bazz]

Hmmm yes the background image is stunning! Pity it didnt load for me last night so that I could have realised why your text was the shape it is :) (I'm on a slow connection at the mo as I'm in a B&B)

Have you thought about perhaps fading your background image (as if a watermark) so that its effect is still there but you could better find a text colour which could display through both dark and light shades?

HTH

[redhead]

like the image :)... shame that it kinda makes the text unreadable sometimes

look at this bit of l337 (ph33r m3h!) no... not that bit of my waffeling, the bit below *recalls however much l33t he ever learnt*:

<a href="?page=phpinfo">If you're an l337 h^><0r, you might have already tried this...</a>

now... you need to use the entities &lt;&gt; in place of those angle bracey things... coz IE (and probably other browsers) think you're starting a tag and it doesnt display your javascript saying to get a good browser :)

also... as you are using HTML 4.01 you dont need slashes in the breaks and other empty tags... but i guess it'll make it easier to update to xhtml later down the line...

umm... i cant spot anything else that no one else has, so id better stop waffling :)

nicely done :thumbsup:

[edit] i use x-small etc for text size... but methinks its been rumored that %'s for text size might be more accesable *gets dictionary*... so you might want to try using them... hmm....

[Nightfire]

Thanks :) I did use x-small at first, but then people were saying the text is too big, so I went to pt's. Good idea about the &amp;lt;'s, the <br />'s are created by php, as it's all database + css driven

I'd like to change the image, but it's not mine and the owner doesn't want me to change anything on it, so can anyone see a way of making the font readable? :confused:

[jwitchel]

First off the design is rock solid.

But I think the key with your approach is how far backward in browsers do you want to go?

Here's a screenshot of your site in most of the browsers on linux/mac/win.

http://www.browsercam.com/public.aspx?proj_id=1760

You can see it goes to pot on the oldest browsers. But basically after the 4.x wave of browsers you're in the clear as far as I'm concerned.

--john

[brothercake]

As long as the content is legible and the links still work, I don't think it matters what it looks like in <= 4 version browsers.

You shouldn't be using pt or px for text size, because of the non-scaling in IE problem. Use %, em, or name units.

btw - I don't get that error you mentioned in IE; I get a syntax error - "expected ')'"

[Nightfire]

Those screnshots were helpful :)

I'll try the %, em, or name units when I get back home :) ta