0 от HTML 4.01
XHTML (eXtensible HyperText Markup Language, расширяемый язык разметки гипертекста) — это язык разметки Web-страниц, созданный на базе XML. XHTML 1.0 базируется на HTML 4.01, но приведен в соответствие с прави- лами XML 1.0. Обрабатывая страницу на языке HTML 4.01 Web-браузер, об- наружив ошибку, может попробовать обработать ее. XHTML 1.0 имеет более строгие правила. Web-браузер, обнаружив ошибку, должен прекратить даль- нейшую обработку страницы.
Допустимые форматы для XHTML 1.0:
? Strict — строгий формат. Не содержит тегов и параметров, помеченных как устаревшие или не одобряемые. Объявление формата:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
? Transitional — переходный формат. Содержит устаревшие теги в целях
совместимости и упрощения перехода со старых версий HTML. Объявле-
ние формата:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
? Frameset — аналогичен переходному формату, но содержит также теги для создания фреймов. Объявление формата:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Кроме объявления формата, XHTML требует указания пространства имен в корневом теге в параметре xmlns:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru">
В этом примере с помощью параметра lang мы также указали язык докумен-
та (lang="ru").
Стандарт рекомендует также указывать XML-пролог
<?xml version="1.0" encoding="windows-1251"?>
перед объявлением формата, а в заголовках ответа сервера отправлять MIME- тип application/xhtml+xml. Однако Web-браузер Internet Explorer в этом случае некорректно обрабатывает документ. По этой причине XML-пролог не указывают, а в заголовках ответа сервера задают MIME-тип text/html.
При использовании языка XHTML необходимо придерживаться следующих правил.
? Все названия тегов и параметров указываются в нижнем регистре.
Неправильно:
<P>Текст абзаца</P>
Правильно:
<p>Текст абзаца</p>
? Значения параметров следует обязательно указывать внутри кавычек.
Неправильно:
<textarea name="pole" cols=15 rows=10></textarea>
Правильно:
<textarea name="pole" cols="15" rows="10"></textarea>
? Если параметр не имеет значения (например, selected), то в качестве значения указывается название параметра.
Неправильно:
<select name="select1">
<option value="1">Элемент1</option>
<option value="2" selected>Элемент2</option>
</select>
Правильно:
<select name="select1">
<option value="1">Элемент1</option>
<option value="2" selected="selected">Элемент2</option>
</select>
? Необходимо строго соблюдать правильность вложенности тегов.
Неправильно:
<p><b>Текст</p></b>
Правильно:
<p><b>Текст</b></p>
? Нельзя вкладывать блочный тег (например, <p>, <div>) во внутристроч-
ный (например, <b>, <span>).
Неправильно:
<b><p>Текст</p></b>
Правильно:
<p><b>Текст</b></p>
? Все теги должны быть закрыты.
Неправильно:
<ol>
<li>Первый пункт
<li>Второй пункт
</ol>
Правильно:
<ol>
<li>Первый пункт</li>
<li>Второй пункт</li>
</ol>
? Для одинарных тегов (например, <br>, <img> и др.) перед закрывающей угловой скобкой необходимо указать пробел и слэш (" /").
Неправильно:
<input type="text" name="pole1">
<img src="foto.gif" alt="Текст подсказки">
<br>
Правильно:
<input type="text" name="pole1" />
<img src="foto.gif" alt="Текст подсказки" />
<br />
? Все специальные символы внутри тегов должны быть заменены на
HTML-эквиваленты (например, символ "<" необходимо заменить на
<).
Неправильно:
<p> i < 0 </p>
Правильно:
<p> i < 0 </p>
Если специальные символы невозможно заменить на HTML-эквиваленты,
то их следует разместить внутри комментария
<script type="text/javascript">
<!-
var i = -10; if (i < 0) alert("Переменная i меньше нуля");
//->
</script>
или внутри блока CDATA
<script type="text/javascript">
//<![CDATA[
var i = -10; if (i < 0) alert("Переменная i меньше нуля");
//]]>
</script>
Пример использования языка XHTML приведен в листинге 1.23.
Листинг 1.23. Пример использования языка XHTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru">
<head>
<title>Пример использования языка XHTML</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-
1251" />
</head>
<body>
<p>
<img src="foto.gif" alt="Альтернативный текст" />
Символ амперсанд внутри ссылки должен заменяться на HTML-
эквивалент.<br />
<a href="index.php?id=5&name=Nik">Текст ссылки</a>
</p>
<form action="index.php">
<div>
<input type="text" name="txt1" />
<input type="submit" value="Отправить" />
</div>
</form>
</body>
</html>
1.15. Проверка HTML-документов на соответствие стандартам
После создания HTML-документа его необходимо проверить на отсутствие ошибок и соответствие стандартам. Ведь можно случайно забыть закрыть тег, допустить опечатку в названии тега или параметра, нарушить правиль- ность вложенности тегов и др. Web-браузеры обычно не сообщают об ошиб- ках, а пытаются их обработать. Поэтому о существовании ошибок можно узнать только в случае, если Web-браузер неправильно их обработал и это визуально видно.
Для проверки (X)HTML-документов предназначен сайт http://validator.w3.org/. Чтобы проверить документ, размещенный в Интернете, достаточно ввести URL-адрес и нажать кнопку Check. Можно также загрузить файл или вста- вить HTML-код в поле ввода многострочного текста. Если после проверки были обнаружены ошибки, то будет выведено их подробное описание. После исправления ошибок следует повторно проверить HTML-документ.
Источник: Прохоренок Н. А. HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера. — 3-е изд., перераб. и доп. — СПб.: БХВ-Петербург, 2010. — 912 с.: ил. + Видеокурс (на CD-ROM) — (Профессиональное программирование)
Похожие посты:
- Что такое селекторы и как их правильно использовать (0)
- Изменение вида элементов формы с помощью CSS (0)
- Создание двухколоночной формы с помощью CSS вместо таблиц (0)
- Структура документа (0)
- Разделение окна Web-браузера на несколько областей (0)
- Создание формы для регистрации сайта (0)
- Описание элементов управления (0)