Создание статического содержания. HTML

2.1.4. Другие элементы языка HTML

В последних версиях HTML практически у каждого тега огромное число необязательных параметров – обычно не меньше 15. Приведем только основные параметры тегов [2,23].

Текстовые блоки

• <BR> – новая строка. Этот тег не закрывается (то есть не существует тега </BR> );
• <HR> – горизонтальная линия;
• <BLOCKQUOTE> … </BLOCKQUOTE> – цитата (обычно текст сдвигается вправо);
• <PRE> … </PRE> – режим preview. В этом режиме текст заключается в рамку и никак не форматируется (то есть теги, кроме </PRE>, игнорируются, и переводы строки ставятся там, и только там, где они есть в оригинальном документе). Форматирование текста
• <EM> … </EM> – логическое ударение (обычно отображается курсивным шрифтом );
• <STRONG> … </STRONG> – усиленное логическое ударение (обычно отображается жирным шрифтом );
• <I> … </I> – выделение текста курсивом;
• <B> … </B> – выделение текста жирным шрифтом;
• <U> … </U> – подчеркивание текста;
• <S> … </S> – зачеркивание текста;
• <STRIKE> … </STRIKE> – то же самое, что <S> … </S> ;
• <BIG> … </BIG> – увеличение шрифта;
• <SMALL> … </SMALL> – уменьшение шрифта;
• <SUB> … </SUB> – _{подстрочный текст};
• <SUP> … </SUP> – ^{надстрочный текст};
• <FONT параметры> … </FONT> – задание параметров шрифта:
  • COLOR=color – задание цвета (в шестнадцатеричной форме или названием);
  • FACE=шрифт меняет шрифт;
  • SIZE=размер меняет размер шрифта (от 1 до 7, стандартный по умолчанию 3);
  • SIZE=+размер или SIZE=-размер – размер задается по сравнению со стандартным.

Объекты

• EMBED – вставка различных объектов: не- HTML документов и media-файлов;
• APPLET – вставка Java-апплетов.

Формы

Создание форм в HTML является довольно сложным делом. Здесь приводятся только названия основных тегов.

• FORM – создание формы;
• INPUT – элемент ввода (может иметь разные функции – от ввода текста до отправки формы);
• TEXTAREA – текстовая область (многострочное поле для ввода текста);
• SELECT – список (обычно в виде выпадающего меню);
• OPTION – пункт списка.

2.1.5. XHTML

XHTML (Extensible Hypertext Markup Language, расширяемый язык разметки гипертекста) – язык разметки веб-страниц, по возможностям сопоставимый с HTML, созданный на базе XML [23]. Как и HTML, XHTML соответствует спецификации SGML, поскольку XML является ее подмножеством. Вариант XHTML 1.1 одобрен в качестве Рекомендации Консорциума Всемирной паутины ( W3C ) 31 мая 2001 года.

Стандарт XHTML построен не как самодостаточное описание языка, а как перечень различий между HTML 4.01 и XHTML [2]:

• Все элементы должны быть закрыты. Теги, которые не имеют закрывающего тега (например, <img> или <br> ) должны иметь на конце / (например, <br /> ).
• Булевы атрибуты записываются в развернутой форме. Например, следует писать <option selected="selected"> или <td nowrap="nowrap">.
• Имена тегов и атрибутов должны быть записаны строчными буквами (например, <img alt="" /> вместо <IMG ALT="" /> ).
• XHTML гораздо строже относится к ошибкам в коде; < и & везде, даже в URL, должны замещаться &lt; и &amp; соответственно. По рекомендации W3C браузеры, встретив ошибку в XHTML, должны сообщить о ней и не обрабатывать документ. Для HTML браузеры должны были попытаться понять, что хотел сказать автор.
• Кодировкой по умолчанию является UTF-8 (в отличие от HTML, где кодировкой по умолчанию является ISO 8859-1).

Для XHTML страниц рекомендуется задавать MIME-тип – application/xhtml+xml, но это не является обязательным, более того – браузер Internet Explorer 8 и младшие версии, не смогут обрабатывать страницу, поэтому с XHTML 1.0 традиционно используется MIME-тип для HTML – text/html.

Версии XHTML:

• XHTML 1.0 Переходный (Transitional): предназначен для легкой миграции из HTML 3.2 и для тех, кто использует инлайн-фрэймы.
• XHTML 1.0 Строгий (Strict): полностью отделяет содержание документа от оформления (которое теперь задается только через CSS), многие атрибуты (такие как, например, bgcolor и align) более не поддерживаются, их поведение можно задавать только через таблицу стилей.
• XHTML 1.0 Фрэймовый (Frameset): используется, если необходимо разделить окно браузера на несколько фрэймов.
• XHTML 1.1 Модульный (Module-based): авторы могут импортировать дополнительные свойства в их разметку.
• XHTML Основной (Basic): специальная облегченная версия XHTML для устройств, которые не могут использовать полный набор элементов XHTML – в основном используется в миниатюрных устройствах, таких как мобильные телефоны. Подразумевается, что он заменит WML и C-HTML.
• XHTML мобильного профиля (Mobile Profile): основанный на XHTML Basic, добавляет специфические элементы для мобильных телефонов.
• XHTML 2.0. Пока в разработке. Синтаксис еще больше приближен к синтаксису XML. Также является модульным языком.

