Теги html. Разметка страницы тегами и теги головы страницы head.

Решив создать сайт, Вы должны знать, что каждая его страница будет состоять из наборов символов, размещенных в определенной последовательности. Наборы этих символов называются тегами html, каждый из которых может иметь свои уточняющие атрибуты. Браузеры или другие подобные программы распознают эти теги, преобразуют их страницы и показывают результат конечным…

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

Теги разметки страницы или основные html теги.

Эти три основных тега должны быть прописаны на всех страницах (не только на главной!) сайта. Предназначены они для разметки страницы.

Теги	Значение тегов
<html></html>	Данный тег указывает программе, которая будет выводить страницу (чаще всего это браузер), что этот документ (для сайта это страница) написан на языке html. Здесь <html> — открытие тега, а </html> — закрытие тега. Все, что браузер увидит между ними, будет распознаваться, как html код.
<head></head>	С английского переводится как «голова» документа. Здесь указывается вся общая информацию о документе (странице) для пользователя и для поисковых машин. Размещается <head></head> сразу после открытия <html>. Все, что прописано между тегами <head>здесь</head> не отображается браузером в теле документа.
<body></body>	Данный тег переводится, как «тело», и предназначен для размещения в основном видимых элементов страницы, но иногда и скрытых. Размещать <body></body> следует после тега закрытия </head>.

Кодовая часть страницы, которую получает браузер от сервера выглядит так:

<html> 
  <head>
    Заголовок страницы и дополнительные теги
  </head>
  <body>
    Контент страницы (тексты, ссылки, изображения и пр.)
  </body>
</html>

Теги заголовка страницы и их атрибуты.

Заголовок html страницы и вся информация для поисковиков размещается в голове документа. Для этого предназначены теги <head></head> и мета-теги. Именно их мы сейчас и рассмотрим.

Теги и их атрибуты	Значение тегов и атрибутов
<head></head>	Определяет значение заголовка страницы.
<title>Здесь заголовок</title>	Между этими тегами Вы должны прописать заголовок страницы. То, что написано между этими тегами title, будет выведено в оглавлении в браузере или в другой программе для ее просмотра.
<meta name=»keywords» content=»ключевые слова»>	Здесь указываются ключевые слова, описывающие содержащуюся на странице информацию. Записывается между <title></title>.
name=»keywords»	Данный атрибут задает имя мета-тегу: «keywords».
content=»ключевые слова»	Чтобы атрибут content=»…» был правильным, в кавычках необходимо записать все ключевые слова, описывающие содержимое страницу через запятую, например, content=»ключ1, ключ2, ключ3,…».
<meta name=»description» content=»короткое описание контента»>	Этот тег предназначен краткого описания открытой пользователем странице и размещается между <head></head>.
name=»description»	Данный атрибут задает имя мета-тегу. В этом случае -«description» (описание, характеристика).
content=»короткое описание контента»	Из информации, записанной в атрибуте content=»…» поисковые роботы создают специальные сниппеты (краткое содержание), определяющие присутствующую на странице информацию. Если же он посчитает, что есть более подходящие для этого слова или ему просто не понравится описание, которое Вы запишите в этом атрибуте, то поисковик самостоятельно подберет самые релевантные (подходящие к запросу) фразы и покажет их.
<meta http-equiv=»content-type» content=»text/html; charset=кодировка»>	В данном теге указывается, с какой именно кодировкой и типом страницы браузер имеет дело. Этот тег необходим браузеру, чтобы он мог правильно отображать символы. При указании неправильной кодировки вместо символов на странице Вы увидите каракули.
http-equiv=»content-type»	Атрибут показывает браузеру, что в данном теге указана кодировка документа, а также его тип.
content=»text/html; charset=кодировка»	В данном атрибуте необходимо указать тип документа (у нас это text/html;) и его кодировку (например, charset= utf-8). Видов кодировок очень много, но в UA-нете и RU-нете чаще всего используют windows-1251 и utf-8.
<meta http-equiv=»content-language» content=»ru»>	Данный тег указывать не обязательно. Он предназначен для указания языка на странице.
http-equiv=»content-language»	Показывает браузеру, что в данном мета-теге задается язык страницы.
content=»ru»	В кавычках необходимо указать язык страницы. В нашем случае браузер будет знать, что страница написала на русском языке.
<meta http-equiv=»refresh» content=»10″>	Этот тег не обязательный. Если Вы его пропишите, то он скажет браузеру автоматически перезагрузить страницу.
http-equiv=»refresh»	Показывает браузеру, что нужно перезагрузить страницу.
content=»10″	Автоматическая перезагрузка страницы Вашего сайта должна произойти не сразу, а через время (в секундах), указанное в кавычка. В нашем случае страница перезагрузится через 10 секунд.
<meta http-equiv=»refresh» content= «10;http://domznaniy.info/» >	Этот тег не обязательный и предназначен для автоматического перенаправления на какую-либо другую страницу этого или другого сайта.
http-equiv=»refresh»	Показывает браузеру, что нужно перезагрузить страницу.
content= «10;http://domznaniy.info/»	В кавычках данного атрибута указывают время начала автоматического перенаправления в секундах (у нас 10с.).
<meta name=»robots» content=»значения указывать через запятую»>	Не обязательный мета-тег, предназначенный для правильной индексации страницы поисковым роботом. При указании нескольких значений, их записывают через запятую.
name=»robots»	Название тега.
content=»index»	Вся страница будет индексироваться.
content=»noindex»	Вся страница не будет индексироваться.
content=»follow»	Гиперссылки при индексировании будут учитываться.
content=»nofollow»	Гиперссылки при индексировании не будут учитываться.
content=»all»	Данным атрибутом можно заменять комбинацию content=»index,follow «, то есть страница будет индексироваться и гиперссылки — учитываться.
content=»none»	Данным атрибутом можно заменять комбинацию content=»noindex,nofollow «, то есть страница не будет индексироваться, и гиперссылки учитываться не будут.
<meta name=»author» content=»ФИО автора»>	Не обязательный тег, предназначенный для указания авторства.
content=»ФИО автора»	В этом атрибуте нужно указывать ФИО автора.
<meta name=»copyright» content=»Все права принадлежат…»>	Не обязательный тег, предназначенный для указания принадлежности авторских прав контента.
content=»Все права принадлежат…»	В атрибуте content=»…» необходимо указать, кому принадлежат права на контент, размещенный на странице сайта.
<link href=»путь/style.css» rel=»stylesheet» type=»text/css»>	Если на сайте используется специальный файл со стилями css, то этот тег предназначен для его подключения к странице. В атрибуте href=»путь/style.css» необходимо указывать полный путь от данной страницы до файла style.css.

Многие из указанных выше тегов не обязательны. Их можно пропустить. Общий вид правильно записанного тега <head></head> будет выглядеть так:

<head>
  <title>Страница Вашего сайта</title>
  <meta http-equiv="content-type" content="text/html; charset=кодировка">
  <meta name="keywords" content="ключевые слова">
  <meta name="description" content="краткое описание документа">
</head>

или боле точно:

<head>
  <title>Страница Вашего сайта</title>
  <meta http-equiv="content-type" content="text/html; charset=windows-1251">
  <meta name="keywords" content="ключевые, слова, через, запятую">
  <meta name="description" content="на этой странице Вы узнаете…">
</head>

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