Элемент title


Содержание

Основные атрибуты элемента BODY

Background Задаёт фоновое изображение URL background=»image1.gif»

Bgcolor Задаёт цвет фона цвет Bgcolor=»white»

Text Задаёт цвет текста документа цвет Text=»white»

Link, vlink, alink Задаёт цвет обычных, посещённых, активных ссылок цвет link=»blue»

Пример элемента BODY.

Здесь будут располагаться остальные элементы HTML кода

Этот код задаёт белый цвет для фона страницы. Фоновое изображение берётся из файла image.gif, который находится в том же каталоге, что и основной HTML документ. Цвет текста устанавливается чёрным. Цвет простых ссылок — красный, цвет активных ссылок (при щелчке мыши на ссылке) — синий, а цвет посещённых ссылок (ссылки на странице, которые вы уже посетили) — пурпурный.

Примечание: Цвета можно задавать тремя способами:

C помощью ключевых слов:black, white, red и т.д..

Шестнадцатеричным кодом цвета в полной форме (#00FFCC, #000000) или сокращением (#0FC, #000).

Десятичным кодом в модели RGB. Например: rgb(255.255.0)

Элемент head — заголовок документа

Содержит служебную информацию документа: название документа, ключевые слова, информацию о кодировке.

Внутри элемента head могут содержаться следующие элементы:

— позволяет задать базовый адрес (url) для всего документа.

— позволяет установить шрифт для документа.

— устанавливает связи с другими элементами.

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

Почему 1285321 студент выбрали МегаОбучалку.

7 Общая структура документа HTML

Содержание

7.1 Введение

Документ HTML 4 состоит из трёх частей:

  1. строка, содержащая информацию о версии HTML,
  2. объявляющий раздел header/»шапка» (ограниченный элементом HEAD ),
  3. тело, содержащее собственно сам документ. Тело может выполняться в элементах BODY или FRAMESET .

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

Вот пример простого документа HTML:

7.2 Информация о версии HTML

Корректный документ HTML объявляет, какую версию HTML использует данный документ. Объявление типа документа именует определение типа документа (ОТД) для использования в этом документе (см. [ISO8879]).

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

    HTML 4.01 Strict/Строгое ОТД включает все элементы и атрибуты, которые не являются не рекомендуемыми или не входят в документ типа «набор фрэймов». Для документов, использующих это ОТД, дайте такое объявление типа :

URI в каждом из этих объявлений типа документа позволяет пользовательским агентам (ПА) загрузить необходимые ОТД наборы мнемоник. Следующие (относительные) URI ссылаются на ОТД и наборы мнемоник для HTML 4:

Связь между публичными идентификаторами и файлами может быть установлена с использованием файла каталога образцов в соответствии с форматом, рекомендованным Oasis Open Consortium (см. [OASISOPEN]). Файл каталога образцов HTML 4.01 включён в начало раздела справочной информации SGML для HTML. Последние две буквы в объявлении обозначают язык ОТД. Для HTML это всегда английский («EN»).

Примечание. Начиная с версии HTML 4.01 от 24 декабря, the HTML Working Group придерживается следующей политики:

  • любые будущие изменения в ОТД HTML 4 не изменят корректности документов. соответствующих ОТД настоящей спецификации. The HTML Working Group оставляет за собой право корректировать обнаруженные «жучки»;
  • программные средства, соответствующие ОТД настоящей спецификации, могут игнорировать возможности будущих ОТД HTML 4, которые ими не распознаются.

Это означает, что в объявлении типа документа авторы могут спокойно использовать системные идентификаторы, которые ссылаются на позднейшую версию ОТД HTML 4.
Авторы могут также выбрать использование системных идентификаторов, ссылающихся на специфическую (датированную) версию ОТД HTML 4 при проверке необходимости наличия конкретного ОТД.
W3C приложит соответствующие усилия для того, чтобы архивные документы были неограниченно доступны по своим оригинальным адресам и в своей оригинальной форме.

7.3 Элемент HTML


Начальный тег: не обязателен, Конечный тег: не обязателен

version = cdata [CN] Не рекомендуется. Значением этого атрибута является версия ОТД HTML, под управлением которого создан текущий документ. Этот атрибут не рекомендуется использовать, поскольку он является излишним при наличии информации о версии, предоставляемой объявлением типа документа.

Атрибут, определённый в другом месте

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

7.4 «Шапка» документа

7.4.1 Элемент HEAD

Начальный тег: не обязателен, Конечный тег: не обязателен

profile = uri [CT] Определяет размещение одного или более профилей метаданных, разделённых пробелами. С учётом будущих расширений, ПА должны рассматривать значение как список, даже если в данной спецификации значащим является только первый URI. Профили обсуждаются ниже в разделе метаданные.

Атрибут, определённый в другом месте

Элемент HEAD содержит информацию о текущем документе, такую как название/title, ключевые слова, которые могут оказаться полезными при использовании маши поиска, и другие данные, не являющиеся содержимым документа. ПА вообще-то не должны отображать как содержимое документа информацию элемента HEAD . Они могут, однако, сделать информацию из HEAD доступной пользователю с помощью других механизмов.

7.4.2 Элемент TITLE

Начальный тег: необходим, Конечный тег: необходим

Атрибуты, определённые в другом месте

Каждый документ HTML обязан элемент TITLE в разделе HEAD .

Авторы должны использовать элемент TITLE для идентификации содержимого документа. Поскольку пользователи часто обращаются к документам вне контекста, авторы должны предоставлять осмысленные заголовки. Таким образом, вместо такого заголовка, как «Introduction», который не даёт достаточно информации о документе, авторы должны записать, например, так: «Introduction to Medieval Bee-Keeping».

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

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

7.4.3 Атрибут title

title = text [CS] Этот атрибут предоставляет информативные данные об элементе, в котором он содержится.

В отличие от элемента TITLE , который даёт информацию обо всём документе и может появиться в документе только один раз, атрибут title может содержаться в любом количестве элементов. См. определения элементов, чтобы удостовериться, что они поддерживают этот атрибут.

Значения атрибута title по разному могут рассматриваться ПА. К примеру, визуальные браузеры часто отображают title как «подсказку» (краткое сообщение, появляющееся при наведении указательного устройства на объект). Аудио ПА могут «произносить» информацию заголовка в аналогичном контексте. Например, установка этого атрибута для гиперссылки позволяет ПА (визуальным и не-) сделать сообщение о связанном ресурсе:

Атрибут title при использовании с элементом LINK дополнительно играет роль указателя на внешнюю таблицу стилей. См. детали в разделе гиперссылки и таблицы стилей.

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

7.4.4 Метаданные

Примечание. The W3C Resource Description Framework (Структура Описания Ресурса) (см. [RDF10]) стал W3C Recommendation в феврале 1999 года. RDF даёт авторам возможность специфицировать читаемые машиной метаданные о документах HTML и других ресурсах, доступных в сети.

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

Например, чтобы специфицировать автора документа, можно использовать элемент META :

Элемент META определил свойство (здесь — «Author») и установил ему значение (здесь — «Dave Raggett»).

Эта спецификация не определяет набор действительных свойств метаданных. Значение свойства и набор действительных значений для этого свойства должны быть определены в справочном словаре, называемом профиль. Например, профиль, созданный для помощи поисковым машинам при индексировании документов, может определять свойства, такие как «author», «copyright», «keywords» и т.д.

Спецификация метаданных

Вообще спецификация метаданных состоит из двух шагов:

  1. объявление свойства и значения этого свойства. Это можно сделать двояко:
    • из документа через элемент META ;
    • вне документа связыванием метаданных через элемент LINK (см. раздел типы ссылок);
  2. ссылка на профиль, где определены свойства и их действительные значения. Чтобы создать профиль, используйте атрибут profile элемента HEAD .

Учтите, что, поскольку профиль определён для элемента HEAD , этот же профиль применяется и для всех элементов META и LINK в «шапке» документа.

От ПА не требуется поддержка механизма метаданных. Для тех ПА, которые поддерживают метаданные, эта спецификация не определяет, как метаданные должны интерпретироваться.

Элемент META

Начальный тег: требуется, Конечный тег: запрещён

Для следующих атрибутов допустимые значения и их интерпретация зависят от profile :

name = name [CS] Устанавливает имя свойства. Эта спецификация не содержит списка действительных значений для этого атрибута. content = cdata [CS] Определяет значение свойства. Эта спецификация не содержит списка действительных значений для этого атрибута. scheme = cdata [CS] Этот атрибут именует схему, используемую для интерпретации значения свойства (см. детали в разделе профили). http-equiv = name [CI] Этот атрибут может использоваться вместо атрибута name . HTTP серверы используют этот атрибут для получения информации для «шапки» ответа HTTP.


Атрибут, определённый в другом месте

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

Каждый элемент META определяет пару свойство-значение. Атрибут name идентифицирует свойство, а атрибут content определяет значение свойства.

Например, следующее объявление устанавливает значение для свойства Author:

Атрибут lang может использоваться элементом META для определения языка значения атрибута content . Это делает возможным использование речевого синтеза, устанавливая зависящие от языка правила произношения.

В этом примере имя автора объявляется как французское:

Примечание. Элемент META это общий механизм для спецификации метаданных. Однако некоторые элементы и атрибуты HTML уже обрабатывают отдельные части метаданных и могут быть использованы авторами вместо META : элемент TITLE , элемент ADDRESS , элементы INS и DEL , атрибут title и атрибут cite .

Примечание. Если свойство элемента META принимает значение — URI, некоторые авторы предпочитают устанавливать метаданные элементом LINK . Таким образом, следующее объявление метаданных:

можно записать также:

META и «шапки» HTTP

Атрибут http-equiv может использоваться вместо атрибута name имеет специальное значение при возврате документов по протоколу Hypertext Transfer Protocol (HTTP). HTTP серверы могут использовать имя свойства, специфицированное атрибутом http-equiv , для создания «шапки» в стиле [RFC822] для ответа HTTP. См. спецификацию HTTP ([RFC2616]) о правильных «шапках» HTTP.

Следующая выдержка из объявления META :

даст в результате «шапку» HTTP:

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

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

META и машины поиска

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

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

META и PICS

Этот пример иллюстрирует, как можно использовать объявление META для включения лэйбла PICS 1.1:

META и информация по умолчанию

Элемент META может использоваться для спецификации информации по умолчанию для следующих объектов документа:

В следующем примере определён набор символов документа — ISO-8859-5:

Профили метаданных

Это пример ссылки на гипотетический профиль, определяющий используемые свойства для индексации документа. Свойства, определённые этим профилем, включая «author», «copyright», «keywords» и «date», имеют свои значения, установленные последовательными объявлениями META :

Так как эта спецификация уже написана, обычной практикой является использование форматов даты, описанных в [RFC2616], раздел 3.3.
Поскольку эти форматы относительно сложны для обработки, мы рекомендуем авторам использовать формат даты [ISO8601]. Дополнительно см. раздел об элементах INS и DEL .

Атрибут scheme позволяет авторам предоставлять ПА информацию, более подходящую для корректной интерпретации метаданных. Иногда такая дополнительная информация может быть критичной, если метаданные специфицированы в другом формате. Например, автор может установить дату в (неоднозначном) формате «10-9-97», что может означать 9 октября 1997 или 10 сентября 1997 г. Значение атрибута scheme «Month-Day-Year» может однозначно определить значение этой даты.

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

Например, следующее объявление scheme может помочь ПА определить, что значение свойства «identifier» — это код ISBN:

Значения атрибута scheme зависят от свойства name и ассоциированного profile .

Примечание. Существует образец профиля под названием Dublin Core (см. [DCORE]). Этот профиль определяет набор рекомендуемых свойств описаний электронной библиографии и предназначен для взаимодействия несоотносимых моделей описания.

7.5 Тело документа

7.5.1 Элемент BODY

Начальный тег: не обязателен, Конечный тег: не обязателен

background = uri [CT] Не рекомендуется. Значением атрибута является URI, обозначающий источник изображения. Изображение обычно используется для размножения и заполнения фона (для визуальных браузеров). text = color [CI] Не рекомендуется. Устанавливает цвет текста (для визуальных браузеров). link = color [CI] Не рекомендуется. Цвет непосещённых гиперссылок (для визуальных браузеров). vlink = color [CI] Не рекомендуется. Цвет посещённых гиперссылок (для визуальных браузеров). alink = color [CI] Не рекомендуется. Цвет гиперссылок при выборе пользователем (для визуальных браузеров).

Илон Маск рекомендует:  Dos fn 3ah удалить оглавление rmdir

Атрибуты, определённые в другом месте

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

НЕ РЕКОМЕНДУЕТСЯ:
Этот фрагмент HTML иллюстрирует использование не рекомендуемых атрибутов.
Здесь установлен белый цвет фона канвы, чёрный цвет текста, красный первоначальный цвет гиперссылок, фуксиновый при активации и коричневый после посещения.

Использование таблиц стилей приведёт к тому же результату:


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

Наборы фрэймов и тело документа HTML. Документы, содержащие набор фрэймов, замещают элемент BODY элементом FRAMESET . См. раздел фрэймы.

7.5.2 Идентификаторы элемента: атрибуты id и class

id = name [CS] Устанавливает имя элемента. Имя должно быть уникальным для данного документа. class = cdata-list [CS] Устанавливает имя класса или набор имён классов для элемента. Любому количеству элементов может быть назначено то же имя или имена класса. Множественные имена классов могут разделяться пробельными символами.

Атрибут id имеет несколько ролей в HTML:

  • переключатель таблиц стилей;
  • anchor/якорь назначения для гипертекстовых ссылок;
  • как значение для ссылки на конкретный элемент из скрипта;
  • как имя объявленного элемента OBJECT ;
  • для общих надобностей обработки в ПА (напр., для идентификации полей при извлечении данных из страниц HTML в базы данных, переводе документов HTML в другие форматы и т.п.).

Атрибут class одновременно назначает элементу одно или более имён классов; можно сказать, что элемент принадлежит данным классам. Имя класса может разделяться несколькими объектами элемента. Атрибут class имеет несколько ролей в HTML:

  • переключатель таблиц стилей (если автор захочет назначить информацию о стиле нескольким элементам);
  • для общих надобностей обработки в ПА.

В следующем примере элемент SPAN используется вместе с атрибутами id и class для разметки сообщений документа. Сообщения появляются в английской и французской версиях.

Следующие правила CSS (Каскадной Таблицы Стилей) могут сообщить визуальным ПА, что необходимо отобразить информационные сообщения зелёным цветом, предупреждения — жёлтым, а ошибки — красным:

Обратите внимание, что французское «msg1» и английское «msg1» не могут появляться в одном документе, поскольку они разделяют одно значение id . Авторы могут также использовать атрибут id для уточнения представления определённых сообщений, делать их якорями назначения и т.п.

Почти любому элементу HTML может быть назначен идентификатор и информация класса.

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

Установив в этом примере атрибут id , мы можем
(1) делать ссылки на класс и
(2) переопределять информацию стиля класса с помощью объекта информации стиля.

Примечание. Атрибут id разделяет то же пространство имён, что и атрибут name , когда используется для именования якоря. См. дополнительно раздел якоря с id .

7.5.3 Элементы инлайн и уровня блока

Некоторые элементы HTML, которые могут появляться в BODY , называются «элементы уровня блока», а другие — «inline/инлайн» (известные также как «text level/уровня текста»). Значение может быть выведено из нескольких понятий:

Модель содержимого Вообще, элементы уровня блока могут содержать инлайн-элементы и другие элементы уровня блока. Вообще, инлайн-элементы могут содержать только данные и другие инлайн-элементы. Сущностью этого структурного отличия является идея, что элементы блока создают более «широкие» структуры, чем инлайн-элементы. Форматирование По умолчанию элементы уровня блока форматируются иначе, нежели инлайн-элементы.
Как правило элементы уровня блока начинаются с новой строки, а инлайн-элементы — нет. Информацию о пробелах, разрывах строки и форматировании блоков см. в разделе о тексте. Направление (текста) По техническим причинам — включение двунаправленного текстового алгоритма [UNICODE], элементы уровня блока и инлайн различаются тем, как они наследуют информацию о направлении. См. детали в разделе наследование направления текста.

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

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

7.5.4 Группирование элементов: элементы DIV и SPAN

Начальный тег: необходим, Конечный тег: необходим

Атрибуты, определённые в другом месте

Элементы DIV и SPAN в сочетании с атрибутами id и class предоставляют общий механизм для добавления структуры к документу. Эти элементы определяют содержимое как инлайн ( SPAN ) или уровня блока ( DIV ), но не навязывают других идиом представления содержимого. Таким образом, авторы могут использовать эти элементы в сочетании с таблицами стилей, атрибутом lang и т.д. и приспособить HTML к выполнению нужных задач.

Предположим, например, что мы хотим сгенерировать документ HTML, на основе информации из базы данных клиента. Поскольку HTML не имеет элементов, идентифицирующих объект, таких как «client», «telephone number», «email address» и т.д., мы используем DIV и SPAN для достижения желаемого структурного эффекта и представления. Можно использовать элемент TABLE для структурирования информации:

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

Другие примеры использования см. в разделе атрибуты class и id .

Визуальные ПА обычно помещают разрыв строки перед и после элементов DIV , например:

что обычно отображается так:

7.5.5 Заголовки: элементы H1 , H2 , H3 , H4 , H5 , H6

Начальный тег: необходим, Конечный тег: необходим

Атрибуты, определённые в другом месте

Элемент heading кратко описывает смысл раздела, которому он предшествует. Информация заголовка может использоваться ПА, например, для автоматического создания оглавления документа.

Имеется шесть уровней заголовков HTML: от H1 (самый крупный/верхний) до H6 . Визуальные браузеры обычно отображают более значительный заголовок более крупным шрифтом.

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

Эта структура может быть украшена с помощью таблицы стилей:

Нумерованные разделы и ссылки.
HTML сам по себе не генерирует номера разделов в соответствии с заголовками. Это может, однако, выполняться некоторыми ПА. В ближайшем будущем языки таблиц стилей, такие как CSS, позволят авторам управлять генерацией заголовков разделов (что может пригодиться для создания ссылок в печатных документах (см. раздел 7.2).


Некоторые считают скрывание уровней заголовков плохой практикой. Они принимают H1 H2 H1 не принимают H1 H3 H1, поскольку во втором случае заголовок уровня H2 пропущен.

7.5.6 Элемент ADDRESS

Начальный тег: необходим, Конечный тег: необходим

Атрибуты, определённые в другом месте

Элемент ADDRESS может использоваться авторами для указания контактной информации в документе или в большой части документа, например, в форме. Этот элемент часто появляется в начале или в конце документа.

Например, страница на W3C Web-сайте, относящаяся к HTML, может содержать следующую контактную информацию:

Title

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

Элемент Title не является частью содержимого страницы – т.е. пользователи не видят его в основном контенте. Чаще всего с информацией из тега Title пользователь сталкивается в браузере и поисковой выдаче:

Какие задачи выполняет тег Title

  • Корректно заполненный тег Title является обязательным условием успешной поисковой оптимизации сайта, т.к. информацию из него поисковик берет при формировании сниппета сайта в результатах поиска. Часто пользователь выбирает сайт, ориентируясь именно на заголовок, который отображается в сниппете. Если пользователь видит информацию, которая соответствует его поисковому запросу, он с большей вероятностью перейдет на этот сайт.
  • Информация в теге Title помогает пользователю ориентироваться в открытых вкладках браузера и быстро находить нужную страницу.
  • При сохранении страницы сайта в закладки браузера, ей автоматом дается название, указанное в теге Title. При корректно указанном заголовке страницы пользователь впоследствии без труда найдет необходимый ему документ.

Как корректно заполнить тег Title

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

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

Тег Title используется на странице только один раз в блоке HEAD.

Содержание тега Title должно быть уникальным для каждой страницы сайта.

Рекомендуемая длина текста в теге Title – от 60 до 120 символов. Но стоит не забывать, что сниппет страницы в поисковой выдаче может отображать до 70 символов (включая пробелы), и лучше уложиться в эти рамки. В общем, чем короче и понятнее, тем лучше.

Текст тега Title должен кратко и максимально понятно описывать содержимое страницы. Также не стоит забывать о его релевантности основному тексту документа.

Ключевые слова стоит размещать в начале текста тега Title – это положительно сказывается на ранжировании страницы в поиске. Также пользователь скорее кликнет на текст, соответствующий его запросу.

В тексте тега Title нельзя просто перечислять одни и те же ключевые слова (даже в разных падежах), текст не должен быть бессмысленным.

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

Желательно использовать схожую структуру построения и стиль для тегов Title на страницах всего сайта.

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

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

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

Не нужно включать в текст тега Title не несущие дополнительной информации слова вроде «Добро пожаловать» и т.д.

Стоит отнестись с осторожностью к дополнительным символам, например, «=», «/», «!», «?», «*» и т.д., и по возможности их не использовать в тексте тега. Также не стоит использовать символы для украшения заголовка – они визуально перегружают текст и затрудняют его восприятие.

Существует мнение, что лучше избегать использования в title стоп-слов (и, о, или, я, к, до, не и т.д.), так как поисковые системы их всё равно игнорируют.

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

Рекомендуется использовать схожие ключевые слова в тегах Title и H1.

Синонимы: нет
Все термины на букву «T»
Все термины в глоссарии

Мета-тег title и его оптимизация

Тег title — это базовый элемент HTML-разметки, который в лаконичной форме демонстрирует пользователям и поисковым роботам основную смысловую и тематическую нагрузку страницы.

Отображение тайтла происходит в следующих случаях:

сниппет в поисковой выдаче,

заголовок страницы в браузере,


при перепосте ссылки на страницу в социальных сетях.

Если говорить о программном коде страницы, то title прописывается в рамках тега .

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

Основные требования к заполнению тега title

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

Можно выделить следующие требования к заполнению тега title.

Длина тайтла должна составлять 50–75 символов, больше просто не отображается в выдаче. Если тег будет больше, то поисковая система его учтет, но делать слишком длинные описания с переспамом ключевых слов не только бессмысленно, но и вредно.

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

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

Не допускается простое копирование тега H1.

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

Нельзя «заимствовать» тайтлы у конкурентов — все поисковые системы крайне негативно относятся к плагиату.

Написание title на практике

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

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

Илон Маск рекомендует:  Тег table

Состав тайтла для разделов и остальных страниц напрямую привязан к их тематике и содержанию. Кроме ключевых слов, сюда можно включить слова, которые привлекают внимание: «фото», «отзывы», «скидка», «бесплатная доставка» и др.

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

Основные ошибки при написании тега title:

не соответствие содержания структуре и семантике;

использование прилагательных с общим значением или в сравнительной степени: «лучший», «самый лучший», «выгодный» и др.;

расположение названия бренда в начале (допустимо только для известных в офлайне компаний);

простое перечисление запросов разного уровня;

перечисление нескольких городов;

попытка привлечь внимание верхним регистром букв.

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

HTML. Лекция 2. Структура HTML-документа и элементы разметки заголовка документа.

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

HTML-документ — это один большой контейнер, который начинается с тега и заканчивается тегом :

Контейнер HTML или гипертекстовый документ состоит из двух других вложенных контейнеров: заголовка документа (HEAD) и тела документа (BODY). Рассмотрим простейший пример классического документа.

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

Назначение заголовка

Заголовок HTML-документа является необязательным элементом разметки. В HTML 2.0 предлагалось вообще отказаться от элементов HEAD и BODY. В то время в HTML не было элементов, которые использовались одновременно и в заголовке, и в теле документа. Современная практика HTML-разметки такова, что почти в каждом документе есть HTML-заголовок.

Первоначально существование заголовка определялось необходимостью именования окна браузера. Это достигалось за счет элемента разметки TITLE:

Отображение содержания элемента TITLE

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

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

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

Реализация такого сорта ссылок уже давно является частью проектов W3C (Arena, Amaya). В коммерческих браузерах такой механизм реализован только для описателей стилей (элемент разметки LINK).

Важную роль заголовок HTML-документа играет в JavaScript. Существует принципиальная разница между заголовком и телом документа при использовании элемента разметки SCRIPT. Она заключается в определении зоны видимости функций и переменных. Переменные и функции, определенные в заголовке документа, относятся ко всему окну браузера. Это значит, что к ним можно обратиться из любого места документа и изменить их значения. Кроме того, к ним можно обратиться из другого окна или фрейма. Фактически, это глобальные переменные. При работе с многослойными документами переменные и функции тела относятся к слоям, что делает доступ к ним неудобным.


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

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

Основные контейнеры заголовка

Основные контейнеры заголовка — это элементы HTML-разметки, которые наиболее часто встречаются в заголовке HTML-документа, т.е. внутри элемента разметки HEAD.

Мы рассмотрим только восемь элементов разметки, включая сам элемент разметки HEAD:

  • HEAD (элемент разметки HEAD);
  • TITLE (заглавие документа);
  • BASE (база URL);
  • ISINDEX (поисковый шаблон);
  • META (метаинформация);
  • LINK (общие ссылки);
  • STYLE (описатели стилей);
  • SCRIPT (скрипты).

Чаще всего применяются элементы TITLE, SCRIPT, STYLE. Использование элемента META говорит об осведомленности автора о правилах индексирования документов в поисковых системах и возможности управления HTTP-обменом данными. BASE и ISINDEX в последнее время практически не применяются. LINK указывают только при использовании внешних относительно данного документа описателей стилей.

Элемент разметки HEAD

Элемент разметки HEAD содержит заголовок HTML-документа. Данный элемент разметки не является обязательным. При наличии тега начала элемента разметки желательно использовать и тег конца элемента разметки. По умолчанию элемент HEAD закрывается, если встречается либо тег начала контейнера BODY, либо тег начала контейнера FRAMESET. Атрибутов у тега начала контейнера нет, хотя в DTD HTML один необязательный атрибут прописан. Синтаксис контейнера HEAD в общем виде выглядит следующим образом:

Контейнер заголовка служит для размещения информации, относящейся ко всему документу в целом. Необязательный атрибут PROFILE указывает на внешний файл META-тегов. В качестве значения этого атрибута указывается URL данного файла.

Элемент разметки TITLE

Элемент разметки TITLE служит для именования документа в World Wide Web. Более прозаическое его назначение — именование окна браузера, в котором просматривается документ. Состоит контейнер из тега начала, содержания и тега конца. Наличие тега конца обязательно. Тег начала элемента не имеет специфических атрибутов.

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

Такой механизм на современных компьютерах не работает. При этом следует учитывать, что в отличие от реализации «бегущей» строки средствами JavaScript, лидирующие пробелы в заголовке игнорируются.

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

Синтаксис контейнера TITLE в общем виде выглядит следующим образом:

Заголовок не является обязательным контейнером документа. Его можно опустить. Роботы многих поисковых систем используют содержание элемента TITLE для создания поискового образа документа. Слова из TITLE попадают в индекс поисковой системы. Из этих соображений элемент TITLE всегда рекомендуется использовать на страницах Web-узла.

Элемент разметки BASE

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

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

В этом случае в качестве базы по умолчанию выбирается каталог, в котором размещен HTML-документ (../). Такой стиль разметки удобен тем, что при переносе всего дерева документов в другое место не потребуется менять систему гипертекстовых ссылок внутри документов. Кроме того, распространению этого стиля способствует и сама архитектура World Wide Web. Наиболее тесные связи между документами задаются только в рамках одного Web-узла. Связей данного узла с остальными существенно меньше, и их можно прописать непосредственно в ссылках в полной форме.

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

Наиболее часто BASE встречается на страницах узлов, которые имеют «зеркала». Часть документов основного сервера по разным причинам на «зеркальный» сервер не переносится. В этом случае документ с принудительно заданным базовым URL всегда будет ссылаться на основной сервер. Он оказывается «белой вороной» среди прочих документов Web-узла. При этом такая схема часто используется вместе с запретом на кэширование данного документа как клиентом (браузером), так и proxy-серверами.

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

Базовый адрес: http://uspu.ru/cgi-bin/script/uspu.ru

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

Возможность определения мишени загрузки позволяет не указывать атрибут TARGET в теге начала контейнера A (anchor):

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

Особенно полезен атрибут TARGET на страницах с вызовом скриптов, если результат работы скрипта нужно загрузить в определенное окно (фрейм).

Тег начала контейнера содержит один обязательный атрибут HREF, и может содержать один необязательный атрибут TARGET. Синтаксис контейнера BASE в общем виде выглядит следующим образом:

Применение BASE в современных документах ограничено в силу разных причин. В сложных случаях можно пользоваться указаниями URL в полной форме.

Элемент разметки ISINDEX

Элемент разметки ISINDEX используется для указания поискового шаблона и унаследован от ранних версий HTML. В HTML 4.0 этот контейнер не определен. Утрата данного контейнера объясняется широким применением форм и CGI-скриптов. Тем не менее все браузеры его поддерживают.

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

Применение элемента ISINDEX

В классическом варианте при использовании ISINDEX список ключевых слов, которые вводятся в поисковом шаблоне и разделены символом «+», присоединяется к базовому адресу HTML-документа после символа «?».

Очевидно, что сам HTML-документ не способен выполнить поиск. Это может сделать только поисковая программа.

Присоединение запроса к документу унаследовано от первого сервера CERN (Conseil Europeen pour la Recherche Nucleaire, Европейская организация по ядерным исследованиям), в котором оно использовалось по аналогии с поисковыми серверами Gopher. Современный подход, основанный на HTML-формах, позволяет указывать URL поисковой программы, что дает большую свободу при разметке страниц.


Современный синтаксис ISINDEX позволяет применить аналогичный формам подход. Для этой цели в теге начала контейнера ISINDEX можно указать атрибут ACTION.

Однако и традиционная форма контейнера позволяет обращаться к внешним CGI-скриптам. Сделать это можно либо в совокупности с контейнером BASE, либо с использованием SSI.

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

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

Тег начала элемента может содержать два необязательных атрибута: ACTION и PROMPT. Синтаксис элемента ISINDEX в общем виде выглядит следующим образом:

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

Применение атрибута PROMPT

ISINDEX — отмирающий элемент разметки. Однако он определил формат обмена данными ISINDEX. Данные в этом формате передаются от браузера серверу в случае применения ISINDEX и в случае прямого указания дополнительных параметров после символа «?» в гипертекстовой ссылке.

Элемент разметки META

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

Впервые контейнер META был задействован при принудительной перезагрузке документа браузером через заголовок HTTP-сообщения. В заголовке HTTP-сообщения можно указать оператор refresh. Время, заданное как параметр этого оператора, определяет интервал в секундах, после которого браузер загружает документ, определенный атрибутом URL данного оператора. Впервые этот механизм был реализован на сервере CERN, но наибольшую популярность приобрел при использовании сервера WN (Web-сервер, который был разработан для платформы Linux).

В контейнере META подобный механизм реализуется следующим образом:

В данном случае через одну секунду после загрузки документа браузер должен инициировать загрузку страницы refresh.htm.

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

Заглавная буква «Х» в слове «refreshX.htm» — это цифра номера кадра. На странице нулевого кадра в этом месте следует указать на первый кадр (refresh1.htm), на странице первого кадра — на второй (refresh2.htm) и т.д.

В Windows 95 и Windows NT 4.0 с поддержкой таблиц UNICODE появилась возможность указывать тип кодировки документа — CHARSET. К сожалению, на многих Unix-платформах этот механизм не работает, что часто приводит к ошибкам, например в IRIX версий 6.2-6.4. Скептическое отношение поклонников Unix к этой возможности ничем не подкреплено, так как основная масса пользователей российской части Internet просматривает документы World Wide Web в Windows. Для перекодировки на стороне клиента (документ подготовлен в кодировке cp1251) в заголовок документа необходимо включить META-тег следующего вида:

Илон Маск рекомендует:  Предварительный обзор HTML5

Приведенный выше пример показывает, как используются операторы заголовка HTTP-сообщения. Однако здесь тоже следует быть осторожным. Большинство российских Web-узлов используют в качестве HTTP-сервера Russian Apache. Эта модификация сервера поддерживает перекодировку документов «на лету» для правильного отображения на стороне клиента. Russian Apache сам вставляет в HTTP-заголовок (не путать с HEAD) директиву Content-type. Если в документе будет META-элемент c указанием типа кодировки, а Apache перекодировал содержание, то возможно несоответствие между указанным в META типом кодировки и реальной кодировкой содержания документа.

Кроме Content-type, можно указать и другие операторы. Например, запретить кэширование документа. Необходимость в этом возникает при частом обновлении документа или наличии в нем изменяющихся SSI-вставок. Для запрета кэширования достаточно вставить в заголовок META-тег вида:

Pragma — это наследие HTTP 1.0. В новой версии протокола HTTP (HTTP 1.1) управление кэшированием осуществляется через оператор Cache-Control. Для получения такого же эффекта, как в случае с Pragma, в заголовке HTML-документа достаточно указать:

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

Точно так же можно задать время последней модификации (Last-Modified) или дату истечения актуальности документа (Expire).

С появлением роботов поисковых машин на META-тег была возложена еще одна функция — описание поискового образа документа. Наиболее последовательно это было впервые реализовано в Webcrawler. До этого в качестве поискового образа документа использовался либо весь список слов документа, либо слова первого абзаца.

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

При индексировании такого документа содержимое контейнера TITLE и атрибутов CONTENT контейнеров META после фильтрации попадет в индекс поисковой машины и может быть использовано для составления запросов. Процесс фильтрации отбракует так называемые stop-слова и общие слова. Они не попадут в индекс поисковой машины. В частности, будут отбракованы предлоги или, если речь идет о тематическом поисковом индексе, например по технологиям World Wide Web, то в него не попадут: web, Web-технология и т.п.

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

Практика показывает, что при индексировании можно указывать одновременно и атрибут NAME, и атрибут HTTP-EQUIV с одинаковыми значениями. Это связано с тем, что одни роботы индексирования анализируют содержание META-элемента по атрибуту NAME, а другие — по атрибуту HTTP-EQUIV.

Элемент разметки LINK – это результат давно предпринятой попытки придать HTML академический вид. Согласно теории гипертекстовых систем, все гипертекстовые связи разделяют на два типа: контекстные и общие. Такое деление чисто условное и определяется тем, что контекстную связь можно привязать к определенному месту документа, а общую — отнести только ко всему документу целиком. Если взглянуть на проблему связи чуть шире, то очевидной становится аналогия с отношениями. Гипертекстовая связь задает отношение на множестве информационных узлов.

Контекстная связь определяет отношение на паре узлов. При этом в модели World Wide Web один из узлов является источником, а второй — мишенью. Собственно, это и отражено в названии элемента разметки A (anchor), который определяет гипертекстовую ссылку (не путать с гипертекстовой связью). При этом в контекстной связи один и тот же термин может идентифицировать разные связи. Например, в контексте содержания конспекта данной темы слово «HEAD» определяет документ head.htm, который описывает контейнер HEAD и особенности его применения, а в контексте справочника по данной теме слово «HEAD» будет означать ссылку на описание синтаксиса этого контейнера.

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

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

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

Существенный сдвиг в этом направлении произошел после реализации поддержки описателей стилей в Netscape Navigator и Internet Explorer четвертых версий. CSS (Cascade STYLE Sheets, каскадные таблицы стилей) позволяют определять для различных типов гипертекстовых связей вид гипертекстовых ссылок. При этом можно определять различные типы контекстных ссылок. Кроме того, впервые нашел осмысленное применение контейнер LINK. Он позволил загружать внешние описатели стилей:

В данном случае речь идет о загрузке стилей из файла style.css. При этом стили задаются в нотации W3C, а не JavaScript, что определяется атрибутом TYPE. В сущности, атрибут REL определяет тип гипертекстовой связи, HREF (Нуреrtехt REFerence) указывает адрес документа, идентифицирующего связь, а атрибут TYPE определяет тип содержания этого документа.

В общем случае контейнер LINK имеет следующий вид:

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

Элемент разметки STYLE

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

В настоящее время контейнер используется только с одним атрибутом TYPE, который задает тип описателя стиля. Это может быть либо text/css , либо text/javascript. Если элемент разметки открыт тегом начала, то он должен быть закрыт тегом конца. В общем виде запись элемента STYLE выглядит так:


Применению стилей в HTML-разметке, а также проектированию Web-узлов с применением CSS посвящена отдельная глава «Применение каскадных таблиц и стилей».

Элемент разметки SCRIPT

Элемент разметки SCRIPT служит для размещения кода JavaScript, VBScript или JScript. Вообще говоря, SCRIPT можно использовать не только в заголовке документа, но и в его теле. В отличие от контейнера STYLE, ему не требуется дополнительный контейнер LINK для загрузки внешних файлов кодов. Это можно сделать непосредственно в самом контейнере SCRIPT:

Существует несколько скриптовых языков: JavaScript, VBScript, JScript. По умолчанию подразумевается JavaScript.

) создает эффект, а закрывающий (

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

Кроме того теги подразделяют на несколько типов, которое различаются по выполняем функциям:

• теги верхнего уровня;

• теги заголовка документа;

Это разделение не строгое, поэтому некоторые теги находятся в разных группах. Например, тэги для создания списков

    и
      относятся и к спискам, и к блочным элементам.

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

Понятие АТРИБУТЫ — это дополнительные ключевые слова, свойства, отделенные от основного ключевого слова тега и один от друга символами пробела, которые могут иметь значения (стандартные или устанавливаемые авторами или сценариями).

Атрибуты бывают глобальными и специфическими. Глобальные атрибуты можно задавать любым HTML элементам, при этом они делятся на основные атрибуты(class, id, style) и атрибуты событий(onclick, onkeydown).

Для некоторых атрибутов следует задавать значение, которое отделяют от имени атрибута символом «=» (знак равентсва). Значение атрибута берут в кавычки, но во многих случаях их можно и не ставить. Закрывающих тегов атрибуты не содержат.

Примеры тегов с атрибутами:

Также бывают атрибуты (например, для тега , определяет его тип), w .

Атрибуты необходимы для сообщения браузеру дополнительной информации о выводе содержимого элемента. Например, атрибут COLOR отвечает за цвет элемента на странице. В атрибутах хранятся имена выводимых картинок, URL-адреса для ссылки и так далее. Атрибут всегда указывается после имени тега в виде пары ИМЯ_АТРИБУТА=”значение” через пробел. Если используется несколько атрибутов, они указываются через пробел.

По умолчанию в SGML необходимо, чтобы все значения атрибутов былиразделеныс помощью двойных (десятичный код ASCII 34) или одинарных кавычек (десятичный код ASCII 39). Рекомендуется всегда использовать кавычки.

Имена атрибутов всегдаучитывают регистр.

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

Понятие РАЗМЕТКИ — при создании разметки и оформлении страницы, ее разделяет на отдельные функциональные части. Разметка страницы веб-сайта подразумевает выделение таких блоков:

шапка сайта (header)

боковые колонки (sidebar)

подвал сайта (footer)

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

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

Страница также может содержать информационные блоки — список новостей, последние обновления, популярное, акции.

Для создания разметки страницы можно использовать таблицу

(табличная верстка), блоки

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

Структура html-документа состоит из трех пар тегов

Азбука W€B

Секрет твоего успеха

2. Заголовки

Элемент

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

Заголовок может содержать в себе следующие элементы:

  • название документа (элемент >);
  • полный URL документа (элемент base> );
  • управляющую информацию (элемент(ы) >);
  • список ссылок (элемент
  • );
  • описание стилей (элемент >);
  • задание скриптов (элемент

Рубрики

Домены РФ, RU


Проверенный хостинг для Drupal

№1 для небольших сайтов
— за 85 р.: 2 000 Мб HDD,
— 7 дней бесплатно.

Идеальный Хостинг
33 Гб на SSD всего 199 р. в мес.
ОЗУ: 1024 MB DDR4
Это, практически, безлимитка.
Тест 20 дней бесплатно. Самое лучшее предложение из всего, что доводилось видеть.

Просто бесплатный хостинг. HDD = 2 Гб, ОЗУ = 128 Мб. Несколько месяцев тестирую, подвохов не обнаружил.

HTML Урок 25 Элементы Заголовка

Попробуйте сами — Примеры

Заголовок документа
Тег определяет заголовок документа.

Одно назначение (target) для всех ссылок
Как использовать тег base, чтобы все ссылки на странице открывались в новом окне.

HTML Элемент head

Элемент head — это контейнер для всех head-элементов (т.е. «головных» элементов или элементов заголовка, идущих вначале HTML документа). Элементы внутри включают скрипты, инструктируют браузер, где искать таблицы стилей, обеспечивают meta-информацию (вспомогательную информацию, описание страницы), и так далее.

Следующие теги могут быть добавлены в head-секцию: , ,
, ,

Элемент TITLE

Начальный тег: необходим, Конечный тег: необходим

Атрибуты, определённые в другом месте

lang (язык), dir (направление текста)

Каждый документ HTML обязан элемент TITLE

Авторы должны использовать элемент TITLE для идентификации содержимого документа. Поскольку пользователи часто обращаются к документам вне контекста, авторы должны предоставлять осмысленные заголовки. Таким образом, вместо такого заголовка, как «Introduction», который не даёт достаточно информации о документе, авторы должны записать, например, так: «Introduction to Medieval Bee-Keeping».

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

TITLE доступным для пользователя (включая элемент TITLE

Конкретный механизм выполнения этого зависит от ПА (т.е. заглавие, фраза).

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

Вот пример заголовка:

A study of population dynamics . другие элементы «шапки».

Основные атрибуты элемента BODY

Background Задаёт фоновое изображение URL background=»image1.gif»

Bgcolor Задаёт цвет фона цвет Bgcolor=»white»

Text Задаёт цвет текста документа цвет Text=»white»

Link, vlink, alink Задаёт цвет обычных, посещённых, активных ссылок цвет link=»blue»

Пример элемента BODY.

Здесь будут располагаться остальные элементы HTML кода

Этот код задаёт белый цвет для фона страницы. Фоновое изображение берётся из файла image.gif, который находится в том же каталоге, что и основной HTML документ. Цвет текста устанавливается чёрным. Цвет простых ссылок — красный, цвет активных ссылок (при щелчке мыши на ссылке) — синий, а цвет посещённых ссылок (ссылки на странице, которые вы уже посетили) — пурпурный.

Примечание: Цвета можно задавать тремя способами:

C помощью ключевых слов:black, white, red и т.д..

Шестнадцатеричным кодом цвета в полной форме (#00FFCC, #000000) или сокращением (#0FC, #000).

Десятичным кодом в модели RGB. Например: rgb(255.255.0)

Элемент head — заголовок документа

Содержит служебную информацию документа: название документа, ключевые слова, информацию о кодировке.

Внутри элемента head могут содержаться следующие элементы:

— позволяет задать базовый адрес (url) для всего документа.

— позволяет установить шрифт для документа.

— устанавливает связи с другими элементами.

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

Понравилась статья? Поделиться с друзьями:
Кодинг, CSS и SQL