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


Мета-теги для сайта. Title и Description в примерах

Что известно поисковым системам о страницах вашего сайта? «Конечно, их тексты» – скажете вы, и будете совершенно правы.

Однако, помимо текстов, вы можете передать поисковым системам дополнительную информацию о страницах своего сайта, а именно: заголовок и описание страницы. Эта информация подскажет поисковым системам, что является самым важным на странице. Заголовок и описание указываются в специальных мета-тегах title и description.

Мета-теги title и description находятся в самом начале кода HTML-страницы (между тегами <head> и </head>). Во многих системах управления сайтом мета-теги можно указать в настройках для каждой страницы сайта.

Когда вы просматриваете страницу, то в заголовке браузера в самом верху отображается текст – это и есть тег title (заголовок открытой страницы):

В поисковых системах title показывается как ссылка для перехода на сайт. Именно по тексту title большинство людей решает, переходить или нет:

Заголовок должен обязательно содержать 1-3 ключевых слова, под которые оптимизирована страница, а также – отражать ее содержимое. Важные ключевые слова следует расположить ближе к началу. Желательно уложиться в 70 символов.

Пример №1

Сайт publichall.ru

Код на сайте:
<title>Подарки оптом, подарки сотрудникам, рекламные сувениры, корпоративные подарки.</title>

Ошибка:
В заголовке использованы только ключевые слова.

Исправленный код:
<title>Подарки и сувениры, футболки с логотипом от Паблик Холл. Тел. (495) 769-97-83</title>

Пример №2

Сайт amk-1.ru

Код на сайте:
<title>«Автомоечный комплекс №1»: автомойка, шиномонтаж, кафе, сауна, комната отдыха.</title>

Ошибка:
Информация, которую будут искать пользователи (автомойка, шиномонтаж), находится не в начале заголовка.

Исправленный код:
<title>Автомойка в Воронеже, шиномонтаж и балансировка. Тел. (473) 24-42-777</title>

Пример №3

Сайт www.dextella.ru

Код на сайте:
<title>Новости</title>

Ошибка:
Слишком кратко и неинформативно.

Исправленный код:
<title>Юридические услуги в Санкт-Петербурге, ведение дел в арбитражных судах – компания Декстелла</title>

 

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

Содержимое тега description может показываться некоторыми поисковыми системами как описание страницы в результатах поиска.

Длина description должна быть не более 150 символов.

Пример №1

Сайт salonleal.ru

Код на сайте:
<meta name="description" content="Салон красоты ЛЕАЛЬ самый лучший Салон красоты москвы, салон красоты, парикмахерская, парикмахерская москва, стрижка в москве, похудеть москва, стрижка не дорого, как похудеть, похудеть москва,"/>

Ошибка:
Простое перечисление ключевых слов.

Исправленный код:
<meta name="description" content="Салон красоты Леаль предлагает Вам парикмахерские услуги, японский маникюр, разглаживание волос, ленточное наращивание волос. Новинка – ши лак! Ждем Вас!"/>

Пример №2

Сайт anapa132.ru

Код на сайте:
<meta name="description" content="Туризм, отдых, курорт, путешествия, размещение, Анапа, без посредников, дешево, недорого, частная, минигостиница, `Семейный отдых`, отдых, курорт Анапа, семейный отдых, отдых с детьми, семьей, детский, отдых в Анапе, на берегу, Черное море, без выезда за рубеж, солнечный, курорт, России, фото Анапы, фотоальбом, фото, фотографии, песчаный, туризм, турпоездка, тур, поездка на Черное море, автотурист, автотуризм, автопутешествие, путешествие, автостоп, автокемпинг, галечный, пляж, черноморское, побережье, анапа, частный сектор, санаторий, гостиница, лечение, оздоровление, грязи, лечебные, ингаляции, кино, мини-гостиница, семейный, центр, песчаный, галечный, Анапа, Витязево, Джемете, Сукко, Утриш, гостинницы, базы отдыха, квартиры, курортной, черноморской, зоны, пансионат, дайвинг, кайтинг, серфинг, курорт Анапа, аквапарк, дельфинарий, водные, лыжи, аттракционы, горки, водный стадион, воднолыжный, море, летний, лето, отпуск, детский" />

Ошибка:
Слишком длинное описание, опять же перечисление ключевых слов.

