HTML 5 Доклад подготовила Виталия Добрягина Группа 22304. - презентация

1 HTML 5 Доклад подготовила Виталия Добрягина Группа 22304

2 что такое html5? Разработка HTML является основной деятельностью сообщества WHATWG. HTML5 - это часть HTML, разрабатываемая совместно WHATWG и группой по разработке HTML W3C. HTML5 - это развитие HTML4, XHTML1 и DOM второго уровня. Он как наследует многие функции этих технологий, так и добавляет новые возможности.

3 html 5 Первый черновик спецификации стал доступен широкой общественности Спецификация сейчас находится в разработке и может находиться в этой стадии ещё несколько лет, хотя предполагается, что отдельные части HTML 5 будут закончены и реализованы в браузерах до того, как спецификация официально получит статус рекомендации. Уже сейчас такие производители как Mozilla, Opera Software, Apple и Google внедряют поддержку элементов HTML5 в свои продукты.

4 отличия от html 4 Новые правила лексического разбора Новые элементы Добавлены новые атрибуты для элементов, существовавших в HTML4 Атрибуты class, dir, id, lang, style, tabindex, title, существовавшие в HTML4, стали применимы для всех элементов (глобальные аттрибуты) Исключены не рекомендованные для использования элементы "Оффлайн" хранение данных в браузере

5 структура документа Упрощенный DOCTYPE (стал нечувствительным к регистру) Разрешены перекрывающиеся теги … Не обязательны кавычки атрибутов …

6 новые теги: новые теги: Тег созданный для выделения на странице основного контента. Например этим тегом можно выделить статью на странице или очередную запись в блоге Упрощает индексацию сайта поисковыми машинами

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

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

9 новые теги: новые теги: Этот тег предназначен для выделения навигации сайта. Внутри этого тега должна находить только основная навигация (например "главная", "статьи", "галереи" и т.д.) - не нужно каждую ссылку сайта вставлять внутрь.

10 новые теги: новые теги: «Чердак» сайта. В этом теге можно разместить информацию об авторе сайта, об авторских правах и т.д.

11 новые теги определяет кнопку ( новые атрибуты: autofocus, form, formaction, formenctype, formmethod, formnovalidate и formtarget. ) группировка контента группирует заголовки иллюстрация, диаграмма, изображение (выделенная область) подпись к иллюстрации выделение текста

12 новые технологии Возможность рисовать на странице в реальном времени (элемент Canvas). Контролирование воспроизведения видео и звука в реальном времени, что может пригодиться например если вам нужно синхронизировать видео и субтитры Drag-and-drop прямо с рабочего стола в браузер Работа с сокетами Web forms 2.0

13 новые технологии аудио без плагинов видео без плагинов векторные изображения в XML математические формулы в формате MathML поверхность «для рисования»

14 новая жизнь старых элементов устаревший HTML4, вернулся в HTML5 использование для имен/значений указание на название статьи/книги контактная информация автора выделение «интонация» текста указание на важность изменение стиля, без важности разбиение текста на уровне параграфа мелкий шрифт (например, copyright)

15 устаревшие элементы следует использовать использовать использовать и текстовое поле следует использовать CSS следует использовать CSS/JS следует использовать CSS вместо этого следует использовать CSS

16 поля ввода Добавлено большое количество типов текстовых полей ввода. Они призваны добавить больше смысловой нагрузки обычным текстовым полям. Так для поля date будет возможно удобно выбрать дату, не прибегая к использованию готовых календарей на JavaScript. В общем появятся более удобные и подходящие по контексту средства ввода информации. Важно с точки зрения безопасности: эти поля будут сами себя валидировать!

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

18 поддержка браузерами

19 - наглядная демонстрация поддержки html5 популярными браузерами

20 Google Chrome

21 Firefox 3.5

22 Safari 4

23 Opera 10

24 Internet Explorer 6, 7, 8

25 Спасибо за внимание :)