Метатеги используются для хранения информации предназначенной для браузеров
и поисковых систем. Например, механизмы поисковых систем обращаются к метатегам
для получения описания сайта, ключевых слов и других данных.
Метатеги для поисковых механизмов
Среди разработчиков сайтов существует мнение, что правильно написанные
метатеги позволяют подняться к верхним строчкам поисковых серверов.
На самом деле это не так, на одних метатегах высоко не поднимешься,
но и неудачно выполненное содержимое метатегов может ухудшить рейтинг
сайта.
Два метатега предназначены специально для поисковых серверов: description
(описание) и keywords (ключевые слова). Некоторые
вебмастера добавляли в раздел keywords ключевые
слова, которые не имеют никакого отношения к теме сайта, но зато пользовались
определенным успехом среди посетителей поисковиков. Однако, через некоторое
время, поисковые системы научились бороться с таким явлением и проверяют содержимое
веб-страницы на соответствие заявленным ключевым словам.
Некоторые принципы, относящиеся к метатегам:
- не включайте ключевые слова, которые не содержатся на ваших страницах;
- не повторяйте ключевые слова;
- используйте метатеги по их прямому назначению;
- делайте описание и список ключевых слов различными для каждой страницы
сайта с учетом содержимого.
description
Большинство поисковых серверов отображают содержимое поля description
(пример 1) при выводе результатов поиска.
Если этого тега нет на странице, то поисковый движок просто перечислит первые
встречающиеся слова на странице, которые, как правило, оказываются не очень-то
и в тему.
Пример 1. Использование Description
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>description</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="description" content="Сайт об HTML и создании сайтов">
</head>
<body>
<p>...</p>
</body>
</html>
keywords
Этот метатег был предназначен для описания ключевых слов, встречающихся на
странице (пример 2). Но в результате действия людей, желающих попасть в
верхние строчки поисковых систем любыми средствами, теперь дискредитирован.
Поэтому многие поисковики пропускают этот параметр.
Пример 2. Использование Keywords
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>keywords</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="Keywords" content="HTML, META, метатег, тег, поисковая система">
</head>
<body>
<p>...</p>
</body>
</html>
Ключевые слова можно перечислять через пробел или запятую. Поисковые системы
сами приведут запись к виду, который они используют.
Автозагрузка страниц
Чтобы автоматически загружать новый документ через определенный промежуток
времени используется инструкция http-equiv=»refresh»
(пример 3).
Пример 3. Автозагрузка страницы
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Автозагрузка</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="refresh" content="5; URL=http://www.htmlbook.ru">
</head>
<body>
<p>...</p>
</body>
</html>
Браузер поймет эту запись, как ожидать 5 секунд, а затем загрузить новую страницу,
указанную в параметре URL, в данном случае это переход на сайт htmlbook.ru.
Этот метатег позволяет создавать перенаправление (редирект) на другой сайт.
Если URL не указан, произойдет автоматическое обновление текущей страницы через
количество секунд, заданных в атрибуте content.
Кодировка
Чтобы сообщить браузеру, в какой кодировке находятся символы веб-страницы,
необходимо установить параметр <meta http-equiv=»Content-Type»
content=»text/html; charset=имя кодировки»>. Для операционной системы
Windows и кириллицы charset обычно принимает
значение utf-8 или windows-1251 (пример 4).
Пример 4. Выбор текущей кодировки
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Кодировка</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</head>
<body>
<p>Кириллица</p>
</body>
</html>
Если указание кодировки отсутствует, браузер пытается сам определить, какой
тип символов используется в документе и выбирает необходимую кодировку автоматически.
Браузер не всегда может точно распознать язык веб-страницы и в некоторых случаях
предлагает вьетнамскую кодировку вместо кириллицы. По этой причине лучше всегда
указывать приведенную строчку. Тем не менее, возникают обстоятельства, когда
указание кодировки может принести определенный вред. Например, веб-сервер автоматически
использует перекодирование данных в KOI-8, а браузер, встретив параметр charset=windows-1251,
переводит текст в кодировку Windows. Получается двойное изменение символов,
прочитать такой текст не просто. К счастью, подобная проблема уже отходит в
прошлое, во всяком случае, ее легко можно выявить и нейтрализовать на уровне
сервера.
Отлично! С разметкой контента мы закончили. Снова возвращаемся к тегу <head>
.
Важный тег, который включается в <head>
— тег <meta>
. Он одиночный, то есть не требует парного закрывающего тега в конце.
С помощью <meta>
можно сообщать браузеру, поисковому роботу или другому устройству различную служебную информацию (или метаинформацию) о вашем сайте: кодировку текста, описание контента и так далее. Для этого используются теги <meta>
с разными атрибутами и их значениями. Вот некоторые из атрибутов: charset
, content
, http-equiv
, name
и scheme
.
С помощью атрибута charset
указывается кодировка текста HTML-страницы:
<meta charset="название кодировки">
Лучше всегда указывать кодировку явно. Если этого не делать, браузер может неправильно угадать её, и вместо текста будут отображаться «иероглифы».
Самая распространённая современная кодировка — utf-8
. Используйте её во всех своих проектах. Раньше часто использовали кодировку windows-1251
, стандартную кодировку для кириллицы в Windows. Но сейчас это считается плохой практикой.
<meta>
, <link>
, <title>
и другие теги, включаемые в <head>
, имеют особый тип содержимого — метасодержимое. Они не отображаются на странице напрямую, а служат для хранения информации о документе и для взаимосвязи документа с другими документами и системами.
Great job! We‘ve finished marking up the content. Now, let’s return to the <head>
tag.
Notice inside the <head>
is a <meta>
tag. This is a single tag. In other words, it does not require a paired closing tag at the end.
You can use <meta>
to transmit various metadata (or meta information) to the browser, search engine bot or other device about your site, including the character encoding, content description and so on. To do this, <meta>
tags with various attributes and values are used. Here are some of the attributes: charset
, content
, http-equiv
, name
and scheme
.
You can use the charset
attribute to specify the character encoding for the HTML webpage:
<meta charset="name of character encoding">
It is always best to specify the character encoding explicitly. If you don’t do this, the browser may incorrectly guess it, which will result in a bunch of hieroglyphs being displayed instead of your intended text.
The most widely used encoding in current use is utf-8
. You should use it in all of your projects. Previously the windows-1251
encoding was widely used, as it was the standard encoding for Cyrillic in Windows. However, now this is considered to be bad practice.
<meta>
, <link>
, <title>
and other tags that are included in <head>
contain a special type of content — metadata. This metadata is not displayed on the page directly, but rather it is used to store information about the document and to connect the document to other documents and systems.
Варианты кодировок для meta charset
Добавил(а) microsin
Элемент meta в пределах тега head задает кодировку страницы, отображаемой браузером (charset). Если meta charset не определен, или задан неправильно, то браузер может некорректно отобразить страницу сайта (русские буквы будут напечатаны кракозябрами). Часто используемые кириллические кодировки (с поддержкой русского языка на странице сайта):
windows-1251
utf-8
koi8-r
koi8
iso-8859-5
x-mac-cyrillic
Самой предпочтительной кодировкой сегодня является utf-8, потому что она обеспечивает больше возможностей при оформлении текста. Кодировка windows-1251 встречается довольно часто.
[Ссылки]
1. Character Sets List site:webcheatsheet.com.
Что такое кодировка страницы или «meta charset«, вообще — для чего нужна кодировка страницы — она помогает браузеру правильно отображать содержимое страницы. Где располагается тег кодировки страницы. Как изменить кодировку страницы.
О кодировке вообще и о типах и видах кодировок
Существует огромное количество кодировок, которое нам знать вообще ни к чему. И естественно, что возможны проблемы с кодировкой страницы.
Наверняка вы видели, когда заходили на какую-то страницу сайта, то на ней были непонятные символы, из которых ничего невозможно было понять — в народе обзываемые «кракозябрами.»
+ Встроенная и наружная кодировка..
У физически существующего файла может быть и «Встроенная и наружная кодировка».
О внутренней, как-то мы говорили на примере — txt файла. И аналогично может быть и с файлами html.хзъ
И наружная кодировка с помощью тега meta:
<meta charset=»UTF-8″>
Нажимаем по странице ctrl+U и видим нашу кодировку в самом верху страницы:
Типы и виды кодировок
Нас конечно же прежде всего интересуют кодировки, которые завязаны на русском языке.
1.
«utf-8» – это универсальная кодировка.
2.
«windows-1251» – это кириллица.
И тут конечно же я должен сказать о собственном опыте, которому уже намечается 10 лет… так вот!
В самом начале, когда я только начинал, я начинал с кодировки «windows-1251», но с этой кодировкой, постоянно возникали какие-то проблемы, сейчас уже вспомнить будет трудно, но в конце концов, я перешел на «utf-8»
Что означает обозначение utf-8
И конечно же нам требуется пару строк написать о том, что же означает эта самая кодировка «utf-8» :
И конечно же нам требуется пару строк написать о том, что же означает эта самая кодировка «utf-8» :
UTF-8 (от англ. Unicode Transformation Format, 8-bit — «формат преобразования Юникода, 8-бит») — распространённый стандарт кодирования текста, позволяющий более компактно хранить и передавать символы Юникода, используя переменное количество байт (от 1 до 4), и обеспечивающий полную обратную совместимость с 7-битной кодировкой ASCII.
Я думаю, что дальше нет никакого смысла углубляться…
Нам в принципе нужно, чтобы наши данные отображались на станице корректно…
Как определить кодировку страницы?
В открытом браузере нажимаем сочетание кнопок ctrl + U.
Должна открыться дополнительная страница с кодом!
Где находится кодировка страницу?
Обычно кодировку ставят на странице в самом начале, вот пример кодировки, здесь кодировка страницы стоит на 4 строке. И имеет вид:
<meta http-equiv=»Content-Type» content=»text/html; charset=utf-8″/>
Что означает, что страница сделана в кодировке utf-8.
Это – одна из самых распространённых кодировок.
Либо кириллическая кодировка:
<meta charset=»windows-1251″>
Как изменить кодировку страницы html
Если это простая – физическая(файл) — стандартная страница html, то вам просто её нужно открыть в каком-то редакторе и заменить кодировку на ту, которая вам требуется!
Как изменить кодировку страниц, если у вас движок!? В каждом движке есть определенная логика. Как в любом скрипте. Как у обычной страницы у движка есть блоки, из которых он собирает эти страницы – вам просто нужно найти тот блок, который и выводит вашу кодировку в браузер…
Пример неправильной кодировки.
Иногда данная кодировка вызывает разные проблемы…
К примеру некоторые хостинги, просто не поддерживают данную кодировку.
Вот так будет выглядеть страница с нарушенной кодировкой.
Почему на странице появляются кракозябры!?
На самом деле есть несколько причин для возникновения так называемых кракозябр!
1.
Неправильная кодировка страницы, ну к примеру, если вы установите кодировку китайскую, а напишите кириллический текст, то что должно произойти!? Браузер просто сойдет с ума не зная, что вам показать и покажет кракозябры.
2.
Неправильная настройка браузера. Либо браузер не может автоматически найти эту строку на странице, которая указывает на кодировку страницы.
3.
Сервер не поддерживает данную кодировку!
Как изменить неправильную кодировку!?
Кодировки на странице можно найти в нескольких местах:
1). Изменение кодировки страниц в тегах «meta»
Если идет речь о вашей странице на вашем сайте, то нужно открыть вашу страницу в блокноте и изменить кодировку страницы. Если сайт на движке, то нужно найти основную страницу, в которой прописана кодировка и изменить её на соответствующую!
Кодировка страницы прописывается в тегах «meta»
Пример:
У меня, естественно, самописный движок, поэтому, мы открываем основную страницу, которая отвечает за всё и там есть кодировка страницы :
2.
Если браузер неправильно трактует кодировку. То нужно разбираться с браузером.
3.
Если это проблема сервера, то стоит попробовать внести изменения в файл — .htaccess внеся в него такую надпись:
Если это не помогает, то придется поглубже окунуться в эту тему! Если у вас хорошая поддержка на хостинге, как например тот, что у меня! И если я в тупике, то частенько они меня выручали !