Исправленный код:
<meta name="description" content="Предлагаем недорогой семейный отдых с детьми в Анапе. К вашим услугам размещение в мини-гостинице на берегу Черного моря. Мы всегда рады гостям!" />

Пример №3

Сайт taxconsult.kz

Код на сайте:
<meta name="description" content="Бухгалтерские услуги в Алматы" />

Ошибка:
Слишком короткое описание.

Исправленный код:
<meta name="description" content="Компания TaxConsult предлагает бухгалтерские услуги в Алматы. Для Вас: консультирование в области налогообложения, постановка и ведение бухгалтерского учета, регистрация ИП и многое другое." />

 

Как видите, все довольно просто. Главное, чтобы содержимое мета-тегов совпадало с содержимым страницы – тогда мета-теги будут давать полезную информацию и поисковым системам, и посетителям вашего сайта. А значит, помогать продвигать сайт!

 

php - Как правильно вводить теги?

Переполнение стека
  1. Около
  2. Товары
  3. Для команд
  1. Переполнение стека Общественные вопросы и ответы
  2. Переполнение стека для команд Где разработчики и технологи делятся частными знаниями с коллегами
  3. Вакансии Программирование и связанные с ним технические возможности карьерного роста
  4. Талант Нанимайте технических специалистов и создавайте свой бренд работодателя
.

html - Как правильно использовать H-теги?

Переполнение стека
  1. Около
  2. Товары
  3. Для команд
  1. Переполнение стека Общественные вопросы и ответы
  2. Переполнение стека для команд Где разработчики и технологи делятся частными знаниями с коллегами
  3. Вакансии Программирование и связанные с ним технические возможности карьерного роста
  4. Талант Нанимайте технических специалистов и создавайте свой бренд работодателя
.

Как правильно размечать страницы - Проект MDN

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

Для получения справки по пользовательскому интерфейсу для редактирования тегов см. Раздел "Теги" в нашем руководстве по редактору.

Используйте теги правильно, как описано ниже.В противном случае наши автоматизированные инструменты не будут правильно формировать списки контента, целевые страницы и перекрестные ссылки статей.

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

Теги используются в MDN несколькими способами:

Классификация документов
Что это за документ? Это ссылка? Учебник? Целевая страница? Наши посетители могут использовать эти теги для фильтрации поиска, поэтому они действительно важны!
Обозначение темы
О чем статья? Это об API? ДОМ? Графика? Опять же, эти теги важны, потому что они могут фильтровать поиск.
Идентификация API
Справочные страницы, посвященные API, должны идентифицировать конкретный компонент API, который документируется (то есть, какой интерфейс он является частью и какое свойство или метод охватывает страница, если применимо).
Статус технологии
Каков статус технологии? Это нестандартно? Устаревший или устаревший? Экспериментальный?
Уровень навыка
Что касается учебных пособий и руководств, насколько продвинутый материал, охватываемый статьей?
Метаданные документа
Сообщество писателей использует теги, чтобы отслеживать, над какими страницами нужно работать.

Руководство по типам тегов

Вот краткое руководство по типам тегов и их возможным значениям.

Категория документа

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

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

Введение
Статья содержит вводный материал по теме.В идеале каждая технологическая область должна иметь только одно «Введение»
Артикул
Статья содержит справочные материалы об API, элементе, атрибуте, свойстве и т.п.
Посадка
Страница является целевой страницей.
Направляющая
Данная статья представляет собой практическую страницу или страницу руководства.
Пример
Статья представляет собой страницу с образцами кода или содержит образцы кода (то есть фактические фрагменты полезного кода, а не однострочные «примеры синтаксиса»).

Тема

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

Хотя здесь есть место для гибкости при определении новых тематических областей, мы стараемся ограничиться названиями API или технологий. Несколько полезных примеров:

В общем, тег идентификации вашей темы должен быть именем интерфейса с рядом связанных страниц (например, Node, у которого есть много страниц с его различными свойствами и методами), или именем общего типа технологии.Вы можете пометить страницу о WebGL с помощью Graphics и WebGL , например, но страницу о с HTML , Element , Canvas и Graphics .

Контент для Mozilla

Эти теги используются только в материалах, относящихся к Mozilla:

Идентификация API

В справочнике API каждая статья должна указывать, какую часть API она охватывает:

