XHTML Coding Rules

Автор:
Виталий Харисов
Дата создания:
24.10.2002
Дата изменения:
28.10.2002
Версия:
0.1.2

Общие замечания

Если не сказано иначе, то HTML документ должен соответствовать XHTML 1.1 DTD. Следует ознакомиться со следующими документами:

Ниже перечислены наиболее важные аспекты XHTML 1.1 (см. Главу 4. Отличия от HTML 4 XHTML 1.0 спецификации):

  1. Все тэги и их атрибуты должны быть записаны строчными буквами.
  2. Все значения атрибутов записываются в кавычках (двойных или одинарных). Рекомендуется использовать единый стиль (т.е. или двойные, или одинарные). Рекомендуется использовать одинарные кавычки.
  3. Все элементы должны иметь закрывающие тэги. Элементы, не могущие иметь содержимое (модель содержимого EMPTY), следует записывать в следующем виде:
    <elem [attr1='value' attr2='value'...]/>.
    Не рекомендуется использовать сокращенный синтаксис для элементов, чья модель содержимого отлична от EMPTY. Т.е. следует писать <br />, но не <script src='myscript.js'/>,
  4. Пары атрибут/значение обязаны быть записаны полностью, т.е. атрибуты подобные selected, должны быть записаны в виде selected='selected'.

Элементы следует использовать согласно их логической роли:

  1. Не следует использовать strong и em для выделения полужирным и курсивом, используйте для этого стили.
  2. Не следует использовать p для описания не абзаца, а просто элемента уровня блока. Используйте для этого div.
  3. Не следует использовать заголовок n-го уровня, если отсутствует предшествующий ему заголовок (n-1)-го уровня. Для выделения текста используйте стили.
  4. Не следует делать картинкой то, что можно написать простым текстом. Текст хорошо масштабируется, печатается, переводится на другой язык.
  5. Не следует использовать таблицы там, где без них можно обойтись. Старайтесь реализовать задачу средствами CSS.

Общие замечания о элементах и атрибутах:

Структура документа

Ниже представлен каркас типичного документа:

<?xml version="1.0" encoding="_document-encoding_"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<title>template</title>
</head>
<body>
	some block level element
</body>
</html>

Т.о. типичный документ содержит:

  1. шапку XML, в которой следует указывать кодировку документа (если шапка не указывается, то кодировка по умолчанию UTF-8). Броузеры третих версий показывают эту шапку при отображении документа, т.ч. не следует ее указывать, если требуется их поддержка.
  2. Определение типа документа (в нашем случае XHTML 1.1).
  3. Корневой элемент html с атрибутами xmlns и xml:lang. Рекомендуется указывать в атрибуте xml:lang действительный язык документа (в случае одноязыкового документа). В случае многоязыкового документа рекомендуется указывать язык для каждого из фрагментов. Элемент html обязан содержать в себе head и body.

Элемент head

В шапке следует использовать указанный порядок следования элементов:

  1. title с кратким и достаточным описанием документа. Рекомендуется использовать вид подобный следующему:
    Страница - [Подраздел] - [Раздел] - Сайт.
  2. Один или несколько элементов <link rel='stylesheet' type='text/css' href='your.css'/>
  3. Если серия документов имеет четкую логическую связь, следует указать соответствующие link rel/rev.
  4. Если документ имеет альтернативные варианты (другие языки, разные версии отображения), следует указать соответствующие link.
  5. Один или несколько элементов <script type='text/javascript' src='your.js'/>
  6. Один или несколько элементов meta.
  7. Один или несколько элементов <style type='text/css'>.
  8. Один или несколько элементов <script type='text/javascript'>.

Частоупотребимые элементы

Далее перечислены наиболее употребимые элементы и рекомендуемый порядок написания атрибутов в них. Наиболее важные атрибуты (id и class) указываются в начале элемента, атрибуты подверженые частому изменению указываются в конце.

Элемент table

Для table следует использовать указанный порядок следования атрибутов:
<table id='' class='' width='' cellspacing='' cellpadding='' другие_атрибуты border=''>

Элемент td(th)

Для td(th) следует использовать указанный порядок следования атрибутов:

<td id='' class='' colspan='' rowspan='' другие_атрибуты >

Элемент img

Для img следует использовать указанный порядок следования атрибутов:

<img id='' class='' src='' width='' height='' другие_атрибуты alt=''>

Если размер изображения известен и неизменен, то желательнее указать его в CSS. Если нежелательно резервирование бокса под изображение, то лучше не указывать его размеры совсем.

Элемент input

Для input следует использовать указанный порядок следования атрибутов:

<input id='' class='' type='' size='' maxlength='' другие_атрибуты value=''>

пока все