5. Что такое теги в HTML и для чего они нужны
Подписывайся на наш Telegram-канал!
Новости, полезный материал,
программирование и ИБ
КраткоПарные теги
- Парные теги состоят из открывающего и закрывающего тегов.
- Примеры парных тегов:
<p>
,<h1>
.- Парные теги преобразуют содержимое, как одежда преобразует человека.
Одинарные теги
- Одинарные теги не имеют закрывающего тега.
- Примеры одинарных тегов:
<br>
,<hr>
,<img>
.- В HTML5 закрывающая косая черта не обязательна.
Рекомендации по изучению тегов
- Используйте сразу несколько тегов.
- Отрабатывайте теги в заданиях и придумывайте свои.
- Читайте литературу и тематические сайты.
Значение парных тегов
- Умение манипулировать тегами важно для верстки сайта.
- Парные теги помогают структурировать информацию.
- Поисковые системы предпочитают заголовки в тегах первого уровня.
- Использование тегов маркированного и нумерованного списков также влияет на выдачу.
- Атрибуты
title
иalt
также важны для поисковой выдачи.- Google имеет 200 официальных пунктов, влияющих на выдачу.
В предыдущем уроке кратко поговорили об одинарных и парных тегах. В этом поговорим о том же самом. Это основы, которые нужно понять раз и навсегда. Иначе дальше двигаться не получится.
Что такое парные теги?
Продолжим наше ознакомление с искусством верстки на HTML. На очереди – парные теги. И вообще, что за слово такое ругательное? Теги? Итак, тег, умные люди, в частности отцы паутины, называют «дескриптор», но я его так никогда не называл, и не буду называть на моем сайте, можно же просто – «тег». Тег – это элемент языка разметки текста (HTML). Кратко говоря: «Тег – элемент HTML», все, что внутри тега, называют содержанием элемента. Логично, не так ли? Я говорю проще: «внутри тега», умные слова только на конференциях нужно использовать, а не в быту.
Итак, подобрались к парным тегам, включаем логику, парный, хм… значит, есть начальный тег и конечный тег, но их так не называют, кроме Википедии, конечно. Правильно так: «Открывающий тег и Закрывающий тег». Даже с большой буквы написал, в знак уважения. Теперь, например: <p>…</p>
, есть открывающий, есть закрывающий тег, значит это парный тег. Тег <h1>…</h1>
тоже парный, кстати, знакомьтесь, это заголовок первого уровня. На странице должен быть только один заголовок первого уровня.
Для большего понимания проведем аналогию: тег – это одежда, а его содержимое – это человек. Облачив человека в одежду, он преобразуется. Также, если обернуть содержимое (текст, например) в тег, он поменяет свой внешний вид. Это мы говорим о парных тегах.
Что такое одинарные теги?
Несложно догадаться: у него отсутствует закрывающий тег. Пример: <br>
, <hr>
, <img>
. Думаю, кто-то видел теги такого плана: <br/>
, и так далее. Это «Старый стиль». Да, когда был HTML4, нужно было закрывать одинарный тег именно так, но с появлением HTML5 многое изменилось, и не только это. Не настаиваю на написание закрывающей косой черты и в системе проверки это учтено, но давайте быть новаторами и не тормозить процесс! Те три тега «перенос строки», «разделительная линия», «изображение», соответственно.
Как изучать все эти теги?
Старайтесь использовать сразу эти теги. Отрабатывайте их в заданиях и придумывайте свои задания, для себя. Читайте литературу и тематические сайты.
А теперь приступите к заданию. В нем немного нужно подумать. Даю подсказку, после слова «это» напишите какой-то тег, тот который в задании.
О парных тегах в HTML
Умение быстро и четко манипулировать тегами, это хороший старт в изучении. Вы практически всегда будете работать с этими тегами, верстая сайт. В одном из следующих уроков (парные теги), вы познакомитесь ближе с парными тегами.
Правильно структурировать информацию, тоже хорошее дело, ведь поисковые системы (Yandex, Google), любят, когда заголовки помещены в теги заголовка первого уровня – это информация официальная, ее озвучил глава Google. На поисковую выдачу влияет так же использование тегов «маркированный список» и «нумерованный список». Ещё на поисковую выдачу влияет использование атрибутов title
, alt
. Да это только малая часть, на самом деле, есть 200 официальных пунктов от Google, которые влияют на выдачу в поисковике. Возможно, обо всех их я напишу.
В следующем уроке поговорим об одинарных тегах.
Похожие уроки Codebra
Подписывайся на наш Telegram-канал!
Новости, полезный материал,
программирование и ИБ
- Сделайте так, чтобы три слова были на разных строчках при помощи тега
<br>
– Не пропускайте новостей, подпишитесь на нашу страницу ВКонтакте, Telegram.
– На данный момент на сайте нет возможности оставлять комментарии, но Вы можете спросить в нашей Telegram-группе.
Это займет не больше минуты.