My CSS layout - is it okay?

December 23rd, 2004, 11:05 am

I'm think I'm slowly getting to grips with CSS - I've ordered the book 'Foundation Macromedia Dreamweaver MX 2004' which I'm hoping will help me with this and PHP/MySQL.

With that in mind, I've used the 'A List Apart' layout to create a layout for my new site:

http://www.impelgd.co.uk/layout.php

I was wondering if any of you CSS experts could have a quick look and let me know if it's basically okay, or if I'll be making life hard for myself further down the road?

I've tested it in Firefox 1 and Internet Explorer 6, but don't have access to Internet Explorer 5 at the moment.

Thanks in advance.

[ATNO/TW]

December 23rd, 2004, 11:15 am

Looks good to me. And if you run your page through the CSS validator it also validates:
http://jigsaw.w3.org/css-validator/

You have one error preventing your page from validating altogether:
http://validator.w3.org/
Use that link to validate your XHTML. You are missing one alt attribute. You're definitely on track. I wouldn't worry too much about IE 5. It's not used much anymore. Besides, I suspect that some elements of your style sheet aren't even supported in IE5.

December 23rd, 2004, 11:44 am

Thanks for replying - have added that alt attribute now. Will note those links for future use.

Won't worry about IE5 then - is this the version that includes the padding in boxes instead of adding it as it should? Was wondering if this would mess the layout up, but if it's beyond reasonable reach then I suppose I'll just forget about it.

Also noticed that there is an XTHML 1.1 document type - is ths something I should look into using as Dreamweaver obviously uses 1 at the moment?

Thanks again.

[ATNO/TW]

December 23rd, 2004, 12:22 pm

XHTML 1.1 is the current version. Truthfully, I'm not even sure what the differences are. Probably just a few minor odds and ends. You're probably OK with 1.0, but if you wanted to test it out just switch to the 1.1 doctype and run it through the validator.

December 23rd, 2004, 12:35 pm

Wow, that is awesome. I think coding sites in entirely CSS is cool. I am in the process of learning how to do that now.

December 23rd, 2004, 2:21 pm

great desgin layout Impel GD i think that it will look good when it is finsihed

December 23rd, 2004, 3:00 pm

I see ATNO/TW, I may try that. Thanks for your help.

Thanks for the encouraging comments. CSS is certainly more suitable for laying out documents - I suppose it just takes some discipline to stop yourself reverting to tables and learn. Inefficient browsers like IE are also annoying when it comes to the rendering of CSS at times.

Hope your CSS goes well.

December 24th, 2004, 9:54 am

Do not convert to XHTML 1.1 if you still want to use "HTML compatible" XHTML. Only 1.0 is allowed for that purpose. <edit>However, I would use a Strict doctype</edit>

XHTML has a new MIME type associated with it, and if you use the MIME type for HTML then it is HTML and will be treated as HTML.

However, try to turn off images. Is it still accessible? Black text on black background is very hard to read.

When you create your navigation links, put them in an unordered list, and have the heading "Navigation" in - in this case - <h2>

December 24th, 2004, 10:38 am

Thanks for the advice - not entirely sure what you mean about the strict doctype etc. but I'm sure I'll be able to find out with some research.

EDIT: Looks like the link in your sig is what I need - will have a read later on.

Will see what I can do about the black text.

Thanks for taking the time.

[ATNO/TW]

December 24th, 2004, 12:09 pm

There are three doctypes, strict, transitional and frameset for each version. Frameset is obvious and should be used when you are using frames on your site. Transitional is the most commonly used, because it allows some flexibility in transitional elements from one version to the next. For example, if you want to code XHTML, but want to include some HTML 4.01 elements, it will still validate (within limitations), however, if you use a strict doctype, then you need to code to the exact standards for that version in order for it to validate.

December 24th, 2004, 4:24 pm

Ah, I see. Done some reading using the link in zcorpan's sig and found this:

Quote:

Let us inspect this closer. Coding to web standards implies embracing certain ‘best practices’ such as seperation of style and content, semantic markup, accessibility and user-friendliness. All those practices can perfectly well be used with HTML though, and are not at all exclusive to XHTML. As I have argued earlier, there is no need at all to use XHTML, unless you use the specific extensibility it offers, such as mixing in MathML into your markup.

Quote:

But for business use i do not recommend it. There is nothing backwards, except compatibility, about coding to HTML 4.01 Strict

I'm creating this website purely to be a website, and it will link to a MySQL database using PHP, so I'm now thinking I should stick to HTML 4.01 Strict to avoid unnecessary complications.

What do you reckon?

December 25th, 2004, 10:22 am

ATNO/TW wrote:

There are three doctypes, strict, transitional and frameset for each version. Frameset is obvious and should be used when you are using frames on your site. Transitional is the most commonly used, because it allows some flexibility in transitional elements from one version to the next. For example, if you want to code XHTML, but want to include some HTML 4.01 elements, it will still validate (within limitations), however, if you use a strict doctype, then you need to code to the exact standards for that version in order for it to validate.

XHTML w/ HTML elements? What?

HTML 4.01 Strict has the exact same modules as XHTML 1.0 Strict. Same goes for Transitional and Frameset.

XHTML 1.1 does only have one doctype and that is a strict one.

Impel GD wrote:

I'm creating this website purely to be a website, and it will link to a MySQL database using PHP, so I'm now thinking I should stick to HTML 4.01 Strict to avoid unnecessary complications.

What do you reckon?

I reckon HTML 4.01 Strict is perfectly alright. Today, there is no real advantage in using XHTML for a normal website. <edit>Especially since IE has no support for XHTML.</edit>

December 25th, 2004, 1:59 pm

Upon trying to validate my HTML 4.01 Strict version of the page I found out that there are no target or border elements, so I think I'll stick to HTML 4.01 Transitional.

I've learnt a lot with all your helpful comments and links - many thanks.

Here's the state of the page now: http://www.impelgd.co.uk/layout.php

December 25th, 2004, 2:51 pm

You should not force links to open new windows, so there's no need for the target attribute anyway.

You should use CSS to specify your borders, so you don't need the border attribute either.

Since you have separated structure and presentation, it really looks like a Strict document.

December 25th, 2004, 3:05 pm

Will use CSS border instead.

I wanted to have the links to external sites (W3C and Firefox) open up in new windows to avoid viewers leaving my site prematurely, but I take it this is not considered good practice?