Содержание

Content-Type — Веб-технологии для разработчиков

Заголовок-сущность Content-Type используется для того, чтобы определить MIME тип ресурса.

В ответах сервера заголовок Content-Type сообщает клиенту, какой будет тип передаваемого контента. В некоторых случаях браузеры пытаются сами определить MIME тип передаваемого контента, но их реакция может быть неадекватной. Чтобы предотвратить такие ситуации, Вы можете установить в заголовке X-Content-Type-Options значение nosniff.

В запросах (таких, как POST или PUT), клиент сообщает серверу тип отправляемых данных.

Синтаксис

Content-Type: text/html; charset=utf-8
Content-Type: multipart/form-data; boundary=something

Директивы

media-type
MIME тип ресурса или данных.
charset
Используемая кодировка.
boundary
Директива boundary обязательна для составных сущностей. Она содержит от 1 до 70 символов (не должна заканчиваться пробелом), которые без искажений пройдут через шлюзы email и служит для корректной инкапсуляции всех частей составной сущности.

Примеры

Content-Type в HTML формах

В POST запросе, сгенерированном в результате отправки HTML формы, Content-Type запроса определяется в атрибуте enctype тега <form>.

<form action="/" method="post" enctype="multipart/form-data">
  <input type="text" name="description" value="some text">
  <input type="file" name="myFile">
  <button type="submit">Submit</button>
</form>

Запрос в этом случае может выглядеть так (менее интересные заголовки опущены):

POST /foo HTTP/1.1
Content-Length: 68137
Content-Type: multipart/form-data; boundary=---------------------------974767299852498929531610575

-----------------------------974767299852498929531610575
Content-Disposition: form-data; name="description" 

some text
-----------------------------974767299852498929531610575
Content-Disposition: form-data; name="myFile"; filename="foo.txt" 
Content-Type: text/plain 

(content of the uploaded file foo.txt)
-----------------------------974767299852498929531610575--

Спецификации

Совместимость с браузерами

The compatibility table in this page is generated from structured data. If you’d like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

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

Какие бывают META теги и зачем они нужны / Хабр

META-теги


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

META-теги имеют два возможных атрибута




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

Стандартом HTML 4.01 значения и имена мета-тегов

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

 Пруфлинк: http://www.w3.org/TR/html401/struct/global.html#h-7.4.4.1
(The META element can be used to identify properties of a document (e.g., author, expiration date, a list of key words, etc.) and assign values to those properties. This specification does not define a normative set of properties.)

 

Атрибут HTTP-EQUIV


META-теги с атрибутом HTTP-EQUIV эквивалентны HTTP-заголовкам. Обычно они управляют действиями броузеров и могут быть использованы для совершенствования информации, выдаваемой обычными заголовками. Теги такой формы могут дать такой же эффект, что и HTTP-заголовки, и на некоторых серверах автоматически могут быть переведены в настоящие HTTP-заголовки.
Некоторые генерируемые сервером поля заголовков не могут быть подменены значениями из META-тегов (в частности Date), другие подменяются только при ненормальном статус-коде (200). Когда заголовок не понятен, то значение HTTP-заголовка превалирует над значением META-тегов.
 
Значения  поля content  для Аттрибута   HTTP-EQUIV

Значение Описание Пример использования Эффект
Expires
Дата устаревания. Управление кэшированием в HTTP/1.0. Если указанная дата прошла, то очередной запрос этого документа вызывает повторный сетевой запрос, а не подгрузку документа из кэша. Дата со значением «0» интерпретируется как «сейчас». Такое значение заставляет броузер каждый раз при запросе проверять — изменялся ли этот документ. Это, кстати относится и к прокси-агентам.
Дата должна быть задана в формате, описываемом в RFC850,
<META HTTP-EQUIV=»expires» CONTENT=»Wed, 26 Feb 2008 08:21:57 GMT»>
что эквивалентно HTTP-заголовку
Expires: Wed, 26 Feb 2008 08:21:57 GMT
Поисковые роботы могут либо совсем не индексировать такой документ, либо постоянно «обнюхивать» его.
Pragma Эта директива показывает, что кешированная информация не должна использоваться и вместо этого запросы должны посылаться на сервер. Это директива имеет тоже самое значение что и CACHE-CONTROL:NO-CACHE и представлена для обратной совместимости с HTTP/1.0.

Клиенты должны использовать оба значения PRAGMA:NO-CACHE и CACHE-CONTROL:NO-CACHE когда нужно послать некешируемый запрос к серверу, про который неизвестно – совместим ли он с HTTP/1.1.
Если известно, что сервер совместим с
HTTP/1.1 клиент НЕ должен посылать PRAGMA заголовок.
 HTTP/1.1 кэш должен понимать «PRAGMA:NO-CACHE» точно также, как будто клиент послал «CACHE-CONTROL:NO-CACHE».

<META HTTP-EQUIV=»PRAGMA» CONTENT=»NO-CACHE»>  
Content-Type Указание типа документа. Может быть расширено указанием кодировки страницы (charset). Если же указывать charset в содержании META-тега, то некоторые браузеры выводят такую страницу уже в заданном charset. <META HTTP-EQUIV=»Content-type» CONTENT=»text/html; charset=ISO-2022-JP»>  Используют браузеры и поисковые системы
Content-language Указание языка документа. Может использоваться поисковыми машинами при индексировании страниц. Комбинация поля Accept-Language (посылаемого броузером) с содержимым Content-language может быть условием выбора сервером того или иного языка. <META HTTP-EQUIV=»Content-language» CONTENT=»en-GB»>
что эквивалентно HTTP-заголовку 
Язык описывается парой значений (язык-диалект). В примере: Английский-Великобритания
Для русского языка – ru-RU
Используется некоторыми поисковиками
Refresh Определение задержки в секундах, после которой броузер автоматически обновляет документ. Дополнительная возможность — автоматическая загрузка другого документа. <META HTTP-EQUIV=»Refresh» Content=»3, URL=http://www.name.com/page.html»>
что эквивалентно HTTP-заголовку
Refresh: 3; URL=http://www.name.com/page.html
W3C не рекомендует использовать этот тег.
Google страницы с таким тегом игнорирует. Другие поисковые системы, возможно, тоже.
Cache-Control Определяет действия кэша по отношению к данному документу. Возможные значения:
Public — документ кэшируется в доступных для всех кэшах
Private — только в частном кэше
no-cache — не может быть кэширован
no-store — может быть кэширован, но не сохраняется
<META http-equiv=»Cache-Control» content=»public»> Используется некоторыми браузерами

Атрибут NAME


Robots
Тег <meta name=»Robots» content=»…»> управляет индексацией конкретной web-страницы. При этом роботам можно запретить не только индексацию самого документа, но и проход по имеющимся в нем ссылкам.
Инструкции по индексации записываются в поле content. Возможны следующие инструкции:
NOINDEX — запрещает индексирование документа;
NOFOLLOW — запрещает проход по ссылкам, имеющимся в документе;
INDEX — разрешает индексирование документа;
FOLLOW — разрешает проход по ссылкам.
ALL — равносильно INDEX, FOLLOW
NONE — равносильно NOINDEX, NOFOLLOW
Значение по умолчанию: <meta name=»Robots» content=»INDEX, FOLLOW»>.
В следующем примере робот может индексировать документ, но не должен выделять из него ссылки для поиска дальнейших документов:
<META name=»ROBOTS» content=»index, nofollow»>
Имя тега, названия и значения полей нечувствительны к регистру.
В поле content дублирование инструкций, наличие противоречивых инструкций и т.п. не допускается; в частности, значение поле content не может иметь вид «none, nofollow».
Google поддерживает дополнительное значение NOARCHIVE, которое запрещает помещать страницу в архив google
<META NAME=»Robots» CONTENT=»NOINDEX,FOLLOW»> Используется большинством поисковиков
Description Значение атрибута CONTENT — строка, которая определяет текстовое описание (краткую аннотацию) конкретной страницы Вашего сайта. Не стоит создавать слишком длинное и подробное описание Вашего сайта в данном теге, рекомендуется ограничиться текстом до 100 символов, поскольку поисковые машины, в большинстве случаев, имеют ограничение на количество индексируемых символов. Этот тег может сильно помочь в случаях, когда в документе мало текста, когда это управляющий фреймами файл (frameset) или в начале документа используются скрипты. <META NAME=»description» CONTENT=»Данный сайт содержит информацию для любителей старинных автомобилей, на нем Вы можете найти описание с фотографиями редких и эксклюзивных автомобилей»> Самый широко используемый тег. Практически все поисковые системы учитывают его при индексации.
Значение этого тега очень важно для раскрутки сайта, практически все поисковые системы опираются на этот
 тег, а некоторые выводят содержимое этого тега в результатах поиска (Google), поэтому желательно не просто указывать краткое описание документа, но сделать его содержание привлекательным рекламным сообщением.