Интерфейс
Основная статья интерфейса должна иметь этот тег.Например, RTCPeerConnection .
Конструктор
Каждый интерфейс может иметь до одной страницы с тегом «Конструктор»; это конструктор интерфейса. Страница должна иметь то же имя, что и интерфейс, например RTCPeerConnection () .
Объект
Каждая статья, описывающая конкретное свойство в интерфейсе, нуждается в этом теге. См., Например, RTCPeerConnection.connectionState .
Метод
Каждая статья, описывающая метод интерфейса, нуждается в этом теге.См., Например, RTCPeerConnection.createOffer () .

Кроме того, справочные страницы должны включать в свои теги имена интерфейсов, свойств и методов. Некоторые примеры:

Интерфейс RTCPeerConnection
Включите тег RTCPeerConnection вместе с другими соответствующими тегами ( Интерфейс , WebRTC , WebRTC API , API , Ссылка и т. Д.).
Метод RTCPeerConnection.createOffer ()
Включите теги RTCPeerConnection и createOffer (обратите внимание: нет скобок в именах тегов!) Вместе с другими соответствующими тегами, включая Method , WebRTC , WebRTC API , API , Ссылка , и так далее. Рассмотрите возможность включения таких вещей, как Offer и SDP , которые также актуальны здесь.
Свойство RTCPeerConnection.iceConnectionState
Включите теги RTCPeerConnection и iceConnectionState вместе с другими соответствующими тегами, включая Property , WebRTC , WebRTC API , API и Reference . Также рассмотрите возможность включения ICE .

Статус технологии

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

Вот возможные значения для этих тегов:

Только чтение
Примените этот тег к ссылочным страницам, описывающим свойство или атрибут, доступный только для чтения.
Нестандартное
Указывает, что технология или API, описанные на странице, не являются частью стандарта, независимо от того, стабильны они или нет в каких-либо браузерах, которые их реализуют (если они нестабильны, они также должны быть экспериментальными). Если вы не используете этот тег, ваши читатели решат, что это стандартная технология. В таблице совместимости на странице должно быть указано, какие браузеры поддерживают эту технологию или API.
Устарело
Технология или API, описанные на странице, помечены в спецификации как устаревшие и, вероятно, в конечном итоге будут удалены, но обычно все еще доступны в текущих версиях браузеров.
Вышло из употребления
Технология или API были признаны устаревшими и были удалены (или активно удаляются) из всех или большинства современных браузеров.
Экспериментальный
Технология не стандартизована и является экспериментальной технологией или API, который может когда-либо стать или никогда не стать частью стандарта. Он также может быть изменен в движке браузера (обычно только в одном), который его реализует. Если технология не является частью какой-либо спецификации (даже в виде черновика), она также должна иметь тег Non-standard.
Требуются привилегии
API требует привилегированного доступа к устройству, на котором выполняется код.
Только сертифицированный
API работает только в сертифицированном коде.

Эти теги не повод упускать таблицу совместимости в вашей статье! Это должно быть всегда.

Уровень навыка

Используйте тип тега уровня навыков только для руководств и учебных пособий (то есть страниц с тегами Руководство ), чтобы помочь пользователям выбрать учебные пособия в зависимости от того, насколько они знакомы с технологией.Для этого есть три значения:

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

Метаданные документа

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

Осадка
Статья не завершена и, по крайней мере, теоретически все еще активно обновляется (хотя, возможно, о ней уже забыли). Прежде чем вносить изменения, постарайтесь проконсультироваться с самыми последними участниками, чтобы избежать потенциальных конфликтов контента.
NeedsCompatTable
В статье нужна таблица, чтобы указать совместимость функции в разных браузерах. См. Здесь руководство по обеспечению совместимости браузеров.
Необходимое содержание
Статья незавершена или в ней отсутствует информация. Этот тег означает, что кто-то должен просмотреть содержимое и добавить дополнительные сведения и / или закончить написание статьи.
Требуется Пример
В статье требуется один или несколько примеров, которые помогут проиллюстрировать суть статьи. В этих примерах должна использоваться система живых образцов.
NeedsLiveSamples
В статье есть один или несколько примеров, которые необходимо обновить, чтобы использовать систему живых образцов.
Требуется MarkupWork
В статье необходимо улучшить разметку страницы (обычно потому, что содержимое страницы состоит в основном или полностью из тегов

).

