Основное о тегах html

Эта статья для тех, кто только начал создавать свой первый блог. Это время, когда на каждом шагу требуется собирать информацию, узнавать, как и что делать. И почти в каждой рекомендации идет речь о тегах. Что это такое, где их увидеть, что можно с ними сделать, чем это нам вообще поможет? — О таких, простых, с точки зрения большинства матерых блоггеров, вещах тоже хочется почитать.

Теги html и теги в блогах

Во-первых, нужно четко определиться, о каких тегах мы говорим. Дело в том, что на многих платформах для ведения блогов тоже есть понятие «теги». Это авторские обозначения темы поста. В Вордпресс их называют «метки», на Blogspot — «ярлыки». Но, как бы мы не называли это явление — оно не имеет никакого отношения к тегам html.

Поэтому, когда мы читаем, что нужно или не нужно использовать в статье, например, тег strong — это не значит, что нужно присвоить статье такой тег, или метку, или ярлык.

Что такое теги и зачем они вообще

В html тег — это элемент разметки текста, который читают браузеры. Если не будет тегов — текст поста будет выглядеть безликой массой слов. Именно благодаря тегам заголовки представляются читателю, как заголовки, цитаты, как цитаты, абзацы, как абзацы, списки, как списки, и т.д.

Кроме того, роботы поисковых систем, инспектирующие наши блоги, тоже обращают внимание на html разметку текста. К тексту, заключенному в определенные теги, они относятся с повышенным вниманием. Например, это текст заголовков h1 и h2, текст, выделенный полужирным и курсивом. То есть, html-структура поста имеет влияние на индексирование и ранжирование материалов блога.

Где можно увидеть html разметку текста

Если вы работаете на Вордпресс или Blogspot — в редакторе переключите окно на HTML.

Вы можете посмотреть код любой Интернет-страницы (если ее владелец не заблокировал клики правой кнопкой мыши). Кликните правой кнопкой и из появившегося списка выберите «просмотр кода страницы». Сверху вы увидите множество сведений, которые к нашей сегодняшней теме не относятся. Но, прокрутив ниже, обнаружите текст статьи, разбитый на части. И каждая часть окружена тегами.

Особенности тегов

У тегов обязательно должны быть какие-то особенности, которые бы отличали их от обычного текста. Ведь это мы с вами пишем на русском, а англоязычные блоггеры — им вообще бы не разобраться. Нельзя забывать и о роботах, которые вообще не поймут, что к чему, если их не ткнуть носом.

Такой особенностью тега являются треугольные скобки, в которые он заключен. Например:

<strong>

Вторая важная особенность — тег должен быть закрыт. Если есть открывающий тег, который пишется непосредственно перед фрагментом текста, к которому он применяется — то в конце этого фрагмента текста должен быть закрывающий тег. Отличается закрывающий тег тем, что перед его названием стоит слеш «/». Например:

<strong>выделение текста</strong>

А вот, как выглядит эффект этого тега в визуальном редакторе: выделение текста

У тегов могут быть атрибуты, которые отсылают браузер к таблице стилей CSS или прямо указывают, как должен выглядеть данный фрагмент текста. Теги могут быть вписаны один в другой, по правилам «матрешки». Например:

<p>Внутри предложения <strong>пара слов</strong> может выделяться</p>

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

Зачем нам вообще нужно знать о тегах

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

<big>...</big>

который увеличивает размеры шрифта в первых абзацах статей Блоготея.

И даже пользуясь визуальным редактором, автор должен отчетливо понимать, что выделение текста курсивом или жирным, расстановка заголовков — не просто украшения. Это реальный инструмент общения с роботами поисковых систем. Это инструмент СЕО. И он может сработать, как во благо, так и во вред блогу.

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