Спонсор: Microsoft
Вы можете этот курс.
Волгоградский государственный университет
Опубликован: 02.03.2009 | Доступ: свободный | Студентов: 1518 / 187 | Оценка: 4.20 / 4.03 | Длительность: 16:55:00
Специальности: Разработчик интернет-проектов
Теги:
Лекция 2:
Язык гипертекстовой разметки HTML
Аннотация: Лекция посвящена языку гипертекстовой разметки HTML, а также его преемнику – языку XHTML. Рассказывается о спецификации HTML, структуре HTML-документа. Дается понятие элементов и тегов, их параметров. Рассказывается, как осуществляется форматирование текста, какие теги при этом применяются, как они действуют. Рассказывается, как на языке HTML можно организовать списки и гиперссылки, описать изображения, создать таблицы. Дается понятие форм, для чего они предназначены и каков их синтаксис.
Ключевые слова: ПО, HTML, Web, w3c, затраты, XHTML, extensible, hypertext markup language, язык разметки, гипертекст, SGML, XML, мобильный телефон, синтаксис, каскадная таблица стилей, css, определение типа документа, DTDS, definition, transition, deprecated, закрывающий тег, strictness, frameset, document type definition, D-AMPS, перевод строки, 'compact', альтернативный синтаксис, мнемоника символа, объектная модель документа, document object model, applet, i-frame, идентификатор фрагмента, корневой элемент, doctype, текстовый файл, символ конца строки, tagged, attribute, noframes, Bookmark, Заголовок документа, rev, TOC, copyright, glossary, TOE, publishing, owner, Поисковый система, keyword, robotically, vbscript, 'inline', em, samp, face, justify, pre, структурный тип, abbr, emphasis, samples, keyboard, SPAN, спецсимвол, 'quotes', поле, маркированный список, term, ссылка, anchor, адрес, браузер, слово, группа, параметр, указатель, полный путь, относительная адресация, текущий каталог, анкер, скорость передачи, растровая графика, файл, место, атрибут, загрузка, альтернативный текст, tooltip, полное имя, логотип, графика, сайт, цвет фона, пользователь, значение, цвет текста, представление, BODY, имя файла, GIF, JPEG, JPG, пространство, произвольное, вложенная таблица, таблица, table row, ячейка, table, Data, table header, caption, метка, высота, отображение, объект, space, пробел, фрейм, разбиение, информация, контейнер, поддержка, netscape, CGI, S/MIME, multipurpose, internet mail, подтип, медиана, html-форма, специальный тип данных, код символа, textarea, URL-кодирование, строка запроса, переменная среды, QUERY_STRING, стандартный ввод, конфиденциальная информация, browsing, маршрутное имя, checkbox, член группы, скрытое поле, radio, возврат каретки
Спецификации HTML
Работа по созданию спецификации HTML ведется организацией World Wide Web Consortium (сокращенно — W3C).
В настоящее время существуют спецификации 2.0, 3.0, 3.2 и 4.0.
В спецификации HTML 4.0 ключевой идеей стало отделение описания структуры документа от описания его представления на экране монитора. Разделение структуры и представления документа уменьшает затраты на поддержку широкого спектра платформ, сред и т. п., а также облегчает внесение исправлений в документы. В соответствии с этой идеей следует шире пользоваться методами описания представления документа с помощью таблиц стилей, вместо того, чтобы задавать конкретные данные о форме представления вперемешку с содержанием документа. Для реализации этой идеи в спецификации HTML 4.0 ряд тэгов, используемых для непосредственного задания формы представления HTML-элементов, отменены.
Страница Web должна включать начальные строки кода для указания соответствия стандарту, применяемому к странице.
XHTML
XHTML (англ. Extensible Hypertext Markup Language — Расширяемый язык разметки гипертекста) — язык разметки web-страниц, по возможностям сопоставимый с HTML, однако предъявляющий более строгие требования к синтаксису.
Как и HTML, XHTML является подмножеством языка SGML, однако XHTML, в отличие от предшественника, соответствует спецификации XML.
XHTML является преемником HTML. Потребность в более строгой версии HTML возникла из-за того, что содержимое web-страниц сегодня всё больше становится ориентированным на нетрадиционные виды устройств (например, мобильные телефоны), в которых зачастую ограничены ресурсы, в том числе и для обработки гибкого, нетребовательного HTML (чем свободнее синтаксис языка, тем сложнее его разбирать).
В настоящее время существует две спецификации языка XHTML – XHTML 1.0 и XHTML 1.1.
Практически все современные браузеры поддерживают XHTML. Он также совместим и со старыми браузерами, т. к. в основе XHTML лежит HTML.
Использование XHTML в сочетании с каскадными таблицами стилей CSS позволяет отделить оформление документа от его содержимого.
Версии XHTML и соответствующие им DTD
Существуют три версии стандарта XHTML 1.0. Модель содержания документа, закрепленная стандартом, устанавливает, что может быть включено в элемент документа. Для каждого элемента она описывается в определении типа документа (DTD – Document Type Definition). Правильный XHTML-документ должен содержать определение типа документа. DTD должен быть расположен до всех других элементов документа Тремя DTD соответствия для этих версий являются:
- XHTML 1.0 Переходный (Transitional): Идея создания переходного варианта языка для типизированных документов возникла при разработке версии HTML 4.0 и была направлена на выполнение следующего правила: элементы представления и сопутствующие им атрибуты в документах становятся устаревшими (deprecated). Для достижения аналогичного результата существуют другие, более эффективные методы. Применение тэгов и их атрибутов корректно в рамках переходной версии языка. Отличия переходного XHTML от HTML незначительны и предназначены лишь для приведения его в соответствие с XML. Самое главное требование заключается в том, чтобы все тэги были правильно вложены и семантически развиты. Кроме того, в XHTML все теги должны записываться строчными буквами, все атрибуты (включая численные) должны быть заключены в кавычки (что не является обязательным в SGML (и, следовательно, в HTML), где кавычки не требуются для чисел и некоторых символов, включая все буквы). Также все элементы должны быть закрыты, включая те, которые не имеют закрывающего тега (закрываются добавлением слэша ( '/' ) в конец тега).
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- XHTML 1.0 Строгий (Strict): полностью отделяет содержание документа от оформления (которое теперь задаётся только через CSS), многие атрибуты (такие как, например, bgcolor и align) более не поддерживаются, их поведение можно задавать только через таблицу стилей.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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">
Атрибут PUBLIC указывает, что следующая часть описания представляет собой публичный идентификатор для данного типа документа, а не его локальное имя, которое было бы объявлено с применением ключевого слова SYSTEM.
Проверка XHTML-документов
Правильным (т. е. отвечающим всем правилам) XHTML-документом считается документ, удовлетворяющий технической спецификации. В идеале, все браузеры должны следовать web-стандартам и, в соответствии с ними, правильные XHTML-документы должны отображаться во всех браузерах на всех платформах. Проверка XHTML-документа рекомендована, несмотря на то, что она не гарантирует кросс-браузерной совместимости. Документ может быть проверен на соответствие спецификации с помощью онлайновой Службы проверки разметки W3C (http://validator.w3.org/). Проверка обнаружит и разъяснит ошибки в XHTML-разметке.
Основное требование, предъявляемое к XHTML-документам, - правильность, то есть запись всех элементов без синтаксических ошибок: пробелы между элементами отсутствуют там, где они запрещены, значения атрибутов всегда заключаются в кавычки и т.д. Состоятельность обязательна при разработке документов на языке XHTML, в отличие от документов XML. Она означает, что синтаксис XHTML-документов должен соответствовать определению типа документа (document type definitions - DTD), разработанным специально для этих документов. Нельзя пользоваться режимом вложения элементов друг в друга, если правилами DTD это запрещено. Величины атрибутов должны принадлежать определенному для них диапазону значений, а сам документ обязан подчиняться остальным ограничениям и требованиям, прописанным в правилах DTD.
Правила XHTML
В связи с тем, что XHTML является приложением XML, некоторые действия, которые совершенно правильны в HTML4 на базе SGML, должны быть изменены. Перечислим правила, которые необходимо соблюдать при переходе от HTML к XHTML:
- Документы должны быть правильно сформированы. Это означает, что все элементы обязаны иметь закрывающий тег(например, <p></p> ) или быть написаны в специальной форме(например, <br /> ), а также должна соблюдаться корректная вложенность элементов.
ПРАВИЛЬНО: вложенные элементы
<p>выделяем это <em>слово</em>.</p>
НЕПРАВИЛЬНО: элементы перекрываются
<p>выделяем это <em>слово.</p></em>
- Имена элементов и атрибутов должны быть в нижнем регистре. Документы XHTML должны использовать нижний регистр для всех имен элементов и атрибутов HTML. Это необходимо, поскольку XML чувствителен к регистру.
Например, <ul> и <UL> это различные теги.
- Правила написания значений атрибутов. Все значения атрибутов, даже цифровые должны быть заключены в двойные( "" ) или одинарные( '' ) кавычки.
ПРАВИЛЬНО: атрибут в кавычках
<td colspan="8">
НЕПРАВИЛЬНО: атрибут не в кавычках
<td colspan=8>
Если значение атрибута содержит амперсанд, он должен выражаться мнемоникой ( "&" ).
Например, если атрибут href элемента <a> ссылается на скрипт CGI, который принимает параметры, он (атрибут) должен быть выражен так:
http://my.site.dom/cgi-bin/myscript.pl?class=guest&name=user,
а не так:
http://my.site.dom/cgi-bin/myscript.pl?class=guest&name=user.
Предопределенные значения атрибутов (например атрибут type элемента input ) регистрозависимы и должны быть написаны в нижнем регистре. Однако это не касается значений атрибутов, определяемых авторами документов (например, значения для атрибутов id, name или class ), которые также регистрозависимы, но допускают использование символов в верхнем регистре.
Ведущие и ведомые пробелы в значениях атрибутов удаляются браузерами, а один или несколько последовательных пробелов между словами (а также переводы строк) преобразуются в одиночный межсловный пробел (символ пробела ASCII в западных языках).
XML не поддерживает минимизацию атрибутов. Пары атрибут/значение обязательно должны быть выписаны полностью. Имена атрибутов, такие как compact и checked, не могут появляться в элементах без определенных значений.
ПРАВИЛЬНО: атрибут написан полностью
<dl compact="compact">
НЕПРАВИЛЬНО: атрибут минимизирован
<dl compact>
- Для непустых элементов необходимы конечные теги. В HTML4 на базе SGML, некоторые элементы допускали отсутствие конечного тега при наличии других последующих элементов с закрывающими тегами. Такое отсутствие конечных тегов не допускается в XHTML на базе XML. Все элементы, за исключением тех, которые объявлены в определении типа документа как EMPTY, должны иметь конечный тег.
ПРАВИЛЬНО: закрытые элементы
<p>Здесь какой-то текст.</p><p>Еще параграф с текстом.</p>
НЕПРАВИЛЬНО: незакрытые элементы
<p>Здесь какой-то текст.<p>Еще параграф с текстом.
- Пустые элементы обязаны иметь конечный тег, или стартовый тег обязан заканчиваться />.
Например, <br /> или <br></br>.
Для совместимости с устаревшими браузерами следует писать пробел перед /> в одиночном пустом элементе.
Следует использовать минимизированный синтаксис для тегов пустых элементов, например, <br /> так как альтернативный синтаксис <br></br>, допускаемый XML, дает непредсказуемые результаты во многих существующих браузерах.
При создании пустого объекта элемента, чья модель содержимого не EMPTY (например, пустой заголовок или параграф), не следует использовать минимизированную форму(т.е. нужно использовать <p> </p>, а не <p /> ).
ПРАВИЛЬНО: пустые теги закрыты
<br /><hr />
НЕПРАВИЛЬНО: пустые теги не закрыты
<br><hr>
- Элементы <script> и <style>. В XHTML элементы <script> и <style> объявлены как имеющие содержимое #CDATA. Как результат этого, < и & будут рассматриваться как начало разметки, а мнемоники, такие как < и &, будут считаться процессором XML мнемониками символов < и & соответственно. Перенос содержимого элементов <script> или <style> в раздел, помеченный CDATA, позволит избежать расшифровки этих мнемоник.
Пример:
<script type="text/javascript">//<![CDATA[ ... unescaped script content ... //]]></script>
Разделы CDATA распознаются процессором XML и являются узлами в объектной модели документа (Document Object Model). Альтернативой может быть использование внешних документов скриптов и стилей.
- Элементы с атрибутами "id" и "name". HTML 4 определяет атрибут name для элементов a, applet, form, frame, iframe, img и map, а также вводит атрибут id. Оба эти атрибута созданы для использования в качестве идентификаторов фрагмента. В XML идентификаторы фрагмента имеют тип ID, и в элементе может быть только один атрибут типа ID. Таким образом, в XHTML 1.0 атрибут id определён как атрибут типа ID. Чтобы быть уверенным, что документы XHTML 1.0 являются правильно структурированными документами XML, документы XHTML 1.0 обязаны использовать атрибут id для определения идентификаторов фрагмента, и даже в тех элементах, которые исторически имели атрибут name. Значение атрибута id в пределах документа должно быть уникальным.
В XHTML 1.1 для элементов a и map атрибут name удален, вместо него следует использовать атрибут id.
- Двойные тире в комментариях. В комментариях двойные тире "--" могут обозначать только начало и конец комментария.
НЕПРАВИЛЬНО:
<!-- использовать разделитель, написанный ниже -- нельзя и этот комментарий -- неверен --> <!--------------------------------->
ПРАВИЛЬНО:
<!--использовать разделитель, написанный ниже - - можно и этот комментарий - - верен --> <!--==== - - - - ====-->
Таким образом, двойные тире "--" не обозначающие начало и конец комментария в его тексте должны быть чем-либо заменены или разделены пробелом, например "- -".
- Символы < и & в тексте документа. Символы < и & в тексте документа должны быть заменены соответствующими последовательностями < и &.Нет необходимости, но желательно заменять также и > на >.
Образец документа XHTML:
Приведем пример XHTML-документа:
<?xml version="1.0" encoding="windows-1251"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru"> <head> <title>XHTML</title> </head> <body> <p> Подробности о разметке на сайте W3C: <a href="http://w3c.org/MarkUp/"> http://w3c.org/MarkUp/ </a>. </p> </body> </html>
Корневым элементом документа должен (обязан) быть <html>.
Корневой элемент документа обязан обозначить пространство имён XHTML путём использования атрибута xmlns[XMLNAMES]. Пространство имён XHTML определено в http://www.w3.org/1999/xhtml.
В документе обязано присутствовать объявление DOCTYPE, предшествующее корневому элементу( <html> ).
Публичный идентификатор, включённый в объявление DOCTYPE, обязан быть ссылкой на одно из определений типа документа.
