Как добавить метатег в код страницы своего сайта

Тег HTML — мета теги, информация о странице

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

Часто используются meta-теги: author, description, keywords, viewport, charset.

Мета теги находятся в области HTML документа (подробнее про ). Вставить или, как говорят, прописать мета теги можно в любом порядке и количестве.

Использовать meta теги не обязательно, но мы рекомендуем заполнять хотя бы мета теги description , viewport , charset . Это будет плюсом для внутренней оптимизации сайта.

Синтаксис

Примеры использования в HTML коде

Основные мета теги

Ниже приведены несколько основных тегов с комментариями по применению и примерами использования.

Meta-тег description

Краткое описание документа (страницы сайта). Поисковые системы могут использовать содержимое мета тега description для вывода в сниппете поисковой выдачи.

Добавление мета-тэга в исходный код своего сайта на WordPress

Текст из meta description в сниппете выдачи

Пример использования мета тега description

Meta-тег keywords

Ключевые слова страницы. Ранее использовался для указания поисковым системам основные смысловые фразы веб-страницы. На данный момент существуют разные мнения как правильно и стоит ли заполнять мета тег keywords .

Как добавить копию в электронной почте

Пример заполнения мета тега keywords

Meta-тег viewport

Задает некоторые параметры окна просмотра в браузере. Атрибут width указывает ширину окна просмотра (вьюпорта), initial-scale — коэффициент масштабирования при первом открытии страницы.

Пример использования мета тега viewport

Мета тег для адаптивного сайта: указывает, что ширина вьюпорта подгоняется под размеры устройства:

Meta-тег charset

Кодировка веб страницы. Наиболее частое значение: «UTF-8».

Пример использования мета тега кодировки charset

Meta тег refresh

Мета тег с атрибутом http-equiv=»refresh» указывает время автоматического обновления страницы. Страница будет автоматически перезагружаться с интервалом указанным в content атрибуте. Значение указывается в секундах.

Пример использования meta http refresh

Поддержка браузерами

Тег
Да Да Да Да Да

Атрибуты

character_set

Указывает кодировку HTML документа.

Основное содержимое мета тега. Зависит от других атрибутов. Используется вместе с http-equiv или name.

content-type
default-style
refresh

Устанавливает HTTP заголовок для атрибута content.

Сontent-type — Кодировка. Устаревшее значение, в HTML5 используйте charset (см. пример выше).

Archivarix Q&A — Как сгенерировать метатег description на все страницы сайта.


Default-style — Предпочтительная таблица стилей.
Refresh — Интервал автообновления страницы.

application-name
author
description
generator
keywords
viewport

Имя мета тега. Как и http-equiv определяет суть мета тега.

Application-name — имя веб приложения, которое представляет страница.
Author — имя автора веб страницы.
Description — краткое описание страницы.
Generator — Указывает на программное обеспечение, использованное для создания страницы (для не рукописных страниц).
Keywords — ключевые слова страницы.
Viewport — некоторые параметры области просмотра страницы.

Источник

Как создать мета теги title, description и keywords — оптимизация мета тегов.

Для того, чтобы оптимизировать мета теги, познакомимся с ними поближе.

Как создать Яндекс диск для фотографий с телефона бесплатно

Описание мета тегов

Количество символов в теге Title не должно превышать 50-60. Так же в тег должны войти ключевики , но не стоит повторять их более 2-х раз, иначе возрастает возможность быть забаненым поисковиками. Текст не должен содержать просто набор слов, он должен быть осмыслен. У каждой страницы должен быть свой уникальный тег Title. Нужно стараться не использовать заглавные буквы в этом теге.

В мета теги Keywords вписываются сами ключевые слова или фразы. Нужно постараться не вписывать в тег больше 5-6 слов. Сначала внесите основные по значимости ключевики, а после уже остальные, через запятую. Здесь так же нужно брать уникальные ключи для каждой страницы.

Мета тег Description используется для описания страницы, он раскрывает ее настоящее содержимое, а не набор словосочетаний. Здесь нужно ввести максимум информации. Хорошо еще внести ключевики, но в меру. Объемом этот тег может быть до 160 знаков. Этот тег так же индивидуален, у каждой страницы свое описание.

Куда вставлять мета теги?

мета теги вставляются в тег head, как показано на рисунке.

куда вставлять мета теги

Пример использования мета тегов

WordPress мета теги

Источник

Как добавить метатег в код страницы своего сайта

Время чтения: меньше 5 мин

  • Алёна Батицкая ,
  • Василь Хабибуллин

Обновлено 12 марта 2022

Кратко

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

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

Пример

Как это понять

Теги содержат полезную для поисковиков и браузеров информацию. Информация в метатегах называется метаданными. Пользователь не видит их содержимое на странице.

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

Мы рекомендуем вставить как минимум метатеги description , viewport , charset . Они помогут оптимизировать сайт для браузера пользователя и поисковых систем.

Как установить код счетчика метрики на страницу сайта

В прописывается информация, которую нельзя указать в , , , или .

Как пишется

Метатег, который задаёт кодировку страницы, не отличается по структуре от обычных:

Остальные метатеги содержат атрибуты name или http — equiv , которые используются в паре с атрибутом content :

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

