Метатеги

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

Метатеги для поисковых механизмов

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

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

Некоторые принципы, относящиеся к метатегам:

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

description

Большинство поисковых серверов отображают содержимое поля description (пример 1) при выводе результатов поиска. Если этого тега нет на странице, то поисковый движок просто перечислит первые встречающиеся слова на странице, которые, как правило, оказываются не очень-то и в тему.

Пример 1. Использование Description

keywords

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

Пример 2. Использование Keywords

Ключевые слова можно перечислять через пробел или запятую. Поисковые системы сами приведут запись к виду, который они используют.

Автозагрузка страниц

Чтобы автоматически загружать новый документ через определенный промежуток времени используется инструкция http-equiv=»refresh» (пример 3).

Пример 3. Автозагрузка страницы

Браузер поймет эту запись, как ожидать 5 секунд, а затем загрузить новую страницу, указанную в параметре URL , в данном случае это переход на сайт htmlbook.ru.

Этот метатег позволяет создавать перенаправление (редирект) на другой сайт. Если URL не указан, произойдет автоматическое обновление текущей страницы через количество секунд, заданных в атрибуте content .

Кодировка

Чтобы сообщить браузеру, в какой кодировке находятся символы веб-страницы, необходимо установить параметр . Для операционной системы Windows и кириллицы charset обычно принимает значение utf-8 или windows-1251 (пример 4).

Пример 4. Выбор текущей кодировки

Если указание кодировки отсутствует, браузер пытается сам определить, какой тип символов используется в документе и выбирает необходимую кодировку автоматически. Браузер не всегда может точно распознать язык веб-страницы и в некоторых случаях предлагает вьетнамскую кодировку вместо кириллицы. По этой причине лучше всегда указывать приведенную строчку. Тем не менее, возникают обстоятельства, когда указание кодировки может принести определенный вред. Например, веб-сервер автоматически использует перекодирование данных в KOI-8, а браузер, встретив параметр charset=windows-1251 , переводит текст в кодировку Windows. Получается двойное изменение символов, прочитать такой текст не просто. К счастью, подобная проблема уже отходит в прошлое, во всяком случае, ее легко можно выявить и нейтрализовать на уровне сервера.

Кодировка windows 1251 в сайтостроении

Кодировка windows 1251 была создана в начале 90 годов для русификации программных продуктов, выпускаемых корпорацией Microsoft :

• 0xFF (25510) – это код, который зарезервирован для символа «я». В программах, которые не поддерживают чистый 8-ой бит, часто возникают непредсказуемые проблемы;
• Нет псевдографики, которая присутствует в KOI8 , CP866 .

Ниже приведены символы из Code Page 1251 или сокращенно СР1251 ( числа под символами являются кодом в шестнадцатеричной системе такого же символа в Юникоде ):

Кодировка windows 1251 в html

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

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

Таблица кодировок не является универсальной, то есть, для расшифровки текста необходимо использовать ту, которая соответствует кодировке символов:

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

Кодировка windows 1251 в PHP

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

Для согласования расшифровки необходимо выполнить функцию mysql_query(«SET NAMES cp1251») – это означает, что преобразование из машинного кода будет осуществляться согласно таблице cp1251 .

Кодировка windows 1251 в htaccess

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

Для того чтобы для веб-ресурса была задана кодировка виндовс-1251 , необходимо найти ( или создать ) файл .htaccess . Это файл, который хранит в себе дополнительные настройки и описания конфигураций web-сервера.

В нем для установки кодировки следует прописать следующие строки:

• DefaultLanguage ru;
• AddDefaultCharset windows-1251;
• php_value default_charset «cp1251».

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

@charset

Internet Explorer		Chrome	Opera	Safari	Firefox	Android	iOS
6.0+	8.0+	2.0+	9.0+	4.0+	1.5+	1.0+	1.0+

Краткая информация

Значение по умолчанию	UTF-8
Ссылка на спецификацию	http://www.w3.org/TR/CSS21/syndata.html#charset

Версии CSS

Описание

Команда @charset применяется для задания кодировки внешнего CSS-файла. Это имеет значение в том случае, если в CSS-файле используются символы национального алфавита.

Для внешней таблицы стилей браузер последовательно просматривает следующие пункты для определения кодировки таблицы стилей:

1. кодировка, которую отдает сервер;
2. правило @charset ;
3. атрибут charset тега
4. ;
5. кодировка, установленная в документе через метатег ( ).

Приведенный список имеет четко выраженную иерархию — чем выше находится пункт, тем выше его приоритет. Если ни один из пунктов не найден, будет установлена кодировка UTF-8.

Синтаксис

Значения

Для русского языка обычно указывается кодировка windows-1251 или utf-8. Значение кодировки обязательно должно быть взято в кавычки.

CSS2.1 IE 9 Cr Op Sa Fx

Браузеры

В браузере Internet Explorer до версии 7.0 включительно название кодировки допускается писать без кавычек, что противоречит спецификации CSS.

Тег meta, кодировка страницы

Отлично! С разметкой контента мы закончили. Снова возвращаемся к тегу .

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

С помощью можно сообщать браузеру, поисковому роботу или другому устройству различную служебную информацию (или метаинформацию) о вашем сайте: кодировку текста, описание контента и так далее. Для этого используются теги с разными атрибутами и их значениями. Вот некоторые из атрибутов: charset , content , http-equiv , name и scheme .

С помощью атрибута charset указывается кодировка текста HTML-страницы:

Лучше всегда указывать кодировку явно. Если этого не делать, браузер может неправильно угадать её, и вместо текста будут отображаться «иероглифы».

Самая распространённая современная кодировка — utf-8 . Используйте её во всех своих проектах. Раньше часто использовали кодировку windows-1251 , стандартную кодировку для кириллицы в Windows. Но сейчас это считается плохой практикой.

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

Хотите верстать адаптивно и по методологии, использовать препроцессоры и автоматизацию? Записывайтесь на профессиональный курс по вёрстке второго уровня, проходящий c 19 июля по 19 сентября 2021. До 26 апреля цена 21 400 ₽ 23 900 ₽

Сайт начинающего верстальщика

Всем привет! Добро пожаловать на мой первый сайт. Ещё недавно я понятия не имел, кто такой верстальщик, а теперь я нашёл тренажёры по HTML и CSS и поставил перед собой цель — стать им. У меня даже появился инструктор — Кекс, который не позволит мне расслабиться и будет следить за моими успехами.

Моё первое задание — вести дневник и честно писать обо всех своих свершениях.

Элемент meta и кодировка веб-страниц.

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

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

Если вы не создадите этот элемент, то браузер будет пытаться определить кодировку текста автоматически и создаст этот элемент сам. Не факт, что это у него получиться правильно.

Поэтому указывать кодировку документа с помощью элемента meta — это очень важное действие, которое нужно сделать при создании любой HTML-страницы.

Элемент meta должен располагаться внутри элемента .

В качестве значения атрибута charset необходимо указать название кодировки.

Пример указания кодировки Юникод(UTF-8)

Пример указания кодировки Windows-1251.

Вот, как может выглядеть полный код html-страницы:

Внесите это изменение в вашу HTML-страницу и проверьте, что она успешно открывается в браузере.

1) Разместите в комментариях скриншот на вашу тестовую страницу, которая отображается в какой-нибудь нестандартной кодировке.

2) Сможете сделать так, чтобы кодировка у веб-страницы была выставлена как meta charset=»UTF-8″, но на странице все равно показывались бы кракозябры?

Чтобы оставить сообщение, зарегистрируйтесь/войдите на сайт через:

Или зарегистрируйтесь через социальные сети: