Мы используем файлы cookie для обеспечения работоспособности сервиса, улучшения навигации и маркетинговых активностей Serpstat. Нажимая "Принять и продолжить", вы соглашаетесь с нашей Политика конфиденциальности

Сообщить об ошибке

Отменить
12599 4
How-to Читать 6 минут

Что должно присутствовать в теге Body

Что такое тег Body и что должно в нем присутствовать
АУДИТ САЙТА — КОНТЕНТ
Инструкцию одобрил
Руководитель SEO отдела в Mnogoland
Тег body — важный элемент, который содержит весь контент, отображаемый на веб-странице в браузере. Его необходимо правильно заполнять, чтобы страница корректно выглядела и успешно ранжировалась в поисковых системах.

Что такое тег body

Тег body — неотъемлемая часть любой HTML-страницы, необходимая для обозначения границ основного содержимого, которое показывается пользователям. Упрощенно HTML-страница имеет следующую структуру:

  • head — блок заголовков, содержащий техническую информацию, скрипты и метатеги, которые браузер не показывает пользователям в стандартном режиме просмотра. Исключение — метатег <title>, который определяет заголовок страницы;

  • body — все содержимое страницы, доступное пользователям.

В HTML-документе должен быть только один тег <body>. Для успешного продвижения страницы в него необходимо добавлять качественный и уникальный контент, интересный пользователям. При этом важно следить, чтобы он не дублировал полностью либо частично содержимое других страниц как собственного проекта, так и других сайтов. В теге body нет ключевых слов или фраз.

Где находится тег body

Увидеть HTML-теги на web-странице можно, кликнув правой кнопкой мыши и нажав «Просмотр кода страницы»:
Просмотр кода страницы в Chrome
В начале страницы размещен открывающийся тег <head>:
Тег Head в коде страницы
Открывающийся тег <body> следует сразу после закрывающегося </head>, завершающего блок заголовков:
Теги head и body

Для чего нужен тег body

Тег <body> предназначен для добавления всего контента и функционала для взаимодействия с пользователями — сюда относятся заголовки, тексты, гиперссылки, баннеры, картинки, видео, формы для связи и прочее.

Также в теге могут размещаться js-скрипты, выполняющие различные функции. Код при этом размещается внутри тегов <script></script>. В HTML5 тип скрипта дополнительно прописывать не нужно, так как по умолчанию это JavaScript. В устаревших версиях HTML js-скрипты прописывались так:
Скрипты Javascript в теге Body
Еще в тег <body> можно добавлять атрибуты и события, видоизменяющие страницу. Например, можно добавить определенное сообщение, появляющееся после загрузки страницы или при нажатии кнопки мыши.

Атрибуты тега body

В тег можно добавлять атрибуты, определяющие цветовую схему страницы, хотя более предпочтительно использовать селектор body в отдельном файле с CSS-стилями:
Атрибуты в теге Body
Применение ряда атрибутов тега <body>, например, rightmargin и leftmargin, осуждается спецификацией HTML и станет причиной не валидного кода. Некоторые атрибуты можно использовать с переходным типом <!DOCTYPE>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
При использовании атрибутов в теге body можно сразу посмотреть, как страница будет выглядеть при внесении изменений. Для этого в Google Chrome нужно кликнуть правой кнопкой мыши по странице и выбрать «Просмотреть код», после этого браузер будет отображаться в режиме разработчика.

Примеры использования атрибутов тега <body>

  • В данном примере использован атрибут bgcolor, определяющий фоновый цвет страницы. С его помощью исходный цвет фона страницы был изменен на черный:
Атрибут bgcolor в теге Body
Цвет можно указать с помощью шестнадцатеричных кодов либо названий, которые предусмотрены в стандарте HTML;

  • изменение цвета текста страницы с помощью атрибута text:
Атрибут text в теге Body
  • изменение фонового изображения с использованием атрибута background:
Атрибут background в теге Body
Путь к файлу можно использовать как в относительном, так и в абсолютном виде. Относительный путь предпочтительнее, так как обеспечивает менее длинные ссылки, а также избавляет от проблем при смене домена. В этом случае все ссылки останутся рабочими, в отличие от варианта с абсолютным адресом, при котором после изменения домена гиперссылки станут битыми.

Можно ли добавлять метатеги в body

Метатеги, например, <robots>, <description> должны помещаться в раздел заголовков документа — head. Метатеги предназначены для служебной информации о документе, которая не демонстрируется в теле документа.

Попытки использовать какой-либо метатег в body делают код недействительным с точки зрения спецификации HTML и могут нарушить разметку документа.

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

Заключение

1
Тег <body> — необязательный элемент в спецификации HTML5, однако его использование на веб-страницах удобно для разграничения служебной информации и контента сайта. Также он полезен для создания стилей страницы в CSS-файле.
2
Наполнять тег <body> стоит уникальным контентом, который будет представлять интерес для пользователей и в полной мере соответствовать запросам целевой аудитории.
3
В данном теге может содержаться информация в разнообразных видах и формах: текст, мультимедийный контент и скрипты, делающие страницу интерактивной.
4
Нужно с осторожностью использовать атрибуты тега <body>, поскольку многие из них противоречат спецификации HTML и их применение приводит к не валидной верстке.
5
Не стоит размещать метатеги в <body> поскольку это нарушает правила спецификации HTML.
Эта статья — часть модуля «Аудит сайта» в Serpstat
«Аудит сайта» в Serpstat" title = "Что должно присутствовать в теге Body 16261788249403" />
Аудит всего сайта или отдельной страницы в один клик. Полный список ошибок, отсортированный по критичности, пути их устранения и рекомендации. Любая периодичность проверки и автоматическая рассылка отчетов на почту.
Запустить аудит сайта

Сэкономьте время на изучении Serpstat

Хотите получить персональную демонстрацию сервиса, тестовый период или эффективные кейсы использования Serpstat?

Оставьте заявку и мы свяжемся с вами ;)

Оцените статью по 5-бальной шкале

3.25 из 5 на основе 8 оценок
Нашли ошибку? Выделите её и нажмите Ctrl + Enter, чтобы сообщить нам.