Реальный HTML

Реальный HTML
Пётр Керзум
Яндекс
Реальный HTML
•
•
•
•
Технология прошлого тысячелетия
Отличается от стандарта (98 года)
Широко распространён
«Как бы SGML» by Design
– «HTML Tags» от Тима
• Лексика, Синтаксис, Семантика
Агенты
• IE (60%)
• Mozilla
• KHTML
– Webkit (Safari)
• Opera
• Роботы и публичные парсеры
Лексика
Лексические конструкции
• Текст
• Тэг – открывающий / закрывающий
•
•
•
•
Комментарий
р
Декларация
Инструкция
ASP
<!-- -->
<! >
<? >
<% %>
Вырожденные конструкции
•
•
•
•
Комментарий
Декларация
Инструкция
ASP
<!--> <!-------->
<!>
<?>
<%>
Тэги
• <name attr=“val”>
• - имя тэга: GI,
• правая граница тэга и строки (IE)
<font ‘more=“>’ title=more> “>
– 3 вида кавычек (single,
(single double
double, backstrict)
• атрибуты
• слэш? Скорее значение атрибута
• >
Литеральные aka CDATA
CDATA-тэги
тэги
• Script
p style
y title textarea xml xmp
p
• Plaintext
<script>
// <!-- </script>
будет выполнено();
будет_выполнено();
// -->
всё
ё еще скрипт
</script>
Конец потока aka EOF
• Превращает таг в текст
• Превращает комментарий в
декларацию
• Отключает ASP
• В CDATA: контент включается или
выбрасывается
б
Синтаксис
DTD
- «Как в SGML»
- Валидный HTML
<table><tr><td>Клетка<td>ещё<td>Клетка
- Tbody
- Пометки O E F в документе
Дерево (нормальная разметка)
<table><tr><td>Клетка<td>ещё<td>Клетка
• (Дерево)
Визуальная разметка
•
•
•
•
<b> <i> <s> и т.д...
тд
Пересекают границы тэгов
По смыслу ближе к CSS
Не участвуют в конструкции дерева
– Но потом туда вставляются
– По сути не элементы
Подокна aka Scope
• Например: <td>
• Изолированый фрагмент документа
• Останавливают распространение
визуальной разметки, восстанавливают
её состояние
Контент модель стандарта
Контент-модель
• Блок и инлайн (flow)
• Приоритет блока в конструкции дерева
• Приоритеты:
– Подокна
– Блочные элементы
– Инлайн
И
й элементы
– Тэги разметки
Некорректная разметка
• По настоящему некорректную разметку
сделать довольно сложно
• Нет единства,
единства различные подходы
обработки
– Явные
Я
ситуации (+HTML5)
( HTML5)
– Приоритеты тагов
– Модель стандата
– Что-то еще?
Семантика
Назначение
• ЯРГТ – Язык Разметки Гипертекста
• Язык семантической разметки by design
Средства
р д
семантической
разметки
- Существующие тэги
<h1> <address>
- Классы
<div class=“footer”>
-
Новые тэги
тэги, отражающие классы
<footer>
Задачи семантической разметки
• Записать метаинформацию
• Сделать возможным сохранение
структуры вне зависимости от
устройства
у
р
вывода
• Изложить ясно (и ясно поразмыслить)
• Изложить
И
для других (чужих)
(
)
презентация: Пётр Керзум
powered by:
p
y Илья Сегалович
(logo)