Keywords Значение атрибута CONTENT — список ключевых слов, как правило, через запятую, соответствующих содержимому Вашего сайта. Это те слова, в запрос на которые, Вы хотели бы, появления Вашего сайиа в списке результатов поиска. Здесь также рекомендуется ограничиться списком до 30 слов. Можно поместить и наиболее частые опечатки ключевых слов. Также Вы можете здесь записать и английские слова, соответствующие содержимому Вашего сайта. Ну, а какие конкретно нужно писать слова — это уже тема отдельной статьи. Некоторые поисковые системы не индексируют сайты, в которых в данном теге повторяется одно и то же слово для увеличения позиции в списке результатов. <META NAME=»keywords» CONTENT=»реклама, дизайн, полиграфия»> Учитывается большинством поисковых систем. Точно известно, что НЕ учитывает  Google и Rambler
document-state Управление индексацией страницы для поисковых роботов. Определяет частоту индексации — или один раз индексировать (значение Static), или реиндексировать документ регулярно (значение Dynamic). <META NAME=»Document-state» CONTENT=»Static»> Используется редко
GOOGLEBOT Google поддерживает специальный тег Googlebot с помощью которого вы можете указать Google что он не должен индексировать и архивировать вашу страницу, другие поисковые системы этот тег проигнорируют. <META NAME=»GOOGLEBOT» CONTENT=»NOARCHIVE»>  
Author Автор, создатель сайта. Вряд ли используется поисковыми системами, и нужен скорее всего чтобы можно было показать что сайт сделан именно определенной персоной или фирмой. <META NAME=»AUTHOR» CONTENT=»www.neo-systems.ru»>  
Revisit Значение этого тега указывает — как часто обновляется информация на вашем сайте, и как часто поисковая система должна на него заходить чтобы увидеть обновления. В силу сложившихся условий — поисковые системы сейчас самостоятельно определяют частоту сканирования сайта, поэтому, возможно, наличие этого тега ничего вам не даст. <meta name=»revisit-after» content=»15 days»>  

 

Источники информации:


http://www.citforum.ru/internet/search/metatags.shtml
http://web-support.ru/adv/ps_meta_2.shtml
http://www.shtogrin.com/library/web/meta/
http://vancouver-webpages.com/META/metatags.detail.html
http://www.mattcutts.com/blog/keywords-meta-tag-in-web-search/
http://www.webotdel.ru/notes/metatags/
Очень хорошо и понятно написано http://www.w3schools.com/tags/tag_meta.asp
Какие мета-теги понимает Google  http://www.google.com/support/webmasters/bin/answer.py?answer=79812
Какие мета-теги понимает Bing
http://www.bing.com/community/blogs/webmaster/archive/2009/07/18/head-s-up-on-lt-head-gt-tag-optimization-sem-101.aspx
Google  не использует мета-тег keywords
http://googlewebmastercentral.blogspot.com/2009/09/google-does-not-use-keywords-meta-tag.html
 

Meta теги. Учебник html

Глава 10

В первой главе этого учебника, об общем построении html документа, я говорил о том, что все html документы должны иметь вот такой шаблон кода:

<html> — начало документа
<head> — начало головы
</head> — закрытие головы
<body> — начало тела
</body> — закрытие тела
</html> — конец документа

Где между тегами <body> </body> указывается информация предназначенная для вывода на экран в нужном нам виде, а между тегами <head> </head> исключительно служебная информация предназначенная для поисковых систем и браузеров тех или иных пользователей. Так что же это за информация такая и для чего она нужна? Отвечу, планомерно и порционально в этой главе.

С тегом <title> мы уже знакомы, с помощью него мы указываем имя документа в заголовке страницы. Теперь новый тег <meta> (закрывающего тега не требует) с помощью него мы и будем указывать эту самую служебную информацию на нашей страничке.

<meta> тег имеет следующие атрибуты:
  • http-equiv — указывает браузеру как следует обработать основное содержание документа, точнее на основе каких данных.
  • name — информационное имя. (применяется в паре с атрибутом content)
  • content — информационное содержание, связанное с мета именем (name)

Теперь на примерах будем вникать в суть дела.

Пример (очень нужный и важный):

<meta http-equiv=»Content-Type» Content=»text/html; Charset=Windows-1251″>

Сначала расскажу зачем необходима эта строка в заголовке html документа. Данная запись указывает браузеру кодировку в которой была написана данная страница — формат документа и раскладку клавиатуры, в данном случае это кириллица для Windows. Если эту строку не писать в заголовке страницы, то есть большая вероятность что весь текст на Вашей странице отобразится в виде непонятных человеку «иероглифов» у разных пользователей тех или иных браузеров. Конечно, пользователь может применить к такому документу команду в браузере Вид->Кодировка->Кириллица, но он может не знать о данной функции, да и зачем утруждать человека данным действием.

Теперь разберём по «слогам» нашу запись:
<meta http-equiv=»Content-Type» — указываем что в этом мета теге мы будем заниматься Content-Type — типом содержания
Content=»text/html; — а именно его текстом
Charset=Windows-1251″> — документ для Windows — Кириллица где 1251 кодировка раскладки клавиатуры, так например Английская клавиатура будет задаваться Charset=Windows-1252

В настоящее время продвинутые веб-мастера рекомендуют использовать кодировку UTF 8

То есть писать в голове документа вот так:

<meta http-equiv=»Content-Type» content=»text/html; charset=utf-8″>

Пример:

<meta http-equiv=»Content-Language» Content=»ru»>

В этой строчке говорится о том что язык Language документа является русским Content=»ru»

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

Пример:

<meta name=»author» Content=»Остап Бендер»>
<meta name=»copyright» Content=»»Рога и копыта» Остап Бендер»>

Данные метаописатели предназначены для заявления об авторских правах непосредственно в заголовке html кода, так name=»author» указывает имя автора страницы, а name=»copyright» авторское право (копирайт) в котором может указываться фамилия, имя, отчество автора сайта, название фирмы, бренда.. и т. д. Кроме того включив в заголовок документа такое описание Вы значительно упростите задачу поисковой машине при поиске Вашего сайта по имени автора, названию фирмы, бренду…

Пример:

<meta name =»Generator» Content=»Microsoft Notepad»>

Если хотите можете указать с помощью какого html редактора была написана данная страница.

Пример:

<meta name=»description» Content=»Производим закупку по выгодным ценам рогов и копыт!»>

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

Пример:

<meta name=»keywords» Content =»рога, копыта, рожки, рог, копыто, копытце, закупка, покупка, приобретение, выгодно, продать, купить, сбыть, реализовать, корова, бык, коровьи, бычьи, оплата, деньги, наличные, цена, цене»>

Keywords — ключевые слова веб-страницы, опять таки предназначены для поисковых машин.

Представьте что Вы ищете в какой либо поисковой системе сайт с информацией о том где можно продать те же рога и копыта 🙂 Какие слова и фразы Вы будите вводить в строке «Поиск»? ну наверно что то типа: «Где продать коровьи рога?» или «Реализовать копыта по выгодной цене» Так вот если определить ключевые слова и так сказать предугадать мысли потенциального посетителя можно надеяться на то, что та или иная поисковая система выдаст ссылку на Ваш сайт в первых строчках результата поиска. Конечно ввод данного метоописателя не есть гарант того что именно Ваш сайт займет первые места в поиске по данным словам, но всё же не стоит им пренебрегать. Впрочем, оптимизация и раскрутка сайта это отдельная тема для разговора.

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

Пример:

<meta name=»Publisher-Email» Content=»Ваш_e-mail@сервер.домен»>
<meta name=»Publisher-URL» Content=»http://www.Ваш_сайт/»>

Думаю понятно.. здесь указывается адрес Вашего почтового ящика Publisher-Email и адрес сайта Publisher-URL

Пример:

<meta name =»revisit-after» Content=»15 days»>

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

Пример:

<meta http-equiv=»expires» content=»Sun, 24 jan 2010 12:28:36 GMT+03:00″>

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

Для того чтобы принудительно заставить браузер загружать ту или иную страницу не с жёсткого диска, а с сервера необходим мета тег с данным синтаксисом, где указывается день недели, число месяц год время (чч:мм:сс) и часовой пояс(GMT+03:00 — время Московское + три часа). День недели и время дня можно не указывать. Теперь при чтении страницы браузером страница будет грузится с сервера, если указанная дата и время настало или просрочено, и напротив из кэша если указанное время еще не наступило.

Ниже на всякий случай приведены таблицы сокращений от Английских слов на месяцы и дни недели

Месяцы:От Английского:Сокращения:
ЯнварьJanuaryJan
ФевральFebruaryFeb
МартMarchMar
АпрельAprilApr
МайMayMay
ИюньJuneJun
ИюльJulyJul
АвгустAugustAug
СентябрьSeptemberSep
ОктябрьOctoberOct
НоябрьNovemberNov
ДекабрьDecemberDec
Дни недели:От Английского:Сокращения:
ПонедельникMondayMon
ВторникTuesdayTue
СредаWednesdayWed
ЧетвергThursdayThu
ПятницаFridayFri
СубботаSaturdaySat
ВоскресеньеSundaySun

Атрибуту content можно присвоить значение «0» <meta http-equiv=»Expires» content=»0″> в этом случае страница всегда будет загружаться с сервера.

И еще.. некоторые поисковые роботы могут отказаться индексировать документ с заведомо устаревшей датой. — не искушайте судьбу..

Пример:

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

А такая запись вовсе запретит браузеру кэшировать данную страницу.

Пример:

<meta name=»robots» content=»Index,follow»>

Данный мета тег предназначен для подачи поисковому роботу той или иной команды.

Список возможных команд роботу:

  • Index — индексировать страницу
  • Noindex — не индексировать страницу
  • Follow — прослеживать гиперссылки на странице
  • Nofollow — не прослеживать гиперссылки на странице
  • All — индексировать страницу и прослеживать гиперссылки на странице (по умолчанию)
  • None — не индексировать страницу и не прослеживать гиперссылки на странице