Валидным (т. е. отвечающим всем правилам) XHTML -документом считается документ, удовлетворяющий технической спецификации [24]. В идеале, все браузеры должны следовать веб-стандартам и, в соответствии с ними, валидные документы должны отображаться во всех браузерах на всех платформах. Валидация XHTML -документа рекомендована даже, несмотря на то, что она не гарантирует кросс-браузерности. Документ может быть проверен на соответствие спецификации с помощью онлайновой Службы валидации разметки W3C. Валидация обнаружит и разъяснит ошибки в XHTML -разметке.

Валидный документ должен содержать определение типа документа ( DTD ). DTD должен быть расположен до всех других элементов документа. Вот наиболее распространенные типы DTD для XHTML:

XHTML 1.0 Strict

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

XHTML 1.0 Transitional

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

XHTML 1.0 Frameset

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

XHTML 1.1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

Самыми распространенными ошибками в XHTML -разметке являются:

• Незакрытые элементы ( XHTML, в отличие от HTML, требует закрытия всех элементов, в том числе не имеющих закрывающего тега, как, например, <br /> ).
• Отсутствие альтернативных текстов для изображений (достигающийся применением атрибута alt, который помогает сделать документы доступнее для устройств, которые не в состоянии отображать изображения, или предназначенных для слабовидящих людей).
• Присутствие текста непосредственно в теге <body> документа (должен быть объявлен блочный элемент, внутрь которого следует помещать содержимое).
• Вложение блочных элементов внутрь инлайновых (внутристрочных) (например, блочные элементы <div> или <p> не могут быть вложены внутрь инлайновых элементов <a>, <span>, <em> и так далее).
• Пренебрежение заключением значений атрибутов в кавычки ( <a href=http://www.ru/> вместо <a href="http://www.ru/"> ).
• Неправильное вложение элементов (конструкции вида <strong> <em> </strong> </em> ).
• Неправильное использование ссылок-мнемоник (например, & вместо &amp; )
• Написание тегов и/или атрибутов прописными буквами ( <DIV STYLE="…"> вместо <div style="..."> ).
• Задание в теге <!DOCTYPE …> относительного пути к DTD -файлу, скопированного с сайта www.w3.org ( "DTD/xhtml11.dtd" вместо "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd" ).

Валидный XHTML -документ можно снабжать специальным баннером W3C, подтверждающим валидность XHTML -разметки.

2.1.6. Ключевые термины

HTML, Веб-браузер, W3C, Теги, DTD, Заголовок документа, Метатеги, Теги <LINK>, <title>, <SCRIPT>, Тело документа, Теги <DIV>, <TABLE>, <H1>, <A>, <IMG>, <SPAN>, Маркированные списки, Параграфы, XHTML.

2.2. Краткие итоги

HTML – стандартный язык разметки документов во Всемирной паутине.

Текстовые документы, содержащие код на языке HTML (такие документы традиционно имеют расширение .html или .htm ), обрабатываются специальными приложениями, которые отображают документ в его форматированном виде, называемые "браузерами" или "интернет-обозревателями".

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

Теги бывают одиночными и парными (контейнеры).

Обычные веб-страницы состоят из двух разделов – заголовка ( <HEAD> ) и тела документа ( <BODY> ). Раздел заголовка может содержать текст и теги, но содержимое этого раздела не показывается напрямую на странице. Тело документа предназначено для размещения тегов и содержательной части.

DTD – язык описания структуры SGML-документа. DTD на HTML -странице задается с помощью <!DOCTYPE>, которые различаются в зависимости от версии HTML, на которую ориентированы.

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

Тег <TITLE> используется для отображения заголовка документа (строки текста) в левом верхнем углу окна браузера.

Тег <LINK> устанавливает связь с внешним документом вроде файла со стилями или со шрифтами.

Тег <SCRIPT> предназначен для описания скриптов, может содержать ссылку на программу или ее текст на определенном языке.

Элемент <DIV> является блочным элементом и предназначен для выделения фрагмента документа с целью изменения вида содержимого.

Для добавления таблицы на веб-страницу используется тег -контейнер <TABLE>.

На строке 24 (а также 57) находится тег заголовка <H1> ( <H2> ).

Заголовки обозначаются тегами <H1>, <H2>,…, <H6>.

На строке 25 (а также в других местах) находится тег ссылки <A>.

Для создания ссылки используется тег <A>, сообщающий браузеру, что текст, заключенный в него, является ссылкой, а также указывающий адрес документа, на который следует сделать ссылку.

Для установки маркированного списка используются теги <UL> и <LI>.

Блоки текста разделяют между собой абзацами ( параграфами ) с помощью тега <p>.

Для встраивания изображения в документ используется тег <IMG>.

Тег <SPAN> предназначен для определения встроенных элементов документа.

XHTML – язык разметки веб-страниц, по возможностям сопоставимый с HTML, созданный на базе XML.