Лекция по предмету Web-технологии

GML,  SGML, HTML, XML, XHTML

 

Язык логической разметки разработан фирмой IBM, 60-е годы - язык GML (Generalized Markup Language)

Один из разработчиков - Чарльз Гольдфарб (Charles F. Goldfarb)

 

Пример текста на языке GML

   :h1.Chapter 1:  Introduction

   :p.GML supported hierarchical containers, such as

   :ol

   :li.Ordered lists (like this one),

   :li.Unordered lists, and

   :li.Definition lists

   :eol.

   as well as simple structures.

   :p.Markup minimization (later generalized and formalized in SGML),

   allowed the end-tags to be omitted for the "h1" and "p" elements.

SGML “Standard Generalized Markup Language”

Стандартный обобщенный язык разметки.

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

Принят в качестве стандарта ISO (International Standard Organization) в 1986 г. (ISO 8879:1986)

Принципы:

• Открывающие и закрывающие тэги <tag>…</tag>
• Некоторые тэги могут быть пустыми.
• Некоторые тэги не нуждаются в закрывающихся, потому что они автоматически закрываются перед определенными тэгами.
• Тэги могут содержать атрибуты, уточняющие их смысл: <тэг атрибут1=значение1 атрибут2=значение2 >
• Некоторые атрибуты могут употребляться без значений.
• Имена тэгов и атрибутов не зависимы от регистра символов.
• Синтаксические правила языка описываются в DTD (Document Type Definition) - это текст на специальном языке, который располагается в начале документа или во внешнем файле.

SGML

• Метаязык для определения конкретных языков разметки электронных документов
• Позволяет определить синтаксис конкретного языка разметки:

На базе SGML возникло множество языков разметки. Самые известные

 

1. Язык разметки литературных текстов TEI (Text Encoding Initiative) - 1987г.

 

2. Язык разметки технической документации DocBook - 1991г.

 

3. Язык разметки гипертекстовых страниц HTML (“Hypertext Markup Language”), созданный Тимом Бернерс-Ли (Tim Berners-Lee) в швейцарском центре ядерных исследований CERN в 1992 г.

 

XML “Extensible Markup Language”

Расширяемый язык разметки.

• Подмножество SGML, оптимизированное для обмена данными в Интернет
• Расширяемый набор тегов и самоописываемый формат документа
• Четкое отделение содержания документа от его оформления

На основе XML разработан целый ряд языков разметки для различных предметных областей

XHTML “Extensible Hypertext Markup Language”

Расширяемый язык гипертекстовой разметки

• более жесткие правила при создании web-документов;
• предоставление web-разработчикам расширяемости;
• поддержка растущего числа альтернативных устройств

W3C

World Wide Web Consortium -- организация, разрабатывающая и внедряющая технологические стандарты для Всемирной паутины.

Структура консорциума

Общую администрацию Консорциума Всемирной паутины осуществляют 3 организации:

• Массачусетский технологический институт (США);
• Европейский консорциум по исследованиям в области информатики и математики (Франция);
• Университет Кейо (Японии)

Принципы и концепции, утверждённые W3C

• Общедоступность
• Аппаратная независимость
• Интернационализация
• Патентная политика
• Многоформенное взаимодействие
• Семантическая паутина
• Мобильная паутина

Стадии согласования:

• Рабочий проект (Working Draft);
• Последний созыв (Last Call);
• Возможная рекомендация (Candidate Recommendation);
• Предлагаемая рекомендация (Proposed Recommendation);
• Официальная Рекомендация W3C

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