Пример:

<meta http-equiv=»Refresh» content=»10; URL=http://www.mysite/index.html»>

Если вдруг по каким либо причинам Вы задумаете поменять URL адрес Вашего сайта то хорошо было бы на старом месте оставить страницу вроде этой:

<html>
<head>
<meta http-equiv=»Content-Type» Content=»text/html; Charset=Windows-1251″>
<meta http-equiv=»Refresh» content=»10; URL=http://www.mysite/index.html»>
<title>Переадресация</title>
</head>
<body>
<font size=»+1″>
Адрес сайта был изменен, через 10 секунд Ваш браузер будет автоматически перенаправлен по новому адресу:<br>
<a href=»http://www.mysite.ru/index.html»><b>http://www.mysite.ru/</b></a><br>
Нажмите <a href=»http://www.mysite.ru/index.html»>здесь</a> для того чтобы выполнить переход немедленно.<br>
Приносим извинения за доставленные неудобства.
</font>
</body>
</html>

Разберём и осмыслим строчку из примера:

<meta http-equiv=»Refresh» content=»10; URL=http://www.mysite/index.html»>

meta http-equiv=»Refresh» — Refresh (восстановление) указывает браузеру что данную страницу необходимо обновить
content=»10; — обновить через заданное количество секунд (в нашем случае десять)
URL=http://www.mysite/index.html»— адрес новой/другой страницы на которую следует перейти.

Пример:

<meta http-equiv=»Refresh» content=»30″>

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

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

Пример:

<meta http-equiv =»Page-Enter» Content=»RevealTrans(Duration=1.0, Transition=0)»>
<meta http-equiv =»Page- Exit » Content=»RevealTrans(Duration=3.0, Transition=23)»>

Данные заголовки создают визуальные эффекты при переходе с одной страницы на другую.

  • Page-Enter — Эффект появления страницы
  • Page- Exit — Эффект исчезновения страницы

В которых:

  • Duration — время действия эффекта в секундах
  • Transition — Один из номеров предлагаемых эффектов (от 0 до 23) перечисленных в таблице:
НомерОписание эффектаНомерОписание эффекта
0Прямоугольники внутрь12Растворение
1Прямоугольники наружу13Вертикальная панорама внутрь
2Круг внутрь14Вертикальная панорама наружу
3Круг наружу15Горизонтальная панорама внутрь
4Наплыв наверх16Горизонтальная панорама наружу
5Наплыв вниз17Уголки влево — вниз
6Наплыв вправо18Уголки влево — вверх
7Наплыв влево19Уголки вправо – вниз
8Вертикальные жалюзи20Уголки вправо – вверх
9Горизонтальные жалюзи21Случайные горизонтальные полосы
10Шажки горизонтальные22Случайные вертикальные полосы
11Шажки вертикальные23Случайный выбор эффекта

Пример:

Файл page1.html

<html>
<head>
<meta http-equiv=»Content-Type» Content=»text/html; Charset=Windows-1251″>
<meta http-equiv =»Page-Enter» Content=»RevealTrans(Duration=1.0, Transition=12)»>
<title>Эффекты перехода страниц</title>
</head>
<body bgcolor=»#c5ffa0″>
<center>
<h3>На заметку:</h3>
<font size=»+1″>Эффекты перехода с одной страницы на другую работают не во всех браузерах.</font><hr><br>
<font size=»+1″>Нажмите на «Перейти» чтобы перейти к следующей странице<br>
и оценить эффект перехода от одной странице к другой.</font><br><br>
<a href=»page2.html»><font size=»+2″>»Перейти»</font></a>
</center>
</body>
</html>


Файл page2.html

<html>
<head>
<meta http-equiv=»Content-Type» Content=»text/html; Charset=Windows-1251″>
<meta http-equiv =»Page-Enter» Content=»RevealTrans(Duration=2.0, Transition=23)»>
<title>Эффекты перехода страниц</title>
</head>
<body bgcolor=»#c0e4ff»>
<center>
<h3>На заметку:</h3>
<font size=»+1″>Эффекты открытия и закрытия веб-страниц будут видны только при переходе <br>
от одной страницы к другой или же при помощи кнопок «назад» «вперёд». <br>
При первом открыти страницы, а также во время перезагрузки<br>
эффекты перехода видны не будут.</font><hr><br>
<font size=»+1″>Нажмите на «Перейти» чтобы перейти к следующей странице<br>
и оценить эффект перехода от одной странице к другой.</font><br><br>
<a href=»page1.html»><font size=»+2″>»Перейти»</font></a>
</center>
</body>
</html>

  • Ещё раз напомню о том что мета теги стоит применять умело и грамотно особенно это касается команд для робота и кодировки символов, иначе весь Ваш труд может пойти насмарку..

  • Заголовок Refresh (автоматический переход на другую страницу) можно использовать не совсем стандартно.. Некоторые авторы используют его для создания своего рода «презентации» слайд шоу, где сменяющиеся страницы и есть кадры презентации. Представьте заходит человек на такой сайт а тут ему «Откинетесь на спинку кресла и расслабьтесь..»:) а далее сами по себе пошли картинки, графики, тексты.. а последняя страница тупиковая где пользователь берёт сайт «в свои руки» или же может замыкаться на первую. Только всегда помните о золотом правиле веб-мастера: Главное не переборщить!



описание(description), ключевые слова(keywords), заголовок(title) и другие мета-теги



Мета-теги — это необязательные атрибуты, размещенные в заголовке страницы, между тегами <head> и </head>, которые никак не отображаются браузером (за исключением содержимого тега <title>). Мета-теги могут содержать описание html-страницы, ключевые слова к ней, информацию об авторе, управляющие команды для браузера и поисковых роботов, а также прочую служебную информацию, не предназначенную для посетителей. Мета-теги для сайта играют очень важную роль. Их добавление в html-документ могут существенно помочь сайту в его жизни.

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

Функции мета-тегов

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

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

Группы метатегов

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

Элемент meta принимает следующие атрибуты: content, http-equiv, name, charset и scheme.
АтрибутОписание
NameИмя метатега, также косвенно устанавливает его предназначение. Примеры: include, keywords, description, author, revised, generator и др.
contentУстанавливает значение атрибута, заданного с помощью name или http-equiv.
scheme (устарел)Указывает полезную информацию о схеме или название самой схемы, которая должна быть использована для интерпретации значения свойства (то есть значения атрибута «content»). Не применяется в HTML5.
charsetНовый атрибут, показывает кодировку документа в HTML5. Пример: <meta charset=»utf-8″>
http-equivФормирует заголовок страницы и определяет его обработку. Как правило, управляет действиями браузеров и используется для формирования информации, выдаваемой обычными заголовками. Например HTTP-EQUIV может использоваться для управления кэшированием, обновлением страницы, автоматической загрузки другой страницы.

Группа значений атрибута NAME

«keywords» (ключевые слова)

Keywords поисковые системы используют для того, чтобы определить релевантность страницы тому или иному запросу. При формировании данного значения необходимо использовать только те слова, которые обязательно встречаются в самом документе. Использование тех слов, которых нет на странице, не рекомендуется. Ключевые слова нужно добавлять по одному, через запятую, в единственном числе. Рекомендованное количество слов в «keywords» — не более десяти. Кроме того, выявлено, что разбивка этого значения на несколько строк влияет на оценку ссылки поисковыми машинами. Некоторые поисковые системы не индексируют сайты, в которых в значении «keywords» повторяется одно и то же слово для увеличения позиции в списке результатов.

Если раньше «keywords» имел определённую роль в ранжировании сайта, то в последнее время поисковые системы относятся к нему нейтрально.

HTML-код с «keywords»:

<!DOCTYPE html>
<html>
 <head>
  <title>keywords</title>
  <meta name="keywords" content="HTML,CSS,PHP,JavaScript"> 
 </head> 
 <body>Основное содержимое страницы</body>
</html>

«description» (описание страницы)

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

Таким образом, правильный description обязательно должен содержать ключевое слово, коротко и точно описывать то, о чём данная веб-страница. «Description» вместе с «title» образуют очень важную пару значений, от которых зависит то, перейдёт пользователь из поисковой выдачи на веб-страницу или нет! Поэтому «description» и «title» нужно прописывать для каждой веб-страницы!

HTML-код с «description»:

<!DOCTYPE html>
<html>
 <head>
  <title>description</title>
   <meta name="description" content="Сайт об HTML и CSS"> 
   <meta name="keywords" content="HTML,CSS,PHP,JavaScript">
 </head> 
 <body>Основное содержимое страницы</body>
</html>

«Author» и «Copyright»

Эти значения, как правило, не используются одновременно. Функция author и copyright — идентификация автора или принадлежности контента на странице. «Author» содержит имя автора веб-страницы, но в случае, если веб-сайт принадлежит какой-либо организации, целесообразнее использовать значение «Copyright».

HTML-код с «author»:

<!DOCTYPE html>
<html>
 <head>
  <title>Примеры применения метатегов</title>
  <meta name="author" content="Maxim White">
  <meta name="keywords" content="HTML, Meta Tags, Metadata">  
  <meta name="description" content="Сайт об HTML и CSS"> 
 </head> 
 <body>Основное содержимое страницы</body>
</html>

«Robots»

Robots — формирует информацию о гипертекстовых документах, которая поступает к роботам поисковых систем.