Атрибуты

  • charset — задаёт кодировку страницы. Мы рекомендуем писать здесь UTF — 8 — это самый распространённый вариант.

http — equiv — атрибут, который может изменять поведение страницы или серверов. Используется в паре с content . У него есть несколько значений:

«default — style» — предпочтительный стиль таблиц, который используется на странице. В этом случае в атрибуте content прописывается заголовок из элемента , который связан с таблицей CSS-стилей, или заголовок элемента , который содержит таблицу CSS-стилей.

«refresh» — время автоматического обновления страницы. Страница будет автоматически перезагружаться с интервалом, который указан в секундах.

  • name — имя мета-тега, которое также определяет его значение. Используется в паре с content . Можно задать следующие значения:
  • «keywords» — ключевые слова, которые помогают поисковикам находить страницу в интернете. По сути, это самые важные слова из содержания страницы.
  • «viewport» — задаёт параметры окна просмотра в браузере. Страницу можно сделать адаптивной, подогнав ширину окна под размеры устройства. В примере ниже width указывает ширину окна просмотра, а initial — scale — коэффициент масштабирования страницы при первом открытии:
  • «description» — краткое описание страницы, которое видит пользователь, когда находит сайт в поисковике. Например: «Рассказываем, как нарезать картошку тонкими ломтиками» для сайта о кулинарии. Это описание помогает поисковикам найти страницу, а пользователю — узнать, о чём она. Так что не забывайте указывать «description» .
  • «author» — имя автора страницы.
  • content — основное содержимое метатега, которое используется только с http — equiv и name .
Как найти ссылку на пост на сайте

Подсказки

Чтобы избежать ошибок кодировки, необходимо уместить метатег с атрибутом charset в первых 1024 байтах документа. Для этого старайтесь указывать его в самом начале тега .

Атрибуты http — equiv и name выполняют похожие функции, поэтому их нельзя использовать одновременно.

С помощью атрибута http — equiv = «refresh» можно сделать так, чтобы страница отправляла пользователя на другую страницу через определённое количество секунд. Например, отправим пользователя на главную Яндекса через 15 секунд:

На практике

Дока Дог советует

В , помимо стандартных метаданных, передаются всякие специальные. Например, есть такой браузер, как Safari: он очень любит подстраивать номера телефонов в какой-то удобный для себя вид. Чтобы отключить это своеволие, нужен отдельный метатег:

С помощью метатегов можно задавать поведение мобильной версии сайта. Например, можно прописать, на сколько на мобайле можно увеличить масштаб и насколько уменьшить относительно стандарта.

Через метатеги задаётся и Open Graph-разметка: заголовок, картинка и описание для репоста в соцсетях.

Алёна Батицкая советует

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

Пример текста под заголовком сайта в поисковой выдаче (сниппет)

Если хочется контролировать, что именно увидит пользователь в поиске — всегда заполняйте description .

Есть отдельная категория метаразметки — OG-разметка. OG расшифровывается как open graph. Такая разметка нужна для того, чтобы при вставке ссылки на ваш сайт в соцсетях в превью отображалась красивая карточка.

Пример open graph (OG) разметки

Стандартный набор метатегов для красивой карточки в Facebook:

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

Источник

Яндекс Вебмастер: подтверждение прав на сайт через метатег

После добавления сайта в Яндекс.Вебмастер обязательной процедурой является подтверждение прав на сайт. Существует 3 рекомендуемых способа подтверждения прав: через размещение метатега в коде сайта, загрузку html-файла в корневую директорию или DNS-записи. В данной статье рассмотрено подтверждение прав через метатег.

Как наполнить свой сайт

➤ Перейдите по ссылке https://webmaster.yandex.ru/sites/add/.
➤ Введите полный адрес вашего сайта (включая https://, если сайт использует безопасный протокол),
➤ Нажмите «Добавить».
——-
* Для работы с Вебмастером требуется авторизация (или регистрация) в системе — то есть у Вас должна быть почта на Яндексе.

Подтверждение прав в Вебмастере - Artsofte Digital

➤ Скопируйте предложенный Вебмастером уникальный метатег.
➤ Разместите его в коде главной страницы самостоятельно или с помощь тех.поддержки сайта.

➤ Перейдите на главную страницу своего сайта.
➤ Откройте исходный код страницы.
Для этого нажмите правой кнопкой мыши в любом месте страницы (кроме картинок и активных графических элементов, лучше на полях) и выберите пункт «Просмотр код страницы».

Ниже в таблице указаны возможные варианты просмотра исходного кода в разных браузерах.

Google Chrome;Просмотр исходного кода;Ctrl + U Firefox;Исходный код страницы;Ctrl + U Internet Explorer;Просмотр HTML-кода;Ctrl + U Opera;Исходный текст страницы;Ctrl + U Safari;Посмотреть источник;Ctrl + Alt + U

➤ Найдите размещенный тег в коде самостоятельно или с помощью поиска (Ctrl+F).

  • обновите страницу Ctrl+F5 для загрузки без кеша;
  • попробуйте открыть главную страницу и ее исходный код в приватном окне браузера;
  • очистите кеш на сайте, если такая возможность предусмотрена панелью администрирования;
  • повторите проверку через несколько минут.

Подтверждение подлинности сайта через метатег - Artsofte Digital

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

Источник
Рейтинг
Загрузка ...