Дом знаний

×

Внимание

Не удалось вызвать функцию mail.

Теги 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>

 

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

 

Интересное на Ютубе:

 

Похожие материалы:

 

 

Автор: Сосновский М.
Специально для: Дом знаний
1 1 1 1 1 1 1 1 1 1 Рейтинг 4.88 (4 Голоса (ов))
Понравилась статья?
Поделитесь ею с друзьями

Ошибка в тексте?
Выделите ее и Нажмите:
error in text button

 

Еще по теме:

 

 

Если статья Вам полезна,
не стесняйтесь и оставляйте свои комментарии.
Спасибо за посещение.

Добавить комментарий


Защитный код
Обновить

Комментарии   

0 # Andreifag 23.05.2018 11:33
Многие компании Санкт-Петербург а готовы предложить песок и организовать его доставку до стройплощадки. Но основные критерии, на которые следует обратить внимание при выборе поставщика – это бесперебойность поставок, умеренная стоимость транспортировки и, конечно, надежность. Наша компания имеет многолетний опыт по доставке песка http://www.gravel-soil.ru на стройплощадки в Ленинградской области. Для того чтобы узнать необходимую информацию, достаточно лишь набрать номер отдела продаж, где менеджер назовет вам стоимость кубометра песка, которая не сможет вас не заинтересовать. Мы уверены, что желание заключить договор с другой компанией отпадет само собой.
https://c.radikal.ru/c29/1805/52/19920d5c64d3.jpg: http://www.gravel-soil.ru
Ответить | Ответить с цитатой | Цитировать
0 # kuhninazakaz.info 03.06.2018 02:24
ремонт в маленькой кухне Котельники

http://kuhninazakaz.info/page/remont-v-malenkoj-kuhne-kotelniki/
.
Ответить | Ответить с цитатой | Цитировать
0 # Sergionandax 08.06.2018 06:19
В нашей интернет аптеке вы сможете заказать софосбувир и даклатасвир по низкой стоимости

Стивагра (Stivarga) - Регорафениб (Regorafenib) купить

ibrance - палбоциклиб palbociclib: http://evro-pharma24.ru/lekarstvo-ot-raka/555/

инлита axitinib 5 мг

стивагра купить: http://evro-pharma24.ru/lekarstvo-ot-raka/554/
Ответить | Ответить с цитатой | Цитировать
0 # RobertDig 08.06.2018 22:11
Благодаря своей многофункционал ьности манипуляторы приобрели самое широкое применение в Санкт-Патербург е и Ленингадской области, на самых разных участках работ, требующих оперативности и мобильности. Именно поэтому, применение данного вида техники, это рентабельное решение при осуществлении перевозок. Аренда манипулятора http://www.manipulator-47.ru на любой комфортный срок, оформляется немедленно. И вам не придётся задумываться о лишних тратах на приобретение спецтехники.
https://c.radikal.ru/c21/1804/50/900c92de371d.jpg: http://www.manipulator-47.ru
Ответить | Ответить с цитатой | Цитировать
0 # DmitrijDrara 22.06.2018 14:51
На протяжении многих лет наша компания в Гатчине предоставляет услуги по аренде строительной техники http://www.техникаспец.рф . Парк имеет в своем составе полноповоротные экскаваторы, гусеничные экскаваторы, также погрузчики и самосвалы. Цены на строительную технику самые приемлемые в городе. Чтобы ускорить процесс выполнения работ или же заменить свою технику, которая сломалась и требует ремонта, мы предоставляем идеальную возможность воспользоваться услугами аренды.
https://c.radikal.ru/c39/1806/ec/9e0cfe042f77.jpg: http://www.техникаспец.рф
Ответить | Ответить с цитатой | Цитировать
0 # KinologBic 27.06.2018 07:40
Дрессировка норвич терьера http://dressirovkaobuchenie.ru/152.html небольшими, но смелыми псами с охранными инстинктами являются эрдельтерьеры, хотя их забавный внешний вид может смутить.
Ответить | Ответить с цитатой | Цитировать
0 # prava.ml 05.07.2018 01:01
медсправка для замены водительских прав 2018

