Основы html-верстки для SEO-специалистов(конспект по лекции Нетологии)

Термины по теме «Основы html-верстки для SEO-специалистов»

html  (от англ. HyperText Markup Language) — «язык гипертекстовой разметки». Язык HTML интерпретируется браузерами; полученный в результате интерпретации форматированный текст отображается на экране монитора компьютера или мобильного устройства.

html5 (англ. HyperText Markup Language, version 5) — язык разметки гипертекста 5 версии. Цель разработки HTML5 — улучшение уровня поддержки мультимедиа-технологий с одновременным сохранением обратной совместимости, удобочитаемости кода для человека и простоты анализа для парсеров. Пример тегов html5: <article> , <footer> , <header>, <section>, <video>.

Верстка веб-страницы — создание структуры html-кода, размещающего элементы веб-страницы (изображения, текст и т. д.) в окне браузера, согласно разработанному макету, таким образом, чтобы элементы дизайна выглядели аналогично макету.

Тег (англ. tag) —  именованная метка, элемент языка разметки гипертекста.  Имеет такую конструкцию: <name-tag></name-tag>.

Тег-контейнер —  тег, который обязательно имеет открывающий (<name-tag>) и закрывающий (<name-tag></name-tag>) элементы.

Блочный тег —  тег, который при отображении в браузере автоматически добавляет разрыв строки до и после блочного элемента, при этом он занимает всю доступную ширину (по умолчанию отображается на веб-странице в виде прямоугольника), а высота блочного элемента вычисляется браузером автоматически, исходя из объема его содержимого. Текст в блочных элементах по умолчанию выравнивается по левому краю.
Пример блочного элемента: теги параграфа (<p>), теги заголовков (<h1>, <h2> и т.д.), списки (<ul>, <li>).

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

Блочная верстка или вёрстка с помощью слоёв заключается в конструктивном использовании тегов <div> и стилей.

Метатег viewport сообщает браузеру, как обрабатывать размеры страницы и изменять ее масштаб.

Open Graph Protocol  — представляет собой микроразметку от Facebook, которая в 2010 году была разработана для того, чтобы интегрировать веб-сайты с соц. сетью. Сейчас данный формат используется в Twitter, Google+, Вконтакте, Одноклассники, Pinterest и т.д. С помощью протокола Open Graph можно управлять представлением контента в социальных медиа, тем самым улучшая его взаимодействие с пользователями.

Контейнер head   —  "шапка" веб-страницы. Это тег-контейнер, внутри которого находятся метатеги, скрипты, то, что не видит пользователь, но эта информация нужна поисковым роботам и браузерам для правильного отображения информации пользователю.

Контейнер body   —  "тело" веб-страницы. Это тег-контейнер, внутри которого размещается верстка шаблона сайта и контент для пользователя.

Метатеги   — это теги HTML-разметки страницы, задающие свойства документа. В метатегах размещается информация, предназначенная для браузеров и поисковых систем. Размещаются в контейнере head.
Популярные метатеги: description, keywords, viewport.

<title></title> —  заголовок страницы - текстовый элемент веб-страницы, в сжатой форме характеризующий ее содержимое, отображается в заголовке окна браузера. (Википедия) Как правило, это одна фраза, одно предложение.

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

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

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

Тег canonical —  тег, который показывает поисковой системе, что один url для группы url-адресов является главным и только его надо брать в индекс поисковых систем. Данное правило убирает из индексирования страницы-пагинации (в новостях, блоге, статьях, категориях товаров) и позволяет выводить в результатах выдачи одну url-страницу.

Страницы пагинации —  это ограниченный показ части информации, использующийся для того, чтобы разбить большой массив данных на веб-странице и представить результаты по нескольким страницам.
Пример - когда в категории товаров размещен список товаров, разбитый постранично для показа пользователю.

favicon (англ. FAVorites ICON, в переводе – «значок для избранного»)  — это небольшое изображение отображается во вкладке браузера, в которой открыт сайт, рядом с title открытой страницы. Также его можно увидеть в результатах выдачи поисковой системы Яндекс слева от заголовка страницы.

Стили CSS (англ. Cascading Style Sheets) —  это каскадные таблицы стилей, которые содержат в себе правила оформления для группы тегов или одного тега. Стилевое оформление описывает внешний вид сайта в браузере для пользователя.

firebug —  отладчик веб-страниц, используется как отдельное расширение для браузеров. Благодаря расширению можно оперативно найти ошибку в коде, стилях, посмотреть на html-код страницы в режиме реального времени.