68 подписчиков

Meta-теги

28 мая 202028 мая 2020

2 мин

Оглавление

Описание страницы
Title
Description

Когда люди впервые начинают верстать, то часто не понимают, зачем нужны meta-теги, однако у них есть вполне понятное объяснение. Они нужны для SEO.

Посмотрев HTML код разных сайтов возникает вопрос – зачем в нем так много мета-тегов и для чего они нужны? В данной статье представлены все самые встречающеюся теги с примерами и пояснениями.

Описание страницы

Title

Заголовок страницы, оптимальная длина 50-60 символов.

<title>...</title>

Description

Краткое описание страницы длинной 160-180 символов, используется в выводе результатов поиска.

<meta name="description" content="...">

Keywords

Содержит ключевые слова встречающихся на странице. Не более 20-ти слов и 3-х повторов.

<meta name="keywords" content="...">

Кодировка сайта

<meta charset=utf-8">

Application-Name

Название веб-приложения. Можно указать несколько названий для разных языковых локалей.

<meta name="application-name" content="Моё приложение"><meta name="application-name" lang="en" content="My application"><meta name="application-name" lang="fr" content="Mon application">

Generator

Сообщает, с помощью какой программы был сгенерирован код страницы.

<meta name="generator" content="...">

Author

Информация об авторе сайта.

<meta name="author" content="...">

Copyright

Информация о владельце сайта.

<meta name="copyright" content="...">

Reply-To

Указывает способ связи с автором страницы.

<meta name="reply-to" content="mail@example.com">

Content-Language

Указывает язык страницы. Используется поисковыми машинами при индексировании.

<meta http-equiv="content-language" content="ru">

Управление индексацией

Last-Modified

Альтернативно HTTP-заголовку Last-Modified задает дату последнего изменения для статических страниц.

<meta http-equiv="last-modified" content="2017-12-31@08:04:23 +00:00">

Управление кэшированием

Cache-Control

Указывает как браузеру кэшировать страницу.

<meta http-equiv="cache-control" content="no-cache">

Pragma

Отключает кэширование.

<meta http-equiv="pragma" content="no-cache">

Атрибут «Media»

Значение handheld или only screen and (max-width: 640px) указывают адрес мобильной версии.

<link rel="alternate" media="handheld" href="http://m.example.com/"><link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.example.com/">

Google

Google-Site-Verification

Подтверждение прав пользователя сервисов Google.

<meta name="google-site-verification" content="...">

Значение «Notranslate»

Если страница написана на языке, который не подходит пользователю, Google добавляет ссылку, позволяющую сделать перевод на нужный язык. Значение notranslate отключает эту функцию.