http://prava.ml/page/medspravka-dlya-zameni-voditelskih-prav-2018/
.
Ответить | Ответить с цитатой | Цитировать
0 # RogerCex 17.07.2018 06:21
В настоящее время покупатели проявили большой интерес к новинке – живым цветам в стекле. Они прекрасно смотрятся на столе, на тумбочке, по внешнему виду ничем не отличаясь от обычных живых цветов, подробнее читайте на сайте http://tvoi-noski.ru: http://tvoi-noski.ru
Ответить | Ответить с цитатой | Цитировать
0 # StanleySon 17.07.2018 19:57
Ревность является отрицательным и разрушительным чувством для любовных отношений. Конечно, в малых дозах она даже полезна, но здесь речь идет о том, что человек психически нездоров. Читайте об этом подробнее на сайте ladysarafan.ru: http://ladysarafan.ru
Ответить | Ответить с цитатой | Цитировать
0 # Frankganna 21.07.2018 13:54
Шампанское ассоциируется у людей с праздником. Среди разных его сортов особое место занимает брют. Этот напиток родом из Шампани (провинция во Франции) имеет легкий вкус и свежий аромат. Читайте об этом подробнее на сайте ladystory.ru: http://ladystory.ru
Ответить | Ответить с цитатой | Цитировать
0 # Charlesgeami 23.07.2018 03:00
О деньгах много писали, пишут и будут писать. Без них как говорится: «Ни туды и ни сюды», подробнее читайте на сайте http://xozyaika.com: http://xozyaika.com
Ответить | Ответить с цитатой | Цитировать
0 # DavidLal 23.07.2018 03:18
На рынке спальных принадлежностей особое место занимают подушки и одеяла с натуральными наполнителями, в частности, подушки из овечьей шерсти. Этот природный материал еще с библейских времен используется человеком для изготовления одежды, бытовых и постельных принадлежностей . Читайте об этом подробнее на сайте dettka.com: http://dettka.com
Ответить | Ответить с цитатой | Цитировать
0 # Ruebenwhary 24.07.2018 11:06
Наверняка каждый согласится, что с самых малых лет нужно приучать детей к носке исключительно качественной, полезной для ног обуви, в которой они будут себя чувствовать комфортно всегда и везде, подробнее об этом читайте на сайте nalatty.com: http://nalatty.com
Ответить | Ответить с цитатой | Цитировать
0 # Shelbycap 25.07.2018 06:02
Конкуренцию стандартным петельным межкомнатным открывающимся конструкциям составляют более функциональные решения – сдвижные двери. Они так же включают в себя полотна из древесины или иного материала, вот только главные элементы блока движутся по прямым линиям (направляющим) параллельно стене. Читайте об этом подробнее на сайте akro-spb.ru: http://akro-spb.ru
Ответить | Ответить с цитатой | Цитировать
0 # JamesLib 25.07.2018 08:13
Парикмахерская – это предприятие бытового обслуживания, которое посещают практически все жители города. Подробнее читайте на сайте shoptrip.ru: http://shoptrip.ru
Ответить | Ответить с цитатой | Цитировать
0 # JustinEnulp 26.07.2018 21:34
Тестирование доконтактного способа профилактики ВИЧ-инфекции стартовало в России. По словам руководителя Федерального научно-методиче ского центра по профилактике и борьбе со СПИД, академика РАН Вадима Покровского, это не исключает использование других методов, передает "Интерфакс". Комментирует эксперт: Читайте об этом подробнее на сайте http://dom-lady.ru: http://dom-lady.ru
Ответить | Ответить с цитатой | Цитировать
0 # CurtisTab 27.07.2018 11:36
В условиях плановой экономики сертификацией всей выпускаемой продукции занимался Госстандарт (по отраслям и ведомствам). Но с переходом экономики на рыночные рельсы, порядок определения качества продукции изменился, подробнее об этом читайте на сайте http://blitz-remont.ru: http://blitz-remont.ru
Ответить | Ответить с цитатой | Цитировать

Кормление ребёнка в 5 месяцев - 1…

Кормление ребенка в грудном возрасте – очень кропотливый и ответственный момент. В это время родителям...

Мясные блюда для ребёнка до 1 год…

Люди постоянно ведут споры, нужно ли употреблять мясные блюда для нормального самочувствия человека. Одни ут...

КАК ВЫБРАТЬ И ГДЕ КУПИТЬ ЛУЧШИЙ КВАДРОКОПТЕР...

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

ДЛЯ ПОЛУЧЕНИЯ БОЛЬШОГО УРОЖАЯ ВИНОГРАДА НУЖНО...

Университет виноградаря научит выращивать виноград любого типа и в любых условиях...

ОБУЧЕНИЕ НА ВИДЕО КУРСАХ - ЛУЧШИЙ ВИД ПОЛУЧЕНИЯ ЗНАНИЙ...

Множество видео курсов на одном сайте. Здесь Вы найдете как платные, так и...

ХОЧЕШЬ ЗНАТЬ, КАК СОЗДАВАТЬ И РАСКРУЧИВАТЬ...

Азы сайтостроения. Все, что необходимо знать новичкам о...