CSS a hlavička

Potřebuji poradit s CSS a s celou hlavičkou. Tady je kód ze stránky, kterou připravuji:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">



<head>

<meta http-equiv="Content-Language" content="cs">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<META content="Webdesignérské stránky Věrky Oravové." name=description>
<META content="webdesign, www, internet, Věra Oravová" name=keywords>
<title>PÁR SLOV O VĚRKA DESIGNU</title>

<STYLE type=text/css>

H1 {COLOR: black; FONT-SIZE: 18px; Font-weight: Bold; TEXT-ALIGN: center; TEXT-DECORATION: Underline; FONT-FAMILY: Verdana}

P {FONT-FAMILY: Verdana; FONT-SIZE: 13px}

BODY {FONT-FAMILY: Verdana; FONT-SIZE: 13px}

TD {FONT-FAMILY: Verdana; FONT-SIZE: 13px}

A {COLOR: #ff6600; FONT-FAMILY: Verdana; FONT-SIZE: 13px}

A:link {COLOR: #ff6600; FONT-SIZE: 13px;}

A:visited {COLOR: #ff6600; FONT-SIZE: 13px;}

A:active {COLOR: #ff6600; FONT-SIZE: 13px;}

</STYLE>

</head>


HTML na stránce je validní, aspoň podle HTML validátoru, ale CSS validátor mi vyhodil tohle:

Line: 15
Parse error - Unrecognized : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <head> <meta http-equiv="Content-Language" content="cs"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1250"> <META content="Webdesignérské stránky Věrky Oravové." name=description> <META content="webdesign, www, internet, Věra Oravová" name=keywords> <title>PÁR SLOV O VĚRKA DESIGNU</title> <STYLE type=text/css> H1 {COLOR: black; FONT-SIZE: 18px; Font-weight: Bold; TEXT-ALIGN: center; TEXT-DECORATION: Underline; FONT-FAMILY: Verdana}
Line: 57
Parse error - Unrecognized : </STYLE> </head> <body bgcolor="#FFCC99"> <center> <p><img src="banner.jpg" width="840" height="93" alt="banner"></p> <table cellpadding="5" cellspacing="10" width="90%"> <tr> <td vAlign=top width="20%" bgcolor="#FFFFCC"> <p><a href="http://par_slov_o_vd.html"><img border="0" src="par_slov_o_vd.jpg" width="153" height="32" alt="pár slov o vd"></a></p> <p><a href="http://aktualizace.html"><img border="0" src="aktualizace.jpg" width="153" height="32" alt="aktualizace"></a></p> <p><a href="http://kdo_jsem.html"><img border="0" src="kdo_jsem.jpg" width="153" height="32" alt="kdo jsem"></a></p> <p><a href="http://co_umim.html"><img border="0" src="co_umim.jpg" width="153" height="32" alt="co umím"></a></p> <p><a href="http://www_na_netu.html"><img border="0" src="www_na_netu.jpg" width="153" height="32" alt="www na netu"></a></p> <p><a href="http://fiktivni_www.html"><img border="0" src="fiktivni_www.jpg" width="153" height="32" alt="fiktivní www"></a></p> <p><a href="http://navrhy_pro_firmy.html"><img border="0" src="navrhy_pro_firmy.jpg" width="153" height="32" alt="návrhy pro firmy"></a></p> <p><a href="http://ostatni_navrhy.html"><img border="0" src="ostatni_navrhy.jpg" width="153" height="32" alt="ostatní návrhy"></a></p> <p><a href="http://kontakt.html"><img border="0" src="kontakt.jpg" width="153" height="32" alt="kontakt"></a></p> </td> <td vAlign=top width="80%" bgcolor="#FFFFCC"> <h1>Pár slov o Věrka Designu</h1> <p>Věrka Design není firma. Pokud budete chtít web od VD, stačí se mnou uzavřít Dohodu o provedení práce.
Line: 67
Parse error - Unrecognized : ;</p> <p> Prezentace VD jsou vhodné spíš pro menší firmy.</p> <p> Na webu nejsou uvedeny žádné ceny, vše záleží na dohodě.</p> <p>Firma, která mi nabídne stálé zaměstnání na pozici webmasterka, grafička nebo administrativní pracovnice, bude mít web vytvořen ZDARMA! Potřebuji takové místo z časových a zdravotních důvodů.</p> <p>Věra Oravová</p> <p>Chcete-li podpořit Věrka Design, můžete si na stránky dát reklamní banner:</p> <p>
Warnings
URI : <file://localhost/A:\Věrka Design\par_slov_o_vd.htm>
Line : 17 font-family: You are encouraged to offer a generic family as a last alternative
Line : 19 font-family: You are encouraged to offer a generic family as a last alternative
Line : 21 font-family: You are encouraged to offer a generic family as a last alternative
Line : 23 font-family: You are encouraged to offer a generic family as a last alternative
Valid CSS information
P {
font-family : Verdana;
font-size : 13px;
}
BODY {
font-family : Verdana;
font-size : 13px;
}
TD {
font-family : Verdana;
font-size : 13px;
}
A {
color : #ff6600;
font-family : Verdana;
font-size : 13px;
}
A:link {
color : #ff6600;
font-size : 13px;
}
A:visited {
color : #ff6600;
font-size : 13px;
}
A:active {
color : #ff6600;
font-size : 13px;
}


Vůbec tomu nerozumím. S CSS teprve zkouším dělat. Budu moc ráda, když mi poradíte.

A nakonec jeden dotaz. Když mám validní stránky, znamená to, že se zobrazí ve všech prohlížečích stejně?
:-) mno nevím, ale nejspíš css validátor validuje jenom samotný css soubory, takže to, co máš mezi <style> a </style>, dej třeba do css.css a do hlavičky dej místo toho todle:

<link rel="stylesheet" href="css.css" media="screen" />

Když mám validní stránky, znamená to, že se zobrazí ve všech prohlížečích stejně? >>

ne-e...
:-) mno nevím, ale nejspíš css validátor validuje jenom samotný css soubory, takže to, co máš mezi <style> a </style>, dej třeba do css.css a do hlavičky dej místo toho todle:

<link rel="stylesheet" href="css.css" media="screen" />

Když mám validní stránky, znamená to, že se zobrazí ve všech prohlížečích stejně? >>

ne-e...
Jednak to chce dát do extra souboru, jak říká meca. Možná, že validátor má někde textareu, do které se to CSS dá pastnout jako text k validaci, ale externí stylesheet je stejně výhodnější.

Za druhé, věci jako velikost textu a font stačí přiřadit nejvyššímu prvku, třeba html nebo body, a ostatní prvky by to měly zdědit. Opisovat to desetkrát je zhola zbytečné.

Za třetí, nabídni generický font. To znamená, že pokud počítač nezná Verdanu, nabídneš mu třeba Arial nebo jakékoli bezpatkové písmo, místo aby hnedle spadl do ošklivého Timesu.
Takhle: font-family: Verdana, Arial, Helvetica, sans-serif;

A za čtvrté, určovat velikost písma v px je nevhodné vzhledem k uživatelům chromého IE, kteří by si rádi v prohlížeči zvětšili text, když třeba špatně vidí. Velikost textu určuj slovně (small, x-small...), procenty nebo relativními jednotkami em a ex.
Díky. Ale v jakém programu ten soubor s CSS mám vytvořit?
V poznámkovém bloku, zkopíruj vše mezi tagy <style> bez těch tagů, a pak to uložíš stejně jako html soubor akorát místo přípony html dáš css. Kdyžtak se podívej na http://jakpsatweb.cz do CSS a někde je tam odkaz na externí stylopis. Nebo se podívej na http://marvel.webz.cz/web.css a udělej to podobně. Není na tom nic složitého k pochopení, já jsem to zvládnul za chvíli, horší bylo předělat kvůli tomu všechny html soubory, ale výsledek stojí za to - teď, když budu chtít změnit pozadí, tak ho nemusím měnit v celém webu, ale jen v souboru s externím stylopisem.