У «robots» могут быть следующие значения:

  • index — страница должна быть проиндексирована;
  • noindex — страница не индексируется;
  • follow — гиперссылки на странице учитываются;
  • nofollow — гиперссылки на странице не учитываются
  • all — включает значения index и follow, включен по умолчанию;
  • none — включает значения noindex и nofollow.

HTML-код с «robots»:

<!DOCTYPE html>
<html>
 <head>
  <title>Примеры применения метатегов</title>
  <meta name="robots" content="noindex, nofollow">
  <meta name="keywords" content="HTML, Meta Tags, Metadata">
  <meta name="author" content="Maxim White">
  <meta name="description" content="Сайт об HTML и CSS"> 
 </head> 
 <body>Основное содержимое страницы</body>
</html>

Группа значений атрибута HTTP-EQUIV

«Content-Type»

Content-Type определяет тип документа и его кодировку.

HTML-код с «Content-Type»:

<!DOCTYPE html>
<html>
 <head>
  <title>Примеры применения метатегов</title>  
  <meta name="keywords" content="HTML, Meta Tags, Metadata">  
  <meta name="description" content="Сайт об HTML и CSS">
  <meta name="author" content="Maxim White">
  <meta name="robots" content="noindex, nofollow">
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
 </head> 
 <body>Основное содержимое страницы</body>
</html>

В HTML5 указание кодировки упрощено:

<meta charset="UTF-8">

«refresh»

Refresh — задержка времени (в секундах) перед тем, как браузер обновит страницу. Кроме того, может использоваться автоматическая загрузка другой html-страницы с заданным адресом (url).

HTML-код с «refresh»:

<!DOCTYPE html>
<html>
 <head>
  <title>Автозагрузка</title>  
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta http-equiv="refresh" content="5; URL=http://www.wm-school.ru">
 </head> 
 <body>Основное содержимое страницы</body>
</html>

Браузер поймет эту запись, как через 5 секунд загрузить новую страницу, указанную в параметре URL, в данном случае это переход на сайт wm-school.ru. Значение «refresh» позволяет создавать перенаправление (редирект) на другой сайт. Если URL не указан, произойдет автоматическое обновление текущей страницы через количество секунд, заданных в атрибуте content.

Обратите внимание, что кавычки в указании URL-адреса перед http не ставятся.

«Content-Language»

Content-Language указывает язык документа. Может использоваться поисковыми машинами при индексировании страниц. Комбинация поля Accept-Language (посылаемого браузером) с содержимым Content-language может быть условием выбора сервером того или иного языка.

HTML-код с «content-language»:

<!DOCTYPE html>
<html>
 <head>
  <title>Язык документа</title>  
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta http-equiv="refresh" content="5; URL=http://www.wm-school.ru">
  <meta http-equiv="content-language" content="ru">
 </head> 
 <body>Основное содержимое страницы</body>
</html>

В HTML5 указание языка упрощено:

<html lang="ru">

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

Пример HTML:

Попробуй сам
<!DOCTYPE html>
<html>
 <head>
  <title>Заголовок страницы</title>  
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta name="keywords" content="HTML, Meta Tags, метаданные">
  <meta name="description" content="Сайт об HTML и CSS">
 </head> 
 <body>Основное содержимое страницы</body>
</html>

Задачи


Итоговое задание [10-14]

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

Пришло время повторить изученное и выполнить четыре несложных задания:

Ключевые слова

С помощью одинарного тега <meta> задайте ключевые слова: «HTML,CSS,JavaScript» для текущей веб-страницы.

<!DOCTYPE html>
<html>
 <head>
  <meta>
  <title>Ключевые слова</title>  
 </head>
 <body>
  <p>Метатеги (англ. meta tags) — предназначены для предоставления структурированных метаданных о веб-странице.</p>
 </body>
</html>
<!DOCTYPE html>
<html>
 <head>
  <meta name="keywords" content="HTML,CSS,JavaScript">
 <title>Ключевые слова</title>  
 </head>
 <body>
  <p>Метатеги (англ. meta tags) — предназначены для предоставления структурированных метаданных о веб-странице.</p>
 </body>
</html>

Индексация веб-страницы

С помощью одинарного тега <meta> разрешите индексацию Web-страницы поисковыми машинами, а переход по ссылкам запретите.

<!DOCTYPE html>
<html>
 <head>
  <meta>
  <title>Индексация и переход по ссылкам</title>  
 </head>
 <body>
  <p>Тег meta позволяет запретить или разрешить индексацию Web-страницы поисковыми машинами.</p>
 </body>
</html>
<!DOCTYPE html>
<html>
 <head>
  <meta name="robots" content="index, nofollow">
  <title>Индексация и переход по ссылкам</title>  
 </head>
 <body>
  <p>Тег meta позволяет запретить или разрешить индексацию Web-страницы поисковыми машинами.</p>
 </body>
</html>

Автоматическая перезагрузка страницы

С помощью одинарного тега meta назначте автоматическую перезагрузку текущей веб-страницы через 30 сек.

<!DOCTYPE html>
<html>
 <head>
  <meta>
  <title>Автоматическая перезагрузка страницы</title>  
 </head>
 <body>
  <p>Тег meta позволяет автоматически перезагружать страницу через заданный промежуток времени.</p>
 </body>
</html>
<!DOCTYPE html>
<html>
 <head>
  <meta http-equiv="refresh" content="30">
  <title>Автоматическая перезагрузка страницы</title>  
 </head>
 <body>
  <p>Тег meta позволяет автоматически перезагружать страницу через заданный промежуток времени.</p>
 </body>
</html>

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

Сделайте так, чтобы через 5 сек после загрузки страницы браузер перешел на адрес http://www.wm-school.ru.

<!DOCTYPE html>
<html>
 <head>
  <meta>
  <title>Автозагрузка новой страницы</title>  
 </head>
 <body>
  <p>В данном случае через 5 сек после загрузки страницы браузер перейдет на адрес http://www.wm-school.ru.</p>
 </body>
</html>
<!DOCTYPE html>
<html>
 <head>
  <meta http-equiv="refresh" content="5; URL=http://www.wm-school.ru">
  <title>Автозагрузка новой страницы</title>  
 </head>
 <body>
  <p>В данном случае через 5 сек после загрузки страницы браузер перейдет на адрес http://www.wm-school.ru.</p>
 </body>
</html>





Атрибут http-equiv тега | HTML справочник

HTML тег <meta>

Значение и применение

Атрибут http-equiv (HTML тега <meta>) фактически эквивалентен гипертекстовому заголовку (имитация http-заголовка), формируют заголовок страницы и определяют его обработку. Как правило, они управляют действиями браузеров и используются для формирования информации, выдаваемой обычными http-заголовками. Название заголовка указывается в атрибуте http-equiv, а значение указывается в атрибуте content. В некоторых случаях могут автоматически быть переведены в настоящие HTTP-заголовки.

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

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

Синтаксис:

<meta http-equiv = "content-security-policy | content-type | default-style | refresh">

Значения атрибута

ЗначениеОписание
content-security-policyЭто значение позволяет администраторам веб-сайта определить правила (политику) для обслуживаемых ресурсов. Это помогает использовать механизм обеспечения безопасности, с помощью которого можно защищаться от атак с внедрением контента, например, межсайтового скриптинга.
content-typeЗадает кодировку для документа. Считается устаревшим в HTML 5.
default-styleУказывает имя предпочитаемых стилей документа. Имя задается в атрибуте content и должно соответствовать следующим условиям (ограничениям):
  • имя должно соответствовать значению глобального атрибута title HTML тега <link> в том же документе, при этом элемент должен иметь атрибут href, который ссылается на расположение таблицы стилей CSS.
  • имя должно соответствовать значению глобального атрибута title HTML тега <style> в том же документе, содержание этого элемента должно соответствовать таблице стилей CSS.
refreshОпределяет интервал времени в секундах через который документ будет обновлен. Если внутри атрибута content указать через запятую значение домена (ss, URL=»domain»), то произойдет переход со страницы на заданный ресурс.

Отличия HTML 4.01 от HTML 5

В HTML 5 значение content-type считается устаревшим.
До стандарта HTML 5 значение кодировки страницы указывалось следующим образом:
<meta http-equiv = "Content-Type" content = "text/html; charset = character_set">

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

<!DOCTYPE html>
<html>
	<head>
		<meta  http-equiv  = "refresh" content = "15, URL='http://basicweb.ru'" > <!-- мета элемент, который указывает, что страница будет перезагружена через 15 секунд и перейдет по указанному URL -->
		<meta  http-equiv  = "content-security-policy" content = "default-src https:" > <!-- мета элемент, который разрешает загрузку ресурсов (изображения, шрифты, скрипты и так далее) только с использованием https -->
		<meta  http-equiv  = "default-style" content = "default style" > <!-- мета элемент, который указывает имя предпочитаемых css стилей документа -->
		<title>Пример использования атрибута http-equiv тега <meta></title>
		<link href = "default.css" rel = "stylesheet" type = "text/css" title = "default style">
	</head>
	<body>
		<h3> Это заголовок.</h3>
		<p>Это параграф. </p>
	</body>
</html>

