HTML и XHTML
Курс по основам HTML. W3Schools на русском языке. Уроки для начинающих
HTML и XHTML
XHTML - это HTML, написанный как XML.
Что такое XHTML?
- XHTML означает "Расширенный язык гипертекстовой разметки" (EXtensible HyperText Markup Language)
- XHTML почти идентичный HTML
- XHTML является более строгим, чем HTML
- XHTML - это HTML, определённый как программа XML
- XHTML поддерживается всеми основными браузерами
Почему XHTML?
Много страниц в Интернете содержат "плохой" HTML код. Этот HTML код работает в большинстве браузеров (даже если он не соответствует правилам HTML):
Пример:
<html>
<head>
<title>This is bad HTML</title>
<body>
<h1>Bad HTML
<p>This is a paragraph
</body>
Сегодняшний рынок состоит из разных технологий браузера. Некоторые браузеры работают на компьютерах, а некоторые веб-браузеры работают на мобильных телефонах или других небольших устройствах. Меньшие устройства часто не имеют ресурсов или мощности для интерпретации "плохой" разметки.
XML - это язык разметки, где документы должны быть правильно обозначены (быть "хорошо сформированными"). XHTML разрабатывался путём объединения сильных сторон HTML и XML. XHTML является HTML переработанный как XML. Если вы хотите изучить XML, пожалуйста, посетите и почитайте XML-учебник на нашем сайте.
Наиболее важные отличия XHTML от HTML:
Структура XHTML документа
- XHTML DOCTYPE является обязательным
- Атрибут xmlns в
<html>
является обязательным <html>
,<head>
,<title>
и<body>
являются обязательными
XHTML элементы
- Элементы XHTML должны быть правильно вложены
- Элементи XHTML всегда должны быть закрыты
- Элементы XHTML должны быть в нижнем регистре
- Документы XHTML должны иметь один корневой элемент
XHTML атрибуты
- Имена атрибутов должны иметь нижний регистр
- Необходимо указать значения атрибутов
- Минимизация атрибутов запрещена
<!DOCTYPE ....> обязателен
XHTML документ должен иметь объявление XHTML DOCTYPE.
Элементы <html>
, <head>
, <title>
і <body>
также должны присутствовать, а атрибут xmlns в <html>
должен указывать пространство имён xml для документа.
Полный список всех XHTML Doctypes находится в Справочнике HTML тегов.
В этом примере показан документ XHTML с минимально необходимыми тегами:
Пример:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Title of document</title>
</head>
<body>
some content
</body>
</html>
XHTML элементы должны быть правильно вложены
В HTML некоторые элементы могут быть неправильно вложены друг в друга, например:
<b><i>This text is bold and italic</b></i>
В XHTML все элементы должны быть правильно вложены друг в друга, например:
<b><i>This text is bold and italic</i></b>
XHTML элементы должны быть всегда закрыты
Это неправильно:
<p>This is a paragraph
<p>This is another paragraph
Это правильно:
<p>This is a paragraph</p>
<p>This is another paragraph</p>
Пустые элементы также должны быть закрыты
Это неправильно:
A break: <br>
A horizontal rule: <hr>
An image: <img src="happy.gif" alt="Happy face">
Это правильно:
A break: <br />
A horizontal rule: <hr />
An image: <img src="happy.gif" alt="Happy face" />
XHTML элементы должны быть в нижнем регистре
Это неправильно:
<BODY>
<P>This is a paragraph</P>
</BODY>
Это правильно:
<body>
<p>This is a paragraph</p>
</body>
Названия XHTML атрибутов должны быть в нижнем регистре
Это неправильно:
<table WIDTH="100%">
Это правильно:
<table width="100%">
Значения атрибутов должны быть взяты в кавычки
Это неправильно:
<table width=100%>
Это правильно:
<table width="100%">
Минимизация атрибутов запрещена
Это неправильно:
<input type="checkbox" name="vehicle" value="car" checked />
Это правильно:
<input type="checkbox" name="vehicle" value="car" checked="checked" />
Это неправильно:
<input type="text" name="lastname" disabled />
Это правильно:
<input type="text" name="lastname" disabled="disabled" />
Как конвертировать с HTML в XHTML
- Добавьте XHTML
<!DOCTYPE>
к первой строке каждой страницы - Добавьте атрибут
xmlns
к html элементу каждой страницы - Сделайте все названия элементов буквами нижнего регистра
- Закройте все пустые элементы
- Сделайте все названия атрибутов буквами нижнего регистра
- Возьмите в кавычки все значения атрибутов