Embarking on HTML & CSS Validation

[Dan]

I'm about to create the new version of my person consulting web site, and I
want this version to be:

1. be to validate 100% (both css and HTML)
2. I want to use complete css positioning (no tables)


Just wonder if there were a few tips on there on common things to avoid from
someone who's used to just coding HTML and CSS by hand, but not really
following the strict rules, and just making sure things looked ok in IE /
Netscape 4.x and up.

Am i correct that my site will not display correctly in Netscape 4.x with
css positioning and IE 4.x .. if so i really don't care..I can detect and
degrade manually. I want to use the latest correct code, and I believe css
positioning to be something that we should all start using.

 

[=?iso-8859-1?Q?brucie?=]

I'm about to create the new version of my person consulting web site, and I
want this version to be:

1. be to validate 100% (both css and HTML)

"HTML validation" is a good tool, but just a tool
http://www.cs.tut.fi/~jkorpela/html/validation.html

2. I want to use complete css positioning (no tables)

you may not need to use positioning, it depends on the design.

Just wonder if there were a few tips on there on common things to avoid from
someone who's used to just coding HTML and CSS by hand,

semantically markup your html then apply CSS to style.

and just making sure things looked ok in IE / Netscape 4.x and up.

the best you can expect from prehistoric browsers is to render [most
of] your HTML, forget about css unless its very basic but then you
need to decide if its worth the effort stuffing around.

Am i correct that my site will not display correctly in Netscape 4.x with
css positioning and IE 4.x ..

yes, and others.

master compatibility charts:
http://centricle.com/ref/css/filters/
http://www.xs4all.nl/~ppk/css2tests/intro.html
http://macedition.com/cb/resources/abridgedcsssupport.html
old:
http://www.immix.net/html/CSSGuide.htm
http://devedge.netscape.com/library/xref/2003/css-support/

if so i really don't care..I can detect and degrade manually.

you cant reliably determine what the UA is. use one of the many hacks
to hide css from crappy browsers.

hiding CSS from crappy browsers:
http://www.ericmeyeroncss.com/bonus/trick-hide.html
http://www.w3development.de/css/hide_css_from_browsers/

I want to use the latest correct code,

CSS1 is over 7 years old, CSS2 over 5 years old. its not new.

cascading style sheets, level 1 specification
http://www.w3.org/TR/REC-CSS1.html
cascading style sheets, level 2 specification
http://www.w3.org/tr/rec-css2/cover.html

use the CSS1 for historical info only. use the CSS2 spec for authoring
as there have been some changes.

and I believe css positioning to be something that we should all start
using.

separating the document structure from the style is what you're
looking for.

layout examples:
http://www.glish.com/css/
http://www.csszengarden.com/
http://www.wannabegirl.org/css/
http://tantek.com/CSS/Examples/
http://www.saila.com/usage/layouts/
http://www.bluerobot.com/web/layouts/
http://www.benmeadowcroft.com/webdev/
http://www.xs4all.nl/~apple77/columns/
http://www.meyerweb.com/eric/css/edge/
http://www.htmler.org/tutorials/3/1.html
http://css.nu/articles/floating-boxes.html
http://webhost.bridgew.edu/etribou/layouts/
http://www.roguelibrarian.com/lj/index.html
http://css-discuss.incutio.com/?page=CssLayouts
http://ecoculture.com/styleguide/r/rollovers.html
http://thenoodleincident.com/tutorials/box_lesson/index.html
http://www.webreference.com/authoring/style/sheets/layout/advanced/