Таблица потребностей
В статье необходима таблица, чтобы указать, в каком документе (ах) спецификации была определена функция.
Требуется обновление
Содержание устарело и требует обновления.
l10n: исключить
Содержимое действительно не стоит локализовать и не будет отображаться на страницах статуса локализации.
l10n: приоритет
Контент важен и должен быть отмечен как приоритетный для переводчиков MDN. Отображается в таблице с дополнительным приоритетом на страницах статуса локализации.

Собираем все вместе

Итак, каждой странице вы назначаете теги из нескольких типов тегов, например

Учебник по WebGL для начинающих
WebGL, Графика, Руководство, Начинающий
Справочная страница для
Холст, HTML, элемент, графика, Ссылка
Целевая страница для инструментов разработчика Firefox
Инструменты
, Firefox, Лендинг

Фильтры тегов и поиска

Фильтры поиска не будут работать должным образом, если мы правильно не помечаем страницы MDN.Вот таблица фильтров поиска и тегов, которые они ищут. (Фильтры поиска используются только на вики-сайте (редактирующем); сайт только для чтения использует другую поисковую систему без фильтров.)

Примечание: Если в разделе «Имя тега» указано несколько тегов, это означает, что для соответствия статьи должен присутствовать один или несколько из этих тегов.

Проблемы с тегами, которые можно исправить

Есть несколько типов проблем с тегами, которые вы можете исправить:

Нет тегов
Обычно статьи должны иметь не менее тегов "категория" и "тема".Обычно подходят и другие теги, но если вы поможете нам обеспечить наличие минимального количества тегов, вы станете героем документации!
Теги, не соответствующие нашим стандартам маркировки
Исправьте все документы, теги которых не соответствуют стандартам на этой странице.
Обратите внимание, что иногда вы можете видеть некоторые локализованные теги (например, Référence ), появляющиеся на некоторых страницах на английском языке. Это произошло из-за ошибки в Kuma, из-за которой теги появлялись снова, даже если они были удалены.С тех пор эта ошибка была исправлена, поэтому любые оставшиеся локализованные теги могут быть удалены, если они обнаружены.
Неверные теги
Если вы читаете статью о HTML с пометкой «JavaScript», возможно, это неправильно! Точно так же, если в статье обсуждается внутреннее устройство Mozilla, но есть тег «Web», это, вероятно, тоже неверно. Удалите эти теги и добавьте нужные теги, если их еще нет. Также исправьте теги с ошибками (например, "Javascript" по-прежнему будет соответствовать, поскольку теги нечувствительны к регистру, но давайте не будем небрежными!).
Отсутствующие теги
Если в статье есть некоторые, но не все теги, которые ей нужны, вы можете добавить больше. Например, если страница в ссылке на JavaScript (правильно) помечена тегом «JavaScript», но никак иначе, вам предлагается также добавить тег страницы «Ссылка» или другой тег категории!
Тег спам
Этот коварный зверь - самая отвратительная проблема с тегами из всех: некоторые паразиты оставили свой помет в тегах страниц (например, «Free warez!» Или «Эй, я просматривал ваш сайт и хотел спросить вас, не могли бы вы помочь мне решить эта проблема у меня с Flash постоянно вылетает ").Мы должны немедленно удалить их! Они уродливы, ими трудно управлять, если им позволяют задерживаться слишком долго, и они ужасны для SEO.

Если вы видите одну (или несколько) из этих проблем, войдите в MDN и нажмите ИЗМЕНИТЬ в правом верхнем углу окна MDN. Когда редактор загрузится, прокрутите страницу вниз до нижней части страницы, где вы увидите поле тега. Дополнительные сведения об интерфейсе тегов см. В разделе «Поле тегов» в руководстве редактора MDN.

.

javascript - bootstrap.css неправильно отображает теги разделов

Переполнение стека
  1. Около
  2. Товары
  3. Для команд
  1. Переполнение стека Общественные вопросы и ответы
  2. Переполнение стека для команд Где разработчики и технологи делятся частными знаниями с коллегами
  3. Вакансии Программирование и связанные с ним технические возможности карьерного роста
  4. Талант Нанимайте технических специалистов и создавайте свой бренд работодателя
.

Смотрите также

Поделиться в соц. сетях

Опубликовать в Facebook
Опубликовать в Одноклассники
Вы можете оставить комментарий, или ссылку на Ваш сайт.

Оставить комментарий