→ Пошук по сайту       Увійти / Зареєструватися

Правила применения тегов

Компетенція Робота з HTML

Для тегов любого типа действуют определенные правила их использования. Причем, некоторые правила обязательны для выполнения, а другие являются рекомендациями, т.е. их можно выполнять, а можно и нет.

Параметры тегов и кавычки

Согласно спецификации HTML все значения параметров тегов следует указывать в двойных ("пример") или одинарных кавычках ('пример'). Отсутствие кавычек не приведет к ошибкам, браузеры во многих случаях достаточно корректно обрабатывают код и без кавычек, за исключением текста, содержащего пробелы (листинг 3.2).

Листинг 3.2. Использование кавычек в параметрах тегов

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="content-type"  content="text/html; charset=windows-1251">
  <title>Кавычки в параметре alt</title>
 </head>
 <body>
  <p><img src="/images/title.gif"  alt="Вид заголовка" width="438" height="118"></p>
  <p><img src="/images/title.gif" alt=Вид заголовка width="438" height="118"></p>
 </body>
</html>

В данном примере строка 8 написана правильно, со всеми кавычками, а в строке 9 у параметра alt кавычки отсутствуют. Из-за этого браузер в качестве значения параметра alt возьмет только первое слово («Вид»), а слово «заголовка» будет воспринято как ошибочный аргумент. Поэтому всегда приучайтесь указывать параметры тегов в кавычках.

Теги можно писать как прописными, так и строчными символами

Любые теги, а также их параметры нечувствительны к регистру, поэтому форму записи вы вольны выбирать сами, как писать — <BR>, <Br> или <br>. В любом случае рекомендуется придерживаться выбранной формы записи на протяжении всех страниц сайта. Заметим также, что текст, полностью набранный прописными символами, читается хуже, чем текст со строчными символами или смешанный.

Переносы строк

Внутри тега между его параметрами допустимо ставить перенос строк. В листинге 3.3 показана одна и та же строка, но оформленная разными способами.

Листинг 3.3. Переносы строк в коде тега

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1251">
  <title>Кавычки в параметре alt</title>
 </head>
 <body>
  <p><img src="/images/title2.gif" alt="Вид заголовка в браузере  Internet Explorer"  width="438" height="118"></p>
  <p><img src="/images/title2.gif"
   alt="Вид заголовка в браузере Internet Explorer"
   width="438"
   height="118"></p>
 </body>
</html>

В данном примере первый тег <img> набран в одну строку, включая все его параметры, а второй тег <img> разбит на несколько строк.

Замечание

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

Неизвестные теги и параметры

Если какой-либо тег или его параметр был написан неверно, то браузер проигнорирует подобный тег и будет отображать текст так, словно тега и не было. Опять же, следует избегать неизвестных тегов, поскольку код HTML не пройдет валидацию.

Порядок тегов

Существует определенная иерархия вложенности тегов. Например, тег <title> должен находиться внутри контейнера <head> и нигде иначе. Чтобы не возникло ошибки, следите за тем, чтобы теги располагались в коде правильно.

Если теги между собой равноценны в иерархии связи, то их последовательность не имеет значения. Так, можно поменять местами теги <title> и <meta>, на конечный результат это никак не скажется.

Закрывайте все теги

Существует три состояния закрывающего тега: обязателен, не требуется или не обязателен. Обязательный закрывающий тег должен присутствовать всегда, иначе это приведет к ошибке при отображении документа. Для некоторых тегов вроде <br> закрывающего тега нет в принципе. Необязательный закрывающий тег говорит о том, что разработчик может его как добавить, так и опустить, к ошибке это не приведет. Однако рекомендуем закрывать все подобные теги, включая необязательные, это дисциплинирует, создает более стройный и строгий код, который легко модифицировать.

загрузка...
Сторінки, близькі за змістом