Презентация на тему Введение в HTML5

4.01
XHTML 1.0
XHTML 2.0
HTML5
1995
1997
1999
HTML5 на много более толерантен и может

поддерживать разметку всех предыдущих версий.

HTML5 был официально представлен в 2012 и разрабатывался с 2004.

После релиза HTML 4.01, акцент сместился к XHTML и его строгим стандартам.

XHTML 2.0 имел еще более строгие стандарты, чем 1.0, отклоняя страницы не были составлены правильно. Его популярность упала и от него практически отказались в 2009.

недавно набирает частичную поддержку со стороны производителей браузеров.
Она включает

в себя все функции из предыдущих версий HTML, в том числе строгого XHTML.
Он добавляет широкий набор новых инструментов для веб-разработчика в использование.
Он по-прежнему находится в стадии разработки. Нет браузеры не имеют полную поддержку HTML5. Это будет через много лет - возможно, не ранее 2018 года или позже - до того момента, пока будет полностью определен и поддерживаются.

никаких требований, чтобы вернуться и пересмотреть старые сайты.
Снижение потребности

во внешних плагинах и скриптах для отображения содержания веб-сайта.
Улучшение семантического определения (т.е. смысл и цель) элементов страницы.
Делает рендеринг веб-контента универсальным и независимым от используемого устройства.
Обрабатывает ошибок веб-документов лучшим и более последовательным образом.

элементов в HTML5.

новые элементы, чтобы помочь правильно структурировать документы HTML5:
-

отдельная часть информации

- секция текста, например глава

- информация в заголовке, напр. вступление

поддержка (без плагинов)
Расширенные формы элементов управления и атрибуты
Холст (способ

рисовать прямо на веб-странице)
Drag and drop функциональность
Поддержка CSS3 (более новая и более мощная версия CSS)
Более продвинутые функции для веб-разработчиков, такие как хранение данных и offline приложения.

просмотра в браузере следующих видео-форматов:
MP4
Ogg
WebM
Аттрибуты:
width, height – размер видео-плеера
src

– источник видео
controls – элементы управления
autoplay – автостарт видео
loop – автоматически повторять видео

syntax:

для элементов и
Это позволяет задать несколько источников

для элемента

в элементы и
HTML5 syntax:

в браузере следующие форматы:
MP3
Ogg
WAV
Многие атрибуты, включенные в элементы

доступны и для

syntax:

доступ через APIs, без внешних плагинов
-: Нет встроеного полноэкранного

режима, не все используют совместимые с HTML5 браузеры, долгосрочные ограничения по стандартизации, не может отображать live-streaming (живой поток), сложность адаптации под новые стандарты
Adobe Flash
+: Более популярен и понятен
-: Внешние плагины, не поддерживается на некоторых устройствах, не является веб-стандартом

из предоставляемого списка автозаполнения
required
атрибут required обязывает пользователя ввести данные

в форму ввода
output
элемент output производит вычисления и выводит результат в поля формы

been added for the element’s type attribute:
date, time,

and datetime – display datetime pickers
number – displays a spinner for inputting a number
email, url, telephone – these types of inputs, among others, are used for data validation
range – displays a movable slider to specify values
color – displays a color picker for choosing color values in hex

rendering(надання) of graphics and animations in-browser
One way HTML5 accomplishes(виконує)

this is through(через) the new element
creates a 2D canvas in which graphics can be drawn via scripting
JavaScript
WebGL
SVG

in HTML5 and improves on styling options available
SkewingНахил, rotationобертання,

and scalingмасштабування can be done in CSS3
CSS3 allows(дозволяє) for easily downloadable(завантажені) fonts(шрифти) locally stored(зберігаються) on the web-server
Animations and transitions can be coded using CSS3
Page layouts(макети) can easily be done using CSS3

elements, including and
Extended information gathering via improved

forms Розширена інформація збір через поліпшені форми
Graphics and animations without the need for third-party plugins

XHTML?

In

HTML5, there is just one possible DOCTYPE declaration and it is simpler:

Just 15 characters!

The DOCTYPE tells the browser which type and version of document to expect. This should be the last time the DOCTYPE is ever changed. From now on, all future versions of HTML will use this same simplified declaration.

looked like in XHTML:

Again, HTML5 simplifies

this line:

Each of the world’s major languages has a two-character code, e.g. Spanish = "es", French = "fr", German = "de", Chinese = "zh", Arabic = "ar".

The lang attribute in the element declares which language the page content is in. Though not strictly required, it should always be specified, as it can assist search engines and screen readers.

section:


My First XHTML

Page

And the HTML5 version:

Notice the simplified character set declaration, the shorter CSS stylesheet link text, and the removal of the trailing slashes for these two lines.

and now adding the section and closing tags,

we have our first complete web page in HTML5:

HTML5 is fun!

Let's open this page in a web browser to see how it looks…