В данном примере мы использовали три элемента <meta> для которых были указаны различные значения атрибута http-equiv:

  • первый мета элемент, указывает, что страница будет перезагружена (значение refresh) через 15 секунд и перейдет по указанному URL (значения, указанные в атрибуте content). Если адрес URL не указан, то страница просто будет перезагружена.
  • второй мета элемент разрешает загрузку ресурсов (изображения, шрифты, скрипты и так далее) только с использованием https. Это стало доступным благодаря использованию значения content-security-policy, которое позволяет с использованием атрибута content определить правила (политику) для обслуживаемых ресурсов.
  • третий мета элемент, указывает имя предпочитаемых css стилей документа. Обратите внимание, что значение атрибута content должно совпадать со значением глобального атрибута title HTML тега <link>.

HTML тег <meta>

Атрибут http-equiv | htmlbook.ru


Internet ExplorerChromeOperaSafariFirefoxAndroidiOS
3.0+1.0+4.0+1.0+1.0+1.0+1.0+

Спецификация

HTML:3.24.015.0XHTML:1.01.1

Описание

Браузеры преобразовывают значение атрибута http-equiv, заданное с помощью content, в формат заголовка ответа HTTP и обрабатывают их, как будто они прибыли непосредственно от сервера.

Синтаксис

HTML
<meta http-equiv="...">
XHTML
<meta http-equiv="..." />

Значения

Любой подходящий идентификатор. Ниже приведены некоторые допустимые значения атрибута http-equiv.

Content-Type
Тип кодировки документа.
expires
Устанавливает дату и время, после которой информация в документе будет считаться устаревшей.
pragma
Способ кэширования документа.
refresh
Загрузить другой документ в текущее окно браузера.

Значение по умолчанию

Нет.

Пример

HTML 4.01IECrOpSaFx

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   <title>Тег META, атрибут http-equiv</title>
   <meta http-equiv="expires" content="Sun, 01 Jan 2013 07:01:00 GMT">
  </head> 
  <body>
    <p>...</p>
  </body>
</html>

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

— Веб-технологии для разработчиков

Этот перевод не завершён. Пожалуйста, помогите перевести эту статью с английского

HTML элемент <meta> представляет такие метаданные, которые не могут быть представлены другими HTML-метатегами, такими как <base>, <link>, <script>, <style> или <title>.

Категории контентаМета данные. Если задан itemprop атрибут: flow content, phrasing content.
Разрешенное содержимоеОтсутствует — это пустой элемент.
Пропуск тегаТак как это пустой элемент, то открывающий тег должен присутствовать, а закрывающий — отсутствовать.
Разрешенные родительские элементы<meta charset>, <meta http-equiv>: <head> элемент. Если http-equiv это не заявленная декларация, то может быть внутри элемента <noscript> или <head>.
Разрешёные роли ARIAОтсутствуют
DOM интерфейсHTMLMetaElement

Атрибуты

Этот элемент включает в себя глобальные атрибуты.

Примечание: атрибут name имеет особое значение для элемента <meta> и атрибут itemprop не должен быть задан в <meta> элементе в котором уже определены какие-либо name, http-equiv или charset атрибуты.

charset
Этот атрибут задает кодировку символов, используемую на странице. Он должен содержать стандартное имя IANA MIME для кодировки символов. Хотя стандарт не требует определенной кодировки, он рекомендует:
  • Авторам рекомендуется использовать UTF-8.
  • Не следует использовать ASCII-несовместимые кодировки, чтобы избежать угроз безопасности: браузеры, не поддерживающие их, могут интерпретировать вредоносный контент как HTML. Это относится к семейству кодировок JIS_C6226-1983, JIS_X0212-1990, HZ-GB-2312, JOHAB и EBCDIC.

Примечание: ASCII-несовместимые кодировки — это те, которые не преобразуют 8-битные коды точек 0x20,0x7E, 0x0020, 0x007E в коды Unicode точек.

  • Авторы не должны использовать CESU-8, UTF-7, BOCU-1 и/или SCSU, так как есть примеры атак межсайтового скриптинга использующих данные кодировки.
  • Авторам не следует использовать кодировку UTF-32, потому что не все алгоритмы кодирования HTML5 могут отличить её от UTF-16.
Примечание:
  • Указанный набор символов должен соответствовать одной странице.
    Нет веских оснований для объявления неточного набора символов.
  • <meta> элемент должен находиться внутри элемента <head> и задаваться в 1024 первых байтах HTML страницы, поскольку некоторые браузеры смотрят только эти байты перед выбором кодировки.
  • Этот <meta> элемент — часть алгоритма, определяющего набор символов (algorithm to determine the character set) страницы, который браузер поддерживает. Заголовок Content-Type и любые Byte-Order Marks элементы переопределяют данный элемент.
  • Настоятельно рекомендуется определить кодировку символов. Если для страницы не определён набор символов, то некоторые cross-scripting тхнологии могут повредить страницу, например такие как UTF-7 fallback cross-scripting technique. Постоянная установка этого элемента будет защищать Вас от этого риска.
  • Этот <meta> элемент это синоним для pre-HTML5 <meta http-equiv="Content-Type" content="text/html; charset=IANAcharset"> где IANAcharset соответствует значению эквивалентного charset атрибута.
    Этот синтаксис по-прежнему разрешен, хотя и устарел и больше не рекомендуется.
content
Этот атрибут содержит значение для http-equiv или name атрибута, в зависимости от контекста.
http-equiv
Этот атрибут определяет прагму, которая может изменять поведение серверов и пользователей. Значение прагмы определяется с помощью  content и может быть следующим:
"content-language"
Эта прагма определяет значение языка страницы по умолчанию. Не используйте эту прагму, так как она устарела Используйте глобальный атрибут <html> элемента вместо этого.
"Content-Security-Policy"
Это значение позволит администратору веб-сайта определить политику содержания для обслуживаемых ресурсов. За некоторыми исключениями, политика в основном включают в себя указание происхождения сервера и конечные точки сценария. Это помогает предотвратить атаки межсайтового скриптинга.
"content-type"
Этот атрибут определяет MIME type документа. За ним следует синтаксис такой же как и в поле заголовка объекта содержимого HTTPI, однако как и внутри HTML элемента, большинство этих значений не доступно.
Поэтому допустимым синтаксисом для его содержимого является литеральная строка ‘text/html‘, за которой следует набор символов со следующим синтаксисом: ‘; charset=IANAcharset‘ где  IANAcharset это предпочтительное MIME имя для набора символов, который определяется как IANA. Замечания:
  • Не используйте эту прагму, так как она устарела. Используйте атибутcharset в элементе <meta> вместо этого.
  • <meta> не может быть использована для выбора типа документа в XHTML документе, или в HTML5 документе, за которым следует XHTML синтаксис, никогда не задавайте MIME тип как XHTML MIME. Это будет некорректно.
  • Только HTML документ может использовать контент-тип, так что большинство из них являются неиспользуемыми, поэтому они являются устаревшими и заменяются charset атрибутом.
"default-style"
Специализация этой прагмы — предпочтительный стиль таблиц, используемый на странице. content атрибут должен содержать заголовок <link> элемента который href связывает атрибут с CSS таблцей стилей, или заголовок  <style> элемента, который содержит CSS таблицу стилей.
"refresh"
Эта прагма определяет:
  • Количество секунд перезагрузки таблицы, если content атрибут содержит только положительный целочисленный номер;
  • Время, в количестве секунд, за которое страница должна быть перенаправлена ​​на другую, если content атрибут содержит положительный целочисленный номер, заканчивающийся строкой ‘;url=‘ и корректный URL.
"set-cookie"
Эта прагма определяет cookie для страницы. Её содержимое должно заканчиваться синтаксисом, определяемым IETF HTTP Cookie Specification.

Замечание: Не используете эту прагму, так как она устарела. Используйте HTTP header set-cookie вместо этого.

name
Этот атрибут определяет имя уровня документа метаданных. 
Его не следует устанавливать, если один из атрибутов itemprop, http-equiv или charset также указан в наборе.
Имя этого документального уровня метаданных связано со значением, которое содержится в content атрибуте.Допустимые значения для имени элемента, со связанными с ними значениями, хранятся посредтвом content атрибута:
  • application-name, определяет имя веб-приложения, запущенного на веб-странице; Замечание:
    • Браузеры могут использовать его для идентификации приложения. Он отличается от  <title> элемента, который обычно состоит из имени приложения, но также может содержать специальную информацию, как например име документа или статус;
    • Простые веб-страницы не определяют application-name meta.
  • автор определяет в свободном формате имя автора документа;
  • описание, содержащее краткое и точное резюме содержания страницы. В некоторых браузерах, среди которых Firefox и Opera, этот мета используется как описание страницы по умолчанию в закладке;
  • генератор, содержащий в свободном формате идентификатор программного обеспечения, создавшего страницу;;
  • Ключевые слова, представленные строками, разделенными запятыми, связанные с содержанием страницы
  • referrer контролирует содержимое HTTP. Referer HTTP — заголовок, прикрепленный к любому запросу, отправленному из этого документа:
    Значения содержимого атрибута <meta name=»referrer»>
    no-referrerНе отправлять HTTP Referer заголовок.
    originОтправить оригинал.
    no-referrer-when-downgradeОтправить оригинал, как ссылку по умолчанию на безопасный пункт (https->https), но не отправлять ссылку на менее безопасную структуру (https->http). Это поведение по умолчанию.
    origin-when-crossoriginОтправляет полный URL (удаленный из параметров) при выполнении запроса с тем же источником, или только оригинал документа в других случаях.
    unsafe-URLОтправляет полный URL (удалённый из параметров), при выполнении запроса того же или перекрестного происхождения.

    Замечание: Некоторые браузеры поддерживают ключевые слова всегда, по умолчанию и никогда для реферера. Эти значения устарели.

    Замечание: Динамическая вставка <meta name="referrer"> (с помощью document.write или appendChild) создаёт недетерминизм, когда дело доходит до отправки рефереров. Также стоит отметить, что когда определяется несколько конфликтующих политик, применяется No-referrer policy.

