[JiRaffe]

that's me.

this is my very first attempt at a CSS website. I realise that there is probably much wrong with it. that's why i was wondering if people could take a look at the code of it and the layout of it and let me know which things I am doing wrong (before I get stuck into bad habits). I thought it was about time I tried to move with the times.

http://www.thundermedia.co.uk/csstest/

cheers


p.s. there is only currently the 'home' page and the 'people' page

[Brown]

1. you are still using tables
2. link to an external stylesheet
3. your menus should be lists
4. font tags!
5. try a different doctype - go xhtml

[Bill Posters]

Forgive me for saying this, but I really don't think using css to style your tables-based layout passes for a 'css website'.


One of the first things you need to do is implement a proper DTD (preferably XHTML 1 Strict, if you're at all serious about moving with the times.)

Next you need to familiarise yourself with how to externalise css.

-

btw, what's the typeface you've used for the o'conners logotype?
Fat, little slab-serif that. Might just have to squeeze that into an upcoming project.

[JiRaffe]

haha

i see i have only scratched the surface on the css thing then. i guess i should read another book. i've been reading Eric Meyers book and i'm only on the first chapter. he's dealing with converting an html page into a css page. at least i'm beginning to get a grasp of a little bit of the lingo. i previously didn't understand at all.

i think its prob a bit pointless asking for advice until i've gone back to the drawing board.

cheers for the eyeopener.

bill, i'll check what font we used on the logo. it was done quite a while ago.

[oli]

Read through this :

http://www.thenoodleincident.com/tutorials/design_rant/

Gave me a good understanding of the theory before I started on the the practice.

[Mr Fred]

didnt help though..........................

[oli]

haha f off

[Mr Fred]

haha

[JiRaffe]

great link Oli. I've read it and i now understand the full extent of my naivety!

[Bill Posters]

Oi, Jiraffe. Don't forget to find out the font name.

[JiRaffe]

i'm on the case bill

[Bill Posters]

upper or lower?

</sadgeekjoke>

[JiRaffe]

hahaha... urggh

the font on the logo is Rockwell (otherwise known as Slab Serif i think) and the cropped O's are just circles drawn in Illustrator

[Bill Posters]

Cheers, Jaffa

I never would have recognised that as Rockwell.
I never realised that it went up to a fat/phat Extra Bold weight.
I've only known it as an ugly, mono-weight slab that I've generally learned to avoid.

That'll learn me.

Now duly bought.
Thx again.

[JiRaffe]

does it looks how you hoped?

http://www.paratype.com/fstore/fonts/Rockwell.htm

the extra bold one on that list is a good un

[Bill Posters]

Indeed it does.
Indeed it is.

[JiRaffe]

here we go again.

i've tried to re-jig the page i was workin on. Am i getting any nearer to it being a 'css page'? any comments on what i'm doing wrong would be mucho helpful

http://www.thundermedia.co.uk/csstest/

[Stickman]

Calm down with the divs. For example, this bit:

<div id="widelogo"><img src="logowide.gif" width="400" height="53"></div>

...could be <img src="logowide.gif" width="400" height="53" id="widelogo" />

Apply styling to the image itself. Do strict (so />). Link to external stylesheet.

Good work, but next - try to learn to style the content rather than sticking each element in it's own div.

You div.

[Brown]

its properly spannered on ie6 pc.

[Stickman]

It is, but that's more likely to be IE's fault than jiraffe's.