XHTML - Правила

Какво е XHTML и как да го използваме

1. Всеки документ започва с DOCTYPE декларация. Тя служи за това, да оказва на браузъра езика и версията на езика, на който е написан документа. В XHTML 1.0 има три вида такива декларации:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
(Това е най-стриктната форма на XHTML - при нея би трябвало да разчитате изцяло на CSS за оформлението на страницата, като например не можете да използвате атрибута bgcolor в тага body и т.н. )

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
(Това е най-използваната форма на XHTML, която не е толкова претенциозна към разделянето на оформлението от съдържанието и структурата.)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
(Използвайте тази декларация, ако на страницата ви има т.нар. фреймове - вложени един в друг отделни документи.

2.Понеже XHTML всъщност е XML базиран език, в първия таг на документа (а това трябва задължително да е <html> тагът) трябва да има namespace декларация, плюс указания за езика на документа. Следват примери за български и английски език:
<html lang="bg" xml:lang="bg" xmlns="http://www.w3.org/1999/xhtml">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">

3. Всички елементи трябва да са "затворени", като това важи дори и за елементите, които по принцип нямат затварящ таг. Често се случва да забравяме да затворим някой елемент както в този случай:

<HTML>
<HEAD><TITLE>Forms and Elements</TITLE></HEAD>
<BODY>
<CENTER>
<FORM NAME="frmForm"
<Input Type = "Text"><p>
<Input Type = "Text"><p>
<Input Type = "Text"><p>
<Input Type = "Text"><p>
<Input Type = "Button" NAME="cmdChange" VALUE="Click Here"><p>
</FORM>
</CENTER>
</BODY>
</HTML>

Забелязвате ли как таговете <p> не са затворени - по този начин браузърът няма да знае къде свършва първият параграф и ще отваря всеки път нов параграф, а това нарушава структурата на документа. Още по-фрапиращо изглежда факта, че отварящият таг на елемента FORM дори не е завършен с необходимия знак ">" (бел. авт.- на това парче код попаднах в един урок (!) за VBScript, като съм премахнал излишния скрипт към примера за да изпъкнат грешките). Правилният синтаксис според правилата на XHTML изглежда така:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Forms and Elements</title>
</head>
<body>
<center>
<form name="frmFrom">
<p><input type="text" /></p>
<p><input type="text" /></p>
<p><input type="text" /></p>
<p><input type="text" /></p>
<p><input type = "button" name="cmdChange" value="Click Here" /></p>
</form>
</center>
</body>
</html>

Може би ви е направил впечатление input елемента и начина, по кайто той е затворен. Няма грешка, така се затварят в XHTML всички елементи, които по принцип нямат затварящ таг. Ето няколко примера:
<img src="images/mypicture.gif" alt="This is my picture" />
This is made with XHTML! <br />
<input type="button" value="Click me!" />

4. Важна особеност на XHTML e, че всички елементи трябва да се изписват с малки букви. Това е така поради факта, че XML разпознава малки и главни букви - <B> не е същото като <b>. Същото важи и за имената на атрибутите. Така че сега е момента да започнете да пишете всички елементи само и единствено с малки букви.

5. Друг важен аспект на XHTML е, че документите подобно на XML трябва да са "добре оформени"(използвам термина на W3C). Това означава, че елементите не трябва да се припокриват, а трябва да има строга зависимост къде са техните отварящи и затварящи тагове. С други думи, това:

<center> A piece of formatted text in <b> HTML. </center></b>

е грешно, а това:
<center> A piece of formatted text in <b>XHTML</b>. </center>

е вече коректно. С това се цели да се заздрави структурата на XHTML документите и те да станат по-логични.

6. Стойностите на всички атрибути трябва да са оградени от кавички. Това е неправилно:
<table width=100% border=0>
</blockquote>
<p>А това е правилно:</p>
<blockquote>
<table width="100%" border="0">

7. Така нареченото "минимизиране" на атрибутите е абсолютно забранено. Този похват се използва сравнително рядко, но все пак трябва да му бъде обърнато внимание:
<input type="checkbox" name="cb1" checked /> (неправилно)<br />
<input type="checkbox" name="cb1" checked="checked" /> (правилно)<br />
<dl compact > (неправилно)<br />
<dl compact="compact" > (правилно)<br />

8. Освен по-горните правила, в XHTML важат също така всички правила на HTML 4.01, които не противоречат на вече споменатите.

Ами това е - въобще не е трудно, нали? Така, помнейки и спазвайки всичките осем изброени правила, вие си осигурявате по-добър и по-чист код и заздравявате структурата на вашата уеб страница. Това е вече една голяма крачка напред, но за да сте сигурни в коректността на кода си, ви препоръчвам винаги да проверявате своите документи за грешки чрез валидатора на World Wide Web Consortium, който можете да откриете на адрес http://validator.w3.org/.Може да се изненадате колко много грешки може да има в един наглед "чист" документ. А ако се окаже, че вашата страница е напълно чиста от грешки, ще получите правото до сложите на нея банер с надпис "Valid XHTML 1.0" (помните ли началото на статията....). Опитайте! Нищо не губите, а печелите много. Със знанията си сега можете съвсем лесно да "преведете" коя да е от старите си HTML страници в XHTML, а защо не и да модернизирате цели големи сайтове. Изборът е ваш, а аз се надявам, че с тази статия съм ви бил поне малко полезен и съм допринесъл за популяризирането на XHTML.

източник:www.todos.zonebg.com


/ Трябва да сте регистриран за да напишете коментар /