Атрибут также может иметь значение, взятое из существующего листа определений  WHATWG Wiki MetaExtensions page. Хотя ни один из них официально не был принят, в число предложений входят несколько часто используемых имен:

  • creator, определят в свободном формате имя создателя документа. Это также может быть имя института. Если же имен больше чем одно, то несколько <meta> элементов должны быть использованы;
  • googlebot, синоним robots, но только следует за Googlebot, сканирует индексы для Google;
  • publisher, определяет в свободном формате имя того, кто опубликовал документ. Это также может быть имя института;
  • robots, определяет поведение, поисковых роботов на странице. Список этих значений представлен ниже:
    Значения для содержимого <meta name=»robots»>
    ЗначениеОписаниеИспользуется
    indexПозволяет роботу индексировать страницуAll
    noindexОсвобождает робота от идексирования страницAll
    followПозволяет роботу переходить по ссылкам со страницыAll
    nofollowЗапрещает роботу переходить по ссылкам со страницыAll
    noneЭквивалетно noindex, nofollowGoogle
    noodpЗапрещает использование Open Directory Project описания, если таковые имеются, как описание страницы на странице результатов поиска

    Google, Yahoo, Bing

    noarchiveЗапрещает поисковой системе кэшировать содержимое страницы.Google, Yahoo, Bing
    nosnippetЗапрещает отображение любого описания страницы на странице результатов поискаGoogle, Bing
    noimageindexЗапрещает отображение этой страницы в качестве ссылающейся страницы индексированного изображения.Google
    nocacheСиноним noarchiveBing
    Замечания:
    • Только кооперативные роботы будут следовать правилам, определенным именем роботов. 
    • Роботу необходимо получить доступ к странице, чтобы считать мета значение. Если Вы хотите скрыть от них информацию, то используйте  robots.txt файл.
    • Если вы хотите удалить страницу индекса, изменение мета в noindex будет работать, но только тогда, когда робот снова посетит страницу. Убедитесь, что файл robots.txt не предотвращает такие посещения. Некоторые поисковые системы имеют инструменты, позволяющие быстро удалить какую-либо страницу.
    • Некоторые возможные значения взаимно исключают друг друга, такие как использование индекса и noindex или follow и nofollow одновременно. В этих случаях поведение робота не определено и может варьироваться от одного к другому. Поэтому избегайте этих случаев.
    • Некоторые поисковые роботы-роботы, такие как Google, Yahoo Search или Bing, поддерживают те же значения в директиве HTTP, X-Robot-Tags: это позволяет им использовать эту прагму для документов, отличных от HTML, например изображений.
  • slurp,синоним robots, но следует только за Slurp, индексирующим роботом от Yahoo Search;

Наконец несколько общих терминов:

  • viewport, который дает подсказки о размере изначального размера viewport. Эта прагма используется только на некоторых мобильных устройствах.
    Значения для содержания <meta name="viewport">
    ЗначениеДопустимые значенияОписание
    widthположительный целочисленный номер или литерал device-widthОпределяет ширину области просмотра в пикселях
    heightположительный целочисленный номер или литерал device-heightОпределяет высоту области просмотра в пикселях
    initial-scaleположительное число между 0.0 и 10.0Определяет соотношение между шириной устройства и размером области просмотра
    maximum-scaleположительное число между 0.0 и 10.0Определяет максимальное значение зума; должен быть больше или равен минимальному масштабу или быть неопределенным.
    minimum-scaleположительное число между 0.0 и 10.0Определяет минимальное значение зума; должен быть меньше или равен максимальному масштабу или быть неопределенным.
    user-scalableбулевское значение (да или нет)Если весь набор содержит значения нет, то пользователю не доступен зум на веб-странице. По умолчанию задано значение да.
    Замечания:
    • Хотя и не стандартизирован, этот атрибут используется разными мобильными браузерами, например Safari Mobile, Firefox for Mobile or Opera Mobile.
    • Значения по умолчанию могут быть изменены у разных браузеров или устройств..
    • Для изучения этой прагмы на Firefox for Mobile, посмотрите статью this article.
scheme
Этот атрибут определяет схему, которая описывает метаданные. 
Схема — это контекст, ведущий к правильной интерпретации content значения, например формата.

Замечание: Не используйте этот атрибут, так как он устарел. Для него нет никакой замены, поскольку реально он не использовался. Опустите его.

Замечания

В зависимости от установленных атрибутов, тип метаданных может быть одним из следующих:

  • Если в наборе name, то это document-level metadata, применяемая ко всей странице.
  • Если в набореhttp-equiv , то это pragma directive,
    то есть информация, веб-сервер предоставляет информацию о том, как должна обслуживаться веб-страница.
  • Если в наборе charset, то это charset declaration,
    то есть кодировка, используемая для сериализованной формы веб-страницы.
  • Если в наборе itemprop, то это user-defined metadata,
    прозрачна для агента пользователя, поскольку семантика метаданных зависит от пользователя.

Пример

<!-- In HTML5 -->
<meta charset="utf-8">

<!-- Redirect page after 3 seconds -->
<meta http-equiv="refresh" content="3;url=https://www.mozilla.org">

Спецификации

Совместимость с браузерами

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

Кодировка

символов — Как установить «Content-Type … charset» в заголовке запроса с помощью ссылки HTML

Переполнение стека
  1. Товары
  2. Клиенты
  3. Случаи использования
  1. Переполнение стека Общественные вопросы и ответы
  2. Команды Частные вопросы и ответы для вашей команды
  3. предприятие Частные вопросы и ответы для вашего предприятия
  4. работы Программирование и связанные с ним возможности технической карьеры
  5. Талант Нанять технических талантов
  6. реклама Обратитесь к разработчикам по всему миру
,

Кодировка символов типа содержимого в электронной почте HTML


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

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

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

Попробуйте конвертер символов

Что такое Content-Type?

Content-type сообщает веб-браузеру или почтовому приложению, как интерпретировать текстовые символы в вашем HTML или теле письма. Самые популярные наборы символов — UTF-8 и ISO-8859-1.

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

  

Символы UTF-8: ö ü ä

UTF-8 китайский: 激 光 這

Символы объекта HTML: & # 28450; & # 23383;

Вот как это отображается с использованием каждого набора символов:

Rendering results with different sets

Как видно выше, китайские символы не представлены в наборе символов ISO-8859-1.Это связано с тем, что ISO-8859-1 включает только символы латинского языка. В результате получается набор беспорядочного текста, который является интерпретацией символов ISO-8859-1.

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

В рабочем процессе доступности Campaign Precheck вы можете установить тип содержимого электронной почты одним нажатием кнопки.Мы позаботимся о том, чтобы в ваш HTML был добавлен правильный код.

Инструмент проверки типа содержания Campaign Precheck.

Как это вписывается в электронные письма в формате HTML?

При разработке веб-сайтов мы можем указать набор символов в метатеге, используя этот код:

    

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

Как установить Content-Type в заголовке электронной почты

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

Вот фрагмент заголовка электронного письма (обратите внимание на значение типа содержимого):

  Дата: среда, 15 декабря 2010 г. 12:45:55 -0700
Кому: test @ test.ком
От: [email protected]
Тема: UTF-8
Идентификатор сообщения: 
X-приоритет: 3
X-Mailer: EOAMailer 5.0.0
MIME-версия: 1.0
Кодирование передачи содержимого: 8 бит
Тип содержимого: текст / html; charset = "UTF-8"  

Результаты тестирования почтового клиента

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

Вот результаты тестов:

Клиенты Content-Type
AOL
Outlook 2003, 2007 и 2010
Lotus Notes 8 и 8.5
Yahoo
Thunderbird
iPad
iPhone Mail
Android Mail
Берет тип содержимого из заголовка вашего электронного письма
Gmail
Android Gmail
iPhone Gmail
iPad Gmail
Преобразует тип содержимого в UTF-8

Мы заметили одно интересное действие: веб-клиенты преобразуют ваш текст в набор символов типа содержимого перед его отображением в браузере.Мы смогли проверить это, просмотрев, какой тип контента они устанавливали в своих метатегах. Как оказалось, большинство из них используют UTF-8.

Решение

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

Вариант 1:
Обратитесь к своему поставщику услуг электронной почты (ESP) и спросите их, какой тип содержимого они задают в заголовке при отправке электронных писем.Как только вы узнаете тип содержимого, используйте это значение в своем метатеге HTML при создании электронного письма.

Вариант 2:
Преобразуйте все специальные символы в их HTML-объекты, и вам не придется беспокоиться о заголовке Content-Type. Например, следующий символ «漢» имеет значение объекта HTML «& # 28450;». Чтобы помочь вам с преобразованием, мы создали бесплатный онлайн-инструмент, который преобразует все ваши специальные символы за вас. Просто воспользуйтесь этим инструментом преобразования, прежде чем отправлять электронную почту.

Заключительные слова о типе содержимого