• 1995  - спецификация HTML 2.0
• (около 40 тегов)
• 1996 - проект  HTML 3.2.
• появились теги для создания таблиц;
• вставки рисунков, примечаний;
• теги разметки математических формул;
• явились CSS (таблицы стилей)
• 1996 -предлагаемая спецификация HTML 3.2.
• 1997 - официальная рекомендация HTML 3.2. Появилась возможность проектировать и отображать на экране сложные композиции графических элементов, ничем не уступающие печатным изданиям. Это положило начало эре Web-дизайна.
• 1997 - предлагаемая спецификация  HTML 4.0
• включена поддержка фреймов
• унифицирована процедура вставки различных объектов
• поддержка каскадных таблиц стилей (CSS)
• , усовершенствованы формы и таблицы.
• 1997 - официальная рекомендация  HTML 4.0
• 1999 - HTML 4.01
• январь 2000   - спецификация XHTML 1.0 одобрена в качестве рекомендации консорциума
• августа 2002 - публикована вторая редакция спецификации.
• 2009 - рабочий проект HTML 5.0

Каждый (X)HTML-документ, отвечающий спецификации (X)HTML какой-либо версии, обязан начинаться со строки декларации версии HTML <!DOCTYPE>

 

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

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >

HTML 5

Apple, Mozilla и Opera учредили рабочую группу WHATWG, которая разработала предварительную версий спецификации HTML 5.

январь 2008 материалы по HTML 5 были опубликованы как черновой проект стандарта на сайте W3C.

 

WHATWG и W3C разрабатывают этот стандарт параллельно.

Особенность стандарта HTML 5

 

1. Приоритеты интересов:
2. Максимальная совместимость с уже существующим наполнением Сети
3. Описание документа HTML в терминах объектной модели (DOM)
4. Некоторые элементы удалены из стандарта
5. Убраны фреймы (frame, frameset, noframes)
6. Убраны некоторые атрибуты (align, border, valign, cellpadding, cellspacing и др.).
7. Изменение форм

Валидаторы

Программа, которая проверяет, соответствует ли код документа формальным правилам

 

Валидатор W3C validator.w3.org

 

Отличия XHTML от HTML

 

1. Документы должны быть правильно сформированы.
2. Имена элементов и атрибутов должны быть в нижнем регистре.
3. Все значения атрибутов, даже цифровые должны быть заключены в двойные("") или одинарные('') кавычки.

Образец минимального документа XHTML:

 

<?xml version="1.0" encoding="windows-1251"?>

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

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">

    <head>

       <title>XHTML</title>

    </head>

    <body>

    </body>

</html>

Структура XHTML-документа

Каждый XHTML-документ, отвечающий спецификации какой-либо версии, обязан начинаться со строки декларации версии <!DOCTYPE>

Теги верхнего уровня и теги заголовка

• html, head, body
• title, meta

Блочные элементы

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

h1, h2, h3, h4, h5, h6

заголовки разных уровней

р

абзац

pre

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

hr

горизонтальная линия

blockquote

выделение длинных цитат внутри документа (блок текста с отступом).

div

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

Строчные элементы

такие элементы, которые являются непосредственной частью другого элемента,

например, текстового абзаца.

В основном они используются для изменения вида текста или его логического выделения.

a

для создания ссылок. В зависимости от присутствия атрибутов name или href тег <a> устанавливает ссылку или якорь.

img

для отображения изображений

em

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

strong

полужирный.

cite

содержит цитату или ссылку на другой ресурс.

dfn

определение термина.

code

обозначает фрагмент компьютерного кода.

samp

образец вывода программ, скриптов и т.п.

kbd

обозначает текст, введённый пользователем.

var

аргумент переменной или программы.

abbr

сокращённая форма (напр., www, http, uri, mass. и т.д.).

acronym

акроним (например, нато)

sub  и   sup

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

br

принудительно обрывает (оканчивает) текущую строку текста

span

для определения строчного элемента внутри документа

Разница между блочными и строчными элементами

• Строчные элементы могут содержать только данные или другие строчные элементы
• Блочные элементы могут содержать

• другие блочные элементы
• строчные элементы
• данные.

• Блочные элементы всегда начинаются с новой строки

• Блочные элементы занимают всю доступную ширину, а ширина строчных элементов равна их содержимому плюс значения отступов, полей и границ.

Списки

• неупорядоченный
• ul - список
• li элемент списка
• упорядоченный
• ol - список
• li элемент списка
• определения
• dl - список
• dt dd элементы списка

Списки могут быть вложенными, разные типы списков можно использовать вместе,