Гайдар Магдануров Веб-евангелист Microsoft DT 201Веб-стандарты Участие Microsoft в комитетах W3C Поддержка стандартов в IE9 HTML 5 CSS 3. презентация

Содержание

Стандарты HTML 5 и CSS 3: рождение нового веба вместе с Internet Explorer 9 Гайдар Магдануров Веб-евангелист Microsoft DT 201

Слайд 2Стандарты HTML 5 и CSS 3: рождение нового веба вместе с

Internet Explorer 9

Гайдар Магдануров

Веб-евангелист

Microsoft

DT 201


Слайд 3Содержание
Веб-стандарты
Участие Microsoft в комитетах W3C
Поддержка стандартов в IE9
HTML 5
CSS 3


Слайд 4Стандарты в WWW
Стандарты – это нужно
HTML 5, SVG, CSS 3, DOM

L2 и L3, ECMAScript

Стандартны – это сложно
Рабочая группа HTML – 1100 страниц, 40 организаций, 411 участников, 280 приглашенных экспертов

Слайд 5Стандарты - правда сложно!
1991 - HTML 1.0
1995 - HTML 2.0
1997 -

HTML 3.0
1997 - HTML 4.0
2000 - XHTML 1.0
2000 - Начало работы над XHTML 2.0
2006 - XHTLM 2.0
2008 - Первый черновик HTML 5.0
2009 - XHTML 2.0
… 2222 - HTML 5.0

Слайд 6Стандарты в Internet Explorer 9
HTML 5
XHTML
CSS 3
SVG
DOM Level2 и Level3
ECMAScript 5


Слайд 7Стандарты в Internet Explorer 9
Кросс-браузерная совместимость
Высокая интерактивность
Богатый пользовательский интерфейс
Высокая производительность
Ощущение настольного

приложения


Слайд 8HTML 5


Слайд 9Структура документа
Упрощенный DOCType

Разрешены перекрывающиеся теги
Да, так можно, но не

нужно!
Не обязательны кавычки атрибутов
Можно, но …

Атрибуты без значений (binary)



Слайд 10Структура документа
Не обязательны структурные тегов


Моя Страница
Да, это корректный документ,

но…




Слайд 11Устаревшие элементы
- следует использовать
- следует использовать CSS
- следует

использовать CSS
- следует использовать CSS
- следует использовать CSS
- дурацкая затея ранних IE…

Поддерживаются, однако помечены устаревшими

Слайд 12Новая жизнь старых элементов
- устаревший HTML 4, вернулся в HTML

5
- испольование для имен/значений
- указание на название статьи/книги
- контактная информация автора
- выделение
- «интонация» текста
- указание на важность
- изменение стиля, без важности

- разбиение текста на уровне параграфа
- мелкий шрифт (например, copyright)

Слайд 13Новые элементы
- заголовок документа указания
- «подвал» предшественника
- элементы

навигации

Слайд 14Новые элементы форм
Строгая типизация и валидация ввода
Спецификация не описывает изображение

min='0' max='50' value='0' />










Слайд 15Элементы Audio и Video
Не требуются плагины
Управление JavaScript
Простое добавление тегов на страницу
Кодеки

аудио: MP3, AAC
Кодеки видео: H.264
Нет DRM
Нет простых средств управления загрузкой канала (привет, Silverlight!)

Слайд 19Рамки


Слайд 20Фоновые изображения


Слайд 21Импорт шрифтов
@font-face {
font-family: AyitaPro; src: url('media/AyitaPro.woff');
}

style="font: bold 18pt AyitaPro, sans-serif;">
ALL ABOARD


Слайд 22Media Queries
Зависимости от возможностей устройств

/>




Слайд 23Селекторы
function makeAllH2Red() {
var elem = document.querySelectorAll("h2 +

p");
var count = elem.length;
var i = 0;
for (i = 0; i <= count; i++) { elem[i].style.color = "red"; }
}

var elem = document.querySelectorAll("ul li:nth-child(odd)");// var elem = document.querySelectorAll("table.test > tr > td");


Слайд 24Цвета в HSL


Слайд 25Прозрачность


Слайд 26
ECMAScript 5 и производительность
DOM Storage
SVG
Canvas

Разное…


Слайд 27DOM хранилище
Аналог Cookie файлов на клиенте
Уровень сеанса
sessionStorage.myKeyName = “hello”;
var result =

sessionStorage.myKeyName;
Локальное хранилище
localStorage.myKeyName = “Hi!”;
var local = localStorage.myKeyName;
Использование
function offlineEventReceived() {
var elemText = document.getElementById("blogPostInput");
var textToSave = elemText.value;
localStorage.savedBlogPost = textToSave;
localStorage.savedBlogPostTime = (new Date()).getTime();
}

Слайд 30Ресурсы
Спецификация HTML 5
http://dev.w3.org/html5/spec/Overview.html
Спецификация CSS 3
http://www.w3.org/TR/css3-roadmap/
Спецификация SVG
http://www.w3.org/TR/SVG/
«Шпаргалка» про Canvas
http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html


Слайд 31Официальные курсы и сертификация Microsoft
Более 300 официальных курсов Microsoft доступно в

России.
Официальные курсы можно прослушать только в авторизованных учебных центрах Microsoft
под руководством опытного сертифицированного инструктора Microsoft
интенсивное обучение с акцентом на практику
более 80-и учебных центров более чем в 20-и городах России (+ дистанционные и выездные курсы)
Сертификат Microsoft - показатель квалификации ИТ-специалиста для работодателя .
Microsoft предлагает гибкую систему сертификаций.





Все курсы, учебные центры и центры тестирования: www.microsoft.com/rus/learning


Слайд 32Специальные предложения

Сертификационный пакет со вторым шансом
Пакеты экзаменационных ваучеров со скидкой от

15 до 20% и бесплатной пересдачей («вторым шансом»). Все экзамены сдаются одним человеком.

Сэкономьте 15% на сертификации вашей ИТ-команды
Пакет из 10-и экзаменационных ваучеров со скидкой 15% для сотрудников ИТ-отдела. «Второй шанс» включен. Ваучеры можно произвольно распределять между сотрудниками.

Microsoft Certified Career Conference
Первая 24-часовая глобальная виртуальная конференция с 18 ноября с 15.00 (моск. время) по 19 ноября 2010 г.
Сессии по технологиям и построению карьеры
Скидка 50% для сертифицированных специалистов Microsoft и студентов

Бесплатная подписка на TechNet для слушателей официальных курсов
Некоторые курсы по SharePoint, Windows 7; Windows Server 2008; SQL Server 2008

Детали: www.microsoft.com/rus/learning

С 22 ноября 2010 г. – подписка TechNet бесплатно для слушателей курсов. Количество ограничено!


Слайд 33Обратная связь
Ваше мнение очень важно для нас. Пожалуйста, оцените доклад,

заполните анкету и сдайте ее при выходе из зала

Спасибо!

Слайд 34Вопросы
DT 201
Гайдар Магдануров
Веб-евангелист
GaidarMa@microsoft.com
Blogs.msdn.com/gaidar
Twitter.com/gaidar

Ищите меня в зоне «Спроси эксперта» после 15.30.


Обратная связь

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

Email: Нажмите что бы посмотреть 

Что такое ThePresentation.ru?

Это сайт презентаций, докладов, проектов, шаблонов в формате PowerPoint. Мы помогаем школьникам, студентам, учителям, преподавателям хранить и обмениваться учебными материалами с другими пользователями.


Для правообладателей

Яндекс.Метрика