Всегда важно проверять наборы символов с помощью Internet Explorer и Firefox, особенно если вы используете нелатинские символы или копируете и вставляете контент из текстового редактора, такого как Microsoft Word.

Когда вы отправляете тестовую электронную почту через Email on Acid, наши серверы настроены на отправку вашей электронной почты с использованием Content-Type UTF-8 каждому из наших поддерживаемых почтовых клиентов.

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

Попробуй сегодня

Этот пост был обновлен 25 января 2019 года. Последний раз он обновлялся в феврале 2017 года и впервые был опубликован в 2011 году.

Автор: Джон Тис

Джон Тис (John Thies) — генеральный директор и соучредитель Email on Acid, платформы проверки качества электронной почты до развертывания, которая стремится устранить врожденный страх перед нажатием кнопки «Отправить».Он страстный и увлеченный лидер отрасли, который живет, дышит и мечтает об электронной почте (серьезно). Джон также является генеральным директором Cause for Awareness, недавно созданной некоммерческой организации, которая предоставляет другим некоммерческим организациям ресурсы цифрового маркетинга. Он проживает в Денвере, штат Колорадо, с женой и сыном.

Автор: Джон Тис

Джон Тис (John Thies) — генеральный директор и соучредитель Email on Acid, платформы проверки качества электронной почты до развертывания, которая стремится устранить врожденный страх перед нажатием кнопки «Отправить».Он страстный и увлеченный лидер отрасли, который живет, дышит и мечтает об электронной почте (серьезно). Джон также является генеральным директором Cause for Awareness, недавно созданной некоммерческой организации, которая предоставляет другим некоммерческим организациям ресурсы цифрового маркетинга. Он проживает в Денвере, штат Колорадо, с женой и сыном.

,

Тип содержимого рядом с текстом / html — qaru Переполнение стека
  1. Товары
  2. Клиенты
  3. Случаи использования
  1. Переполнение стека Общественные вопросы и ответы
  2. Команды Частные вопросы и ответы для вашей команды
  3. предприятие Частные вопросы и ответы для вашего предприятия
  4. работы Программирование и связанные с ним возможности технической карьеры
  5. Талант Нанять технических талантов
  6. реклама Обратитесь к разработчикам по всему миру

Загрузка…

    .

    типов MIME (типы мультимедиа IANA) — веб-технологии для разработчиков

    Тип носителя (также известный как многоцелевое расширение почты Интернета или тип MIME ) — это стандарт, который указывает природу и формат документа, файла или набора байтов. Он определен и стандартизирован в IETF RFC 6838.

    Internet Assigned Numbers Authority (IANA) отвечает за все официальные типы MIME, и вы можете найти самый последний и полный список на их странице Media Types.

    Важно: Браузеры используют тип MIME, а не , а не расширение файла , чтобы определить, как обрабатывать URL-адрес, поэтому важно, чтобы веб-серверы отправляли правильный тип MIME в заголовке Content-Type ответа. Если это неправильно настроено, браузеры могут неверно истолковать содержимое файлов, а сайты не будут работать правильно, а загруженные файлы могут быть неправильно обработаны.

    Структура типа MIME

    Самый простой тип MIME состоит из типа и подтипа ; каждая из этих строк, при соединении с косой чертой (/) между ними, составляет MIME-тип.В типе MIME нельзя использовать пробелы:

      тип / подтип  

    Тип представляет общую категорию, в которую попадает тип данных, например видео или текст . Подтип определяет точный вид данных указанного типа, которые представляет тип MIME. Например, для MIME-типа текст подтип может быть plain (обычный текст), html (исходный код HTML) или calendar (для iCalendar / .ics ) файлы.

    Каждый тип имеет свой собственный набор возможных подтипов, а тип MIME всегда имеет как тип, так и подтип, а не только один или другой.

    Для предоставления дополнительных сведений можно добавить необязательный параметр :

      тип / подтип ;  параметр  = значение   

    Например, для любого типа MIME, основным типом которого является текст , можно использовать необязательный параметр charset , чтобы указать набор символов, используемый для символов в данных.Если кодировка не указана, по умолчанию используется кодировка ASCII ( US-ASCII ), если она не отменена настройками пользовательского агента. Чтобы указать текстовый файл UTF-8, используется тип MIME text / plain; charset = UTF-8 .

    Типы

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

    Типы

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

    Дискретные типы

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

    приложение Список в IANA
    Любые двоичные данные, которые явно не относятся ни к одному из других типов; либо данные, которые будут выполняться или интерпретироваться каким-либо образом, либо двоичные данные, требующие использования определенного приложения или категории приложений.Общие двоичные данные (или двоичные данные, истинный тип которых неизвестен) — это application / octet-stream . Другие распространенные примеры включают application / pdf , application / pkcs8 и application / zip .
    аудио Список в IANA
    Аудио или музыкальные данные. Примеры включают audio / mpeg , audio / vorbis .
    пример
    Зарезервировано для использования в качестве заполнителя в примерах, показывающих, как использовать типы MIME.Их никогда не следует использовать вне списков примеров кода и документации. , пример также можно использовать как подтип; например, в примере, относящемся к работе со звуком в Интернете, можно использовать MIME-тип audio / пример , чтобы указать, что тип является заполнителем и должен быть заменен соответствующим при использовании кода в реальном мире. ,
    шрифт Список в IANA
    Данные шрифта / гарнитуры. Общие примеры включают font / woff , font / ttf и font / otf .
    изображение Список в IANA
    Изображение или графические данные, включая растровые и векторные неподвижные изображения, а также анимированные версии форматов неподвижных изображений, такие как анимированный GIF или APNG. Типичные примеры: image / jpeg , image / png и image / svg + xml .
    модель Список в IANA
    Данные модели для 3D-объекта или сцены. Примеры включают модель / 3mf и модель / vml .
    текст Список в IANA
    Только текстовые данные, включая любое удобочитаемое содержимое, исходный код или текстовые данные, такие как данные в формате значений, разделенных запятыми (CSV).Примеры включают текст / простой , текст / csv и текст / html .
    видео Список в IANA
    Видеоданные или файлы, например фильмы MP4 (видео / mp4 ).

    Для текстовых документов без определенного подтипа следует использовать text / plain . Точно так же для двоичных документов без определенного или известного подтипа следует использовать application / octet-stream .

    Составные типы

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

    За исключением multipart / form-data , используемого в методе POST HTML-форм, и multipart / byteranges , используемого с 206 Partial Content для отправки части документа, HTTP не • обрабатывать составные документы особым образом: сообщение передается в браузер (который, скорее всего, покажет окно «Сохранить как», если он не знает, как отобразить документ).

    Есть два составных типа:

    сообщение Список в IANA
    Сообщение, которое инкапсулирует другие сообщения.Это можно использовать, например, для представления электронного письма, которое включает переадресованное сообщение как часть своих данных, или для того, чтобы разрешить отправку очень больших сообщений частями, как если бы это было несколько сообщений. Примеры включают сообщение / rfc822 (для переадресованного сообщения или сообщения с ответом) и сообщение / частичное , позволяющее автоматически разбивать большое сообщение на более мелкие для автоматической повторной сборки получателем.
    составной Список в IANA
    Данные, состоящие из нескольких компонентов, которые могут иметь разные типы MIME по отдельности.Примеры включают multipart / form-data (для данных, созданных с использованием FormData API) и multipart / byteranges (определено в RFC 7233: 5.4.1 и используется с ответом HTTP 206 «Частичное содержимое», возвращаемым, когда извлеченные данные — это только часть содержимого, например, доставленные с использованием заголовка Range ).

    Важные типы MIME для веб-разработчиков

    приложение / октет-поток

    Это значение по умолчанию для двоичных файлов.Поскольку это означает неизвестный двоичный файл , браузеры обычно не запускают его или даже не спрашивают, нужно ли его запускать. Они рассматривают это так, как если бы заголовок Content-Disposition был установлен на вложение , и предлагают диалоговое окно «Сохранить как».

    текст / простой

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

    Обратите внимание, что text / plain не означает «какие-либо текстовые данные.»Если они ожидают определенного типа текстовых данных, они, скорее всего, не сочтут это совпадением. В частности, если они загрузят файл text / plain из элемента , объявляющего файл CSS, они не распознают его как действительный файл CSS, если он представлен с text / plain . Необходимо использовать mime-тип text / css CSS.

    текст / CSS

    CSS-файлов, используемых для стилизации веб-страницы. необходимо отправить с текстом / css . Если сервер не распознает .css для файлов CSS, он может отправлять их с типами MIME text / plain или application / octet-stream . В этом случае они не будут распознаваться большинством браузеров как CSS и будут проигнорированы.

    текст / HTML

    Все содержимое HTML должно обслуживаться этим типом. Альтернативные типы MIME для XHTML (например, application / xhtml + xml ) в настоящее время в основном бесполезны.

    Примечание: Используйте application / xml или application / xhtml + xml , если вам нужны строгие правила синтаксического анализа XML, разделы или элементы, не относящиеся к HTML / SVG. / MathML пространства имен.

    текст / JavaScript

    Согласно спецификации HTML, файлы JavaScript всегда должны обслуживаться с использованием типа MIME text / javascript . Никакие другие значения не считаются допустимыми, и использование любого из них может привести к тому, что скрипты не будут загружаться или запускаться.

    По историческим причинам стандарт MIME Sniffing Standard (определение того, как браузеры должны интерпретировать типы мультимедиа и выяснить, что делать с контентом, у которого нет действительного контента) позволяет использовать JavaScript с использованием любого типа MIME, который по существу соответствует любому из следующие:

    • приложение / javascript
    • приложение / ecmascript
    • приложение / x-ecmascript
    • приложение / x-javascript
    • текст / JavaScript
    • текст / ecmascript
    • текст / javascript1.0
    • текст / javascript1.1
    • текст / javascript1.2
    • текст / javascript1.3
    • текст / javascript1.4
    • текст / javascript1.5
    • текст / jscript
    • текст / livescript
    • текст / x-ecmascript
    • текст / x-javascript

    Примечание: Несмотря на то, что любой пользовательский агент может поддерживать любой или все из них, вы должны использовать только text / javascript .Это единственный тип MIME, который гарантированно будет работать сейчас и в будущем.

    Некоторое содержимое, которое вы обнаружите, может иметь параметр charset в конце типа носителя text / javascript , чтобы указать набор символов, используемый для представления содержимого кода. Это недопустимо, и в большинстве случаев скрипт не загружается.

    Типы изображений

    Файлы с типом MIME изображение содержат данные изображения. Подтип указывает, какой именно формат файла изображения представляют данные.Только несколько типов изображений используются достаточно часто, чтобы их можно было считать безопасными для использования на веб-страницах:

    Аббревиатура Формат файла Тип MIME Расширение файла (а) Совместимость с браузером
    APNG Анимированная переносимая сетевая графика изображение / apng .apng Chrome, Edge, Firefox, Opera, Safari
    БМП Растровый файл изображение / BMP .БМП Chrome, Edge, Firefox, Internet Explorer, Opera, Safari
    GIF Формат обмена графикой изображение / gif .gif Chrome, Edge, Firefox, Internet Explorer, Opera, Safari
    ICO Значок Microsoft изображение / значок x .ico , .cur Chrome, Edge, Firefox, Internet Explorer, Opera, Safari
    JPEG Объединенная группа экспертов по фотографии изображение изображение / jpeg .jpg , .jpeg , .jfif , .pjpeg , .pjp Chrome, Edge, Firefox, Internet Explorer, Opera, Safari
    PNG Переносимая сетевая графика изображение / png .png Chrome, Edge, Firefox, Internet Explorer, Opera, Safari
    SVG Масштабируемая векторная графика изображение / svg + xml .svg Chrome, Edge, Firefox, Internet Explorer, Opera, Safari
    TIFF Формат файлов изображений с тегами изображение / tiff .tif , .tiff Нет встроенных; требуются дополнения
    WebP Формат веб-изображения изображение / webp .webp Chrome, Edge, Firefox, Opera

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

    Типы аудио и видео

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

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

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

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

    Наиболее часто используемые типы MIME, используемые для веб-содержимого, перечислены ниже. Однако это не полный список всех типов, которые могут быть доступны. См. Руководство по форматам медиа-контейнеров.

    Тип MIME Тип аудио или видео
    аудио / волна
    аудио / wav
    аудио / x-wav
    аудио / x-pn-wav
    Аудиофайл в формате контейнера WAVE. Аудиокодек PCM (кодек WAVE «1») часто поддерживается, но другие кодеки имеют ограниченную поддержку (если таковая имеется).
    аудио / webm Аудиофайл в формате контейнера WebM.Vorbis и Opus — это кодеки, официально поддерживаемые спецификацией WebM.
    видео / webm Видеофайл, возможно, со звуком, в формате контейнера WebM. VP8 и VP9 — наиболее распространенные видеокодеки; Vorbis и Opus — самые распространенные аудиокодеки.
    аудио / ogg Аудиофайл в формате контейнера Ogg. Vorbis — наиболее распространенный аудиокодек, используемый в таком контейнере; однако Opus теперь также поддерживается Ogg.
    видео / ogg Видеофайл, возможно со звуком, в формате контейнера Ogg. Theora — это обычный видеокодек, используемый в нем; Vorbis — это обычный аудиокодек, хотя Opus становится все более распространенным.
    приложение / ogg Аудио или видео файл, использующий формат контейнера Ogg. Theora — это обычный видеокодек, используемый в нем; Vorbis — обычный аудиокодек.

    multipart / form-data

    Тип multipart / form-data может использоваться при отправке значений заполненной HTML-формы из браузера на сервер.

    Как формат документа, состоящего из нескольких частей, он состоит из разных частей, разделенных границей (строка, начинающаяся с двойного тире ). Каждая часть представляет собой отдельный объект со своими собственными заголовками HTTP, Content-Disposition и Content-Type для полей загрузки файлов.

     Content-Type: multipart / form-data; граница = aBoundaryString
    (другие заголовки, связанные с составным документом в целом)
    
    --aBoundaryString
    Content-Disposition: форма-данные; Name = "Myfile"; имя файла = "IMG.JPG»
    Тип содержимого: изображение / JPEG
    
    (данные)
    --aBoundaryString
    Content-Disposition: форма-данные; имя = "MyField"
    
    (данные)
    --aBoundaryString
    (больше подразделов)
    --aBoundaryString--
    
     

    Следующие <форма> :

     

    отправит это сообщение:

     POST / HTTP / 1.1
    Хост: localhost: 8000
    Пользовательский агент: Mozilla / 5.0 (Macintosh; Intel Mac OS X 10.9; rv: 50.0) Gecko / 20100101 Firefox / 50.0
    Принять: text / html, application / xhtml + xml, application / xml; q = 0.9, * / *; q = 0.8
    Accept-Language: en-US, en; q = 0,5
    Принятие кодировки: gzip, deflate
    Подключение: keep-alive
    Небезопасные запросы на обновление: 1
    Content-Type: multipart / form-data; граница = --------------------------- 8721656041911415653955004498
    Длина содержимого: 465
    
    ----------------------------- 8721656041911415653955004498
    Content-Disposition: форма-данные; имя = "MyTextField"
    
    Тест
    ----------------------------- 8721656041911415653955004498
    Content-Disposition: форма-данные; имя = "myCheckBox"
    
    на
    ----------------------------- 8721656041911415653955004498
    Content-Disposition: форма-данные; Name = "Myfile"; имя файла = "тест.текст"
    Content-Type: текст / простой
    
    Простой файл.
    ----------------------------- 8721656041911415653955004498--
    
     

    multipart / byteranges

    Тип MIME multipart / byteranges используется для отправки частичных ответов браузеру.

    Когда отправляется код статуса 206 Partial Content , этот тип MIME указывает, что документ состоит из нескольких частей, по одной для каждого из запрошенных диапазонов. Как и другие составные типы, Content-Type использует границу для разделения частей.Каждая часть имеет заголовок Content-Type с его фактическим типом и Content-Range диапазона, который он представляет.

      HTTP / 1.1 206 Частичное содержимое
    Accept-Ranges: байты
    Content-Type: multipart / byteranges; граница = 3d6b6a416f9b5
    Длина содержимого: 385
    
    --3d6b6a416f9b5
    Тип содержимого: текст / html
    Content-Range: байты 100-200 / 1270
    
    eta http-Equiv = "Content-type" content = "text / html; charset = utf-8" />
         

    Важность установки правильного типа MIME

    Большинство веб-серверов отправляют нераспознанные ресурсы как MIME-тип application / octet-stream .По соображениям безопасности большинство браузеров не позволяют устанавливать пользовательское действие по умолчанию для таких ресурсов, вынуждая пользователя сохранять его на диск, чтобы использовать его.

    Некоторые распространенные неправильные конфигурации серверов:

    • файлов, сжатых в формате RAR. В этом случае идеальным будет настоящий тип исходных файлов; это часто невозможно, так как файлы .RAR могут содержать несколько ресурсов разных типов. В этом случае настройте сервер для отправки application / x-rar-compressed .

    • Аудио и видео. В элементах или будут воспроизводиться только ресурсы с правильным типом MIME. Обязательно укажите правильный тип носителя для аудио и видео.

    • Собственные типы файлов. Избегайте использования application / octet-stream , поскольку большинство браузеров не позволяют определять поведение по умолчанию (например, «Открыть в Word») для этого универсального типа MIME. Конкретный тип, например application / vnd.mspowerpoint позволяет пользователям автоматически открывать такие файлы в программном обеспечении для презентаций по их выбору.

    Обнюхивание MIME

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

    Каждый браузер выполняет сниффинг MIME по-своему и при разных обстоятельствах. (Например, Safari будет смотреть на расширение файла в URL-адресе, если отправленный тип MIME не подходит.) Есть проблемы с безопасностью, поскольку некоторые типы MIME представляют исполняемый контент. Серверы могут предотвратить прослушивание MIME, отправив заголовок X-Content-Type-Options .

    Другие способы передачи документа типа

    MIME-типы - не единственный способ передать информацию о типе документа:

    • Иногда используются суффиксы имени файла, особенно в Microsoft Windows. Не все операционные системы считают эти суффиксы значимыми (например, Linux и MacOS), и нет гарантии, что они верны.
    • Магические числа. Синтаксис различных форматов позволяет делать вывод о типах файлов, глядя на их байтовую структуру. Например, файлы GIF начинаются с шестнадцатеричного значения 47 49 46 38 39 ( GIF89 ), а файлы PNG - с 89 50 4E 47 ( .PNG ). Не все типы файлов имеют магические числа, так что это тоже не на 100% надежно.

    См. Также

    ,