HTML5. Будем знакомы! Павел Ловцевич
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

HTML5. Будем знакомы! Павел Ловцевич

on

  • 2,410 views

HTML5. Будем знакомы! Павел Ловцевич

HTML5. Будем знакомы! Павел Ловцевич

Statistics

Views

Total Views
2,410
Views on SlideShare
2,360
Embed Views
50

Actions

Likes
0
Downloads
11
Comments
0

2 Embeds 50

http://it-job.by 45
http://www.slideshare.net 5

Accessibility

Categories

Upload Details

Uploaded via as Apple Keynote

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

HTML5. Будем знакомы! Павел Ловцевич Presentation Transcript

  • 1. Павел Ловцевич, LOVATA Group Web Standards Days, Минск 2009
  • 2. Знакомая картина?
  • 3. Год 2022. Эра блаженства
  • 4. Будущее зависит от тебя!
  • 5. Вчера XHTML 2 Web Apps 1
  • 6. Сегодня
  • 7. Вы можете помочь! http://blog.whatwg.org/w3c-restarts-html-effort
  • 8. Ian Hickson «This is what we're doing. If the implementation turns out to show that the spec sucks, the spec will change.»
  • 9. Новые тэги <header > <mark> <article> <canvas> <figure> <details> <progress> <hgroup> <meter> <video> <audio> <aside> <time> <nav> <footer> <output> <section>
  • 10. <!DOCTYPE html> <header>
  • 11. <!DOCTYPE html> <header> <section>
  • 12. <!DOCTYPE html> <header> <section> <article> <article>
  • 13. <!DOCTYPE html> <header> <section> <aside> <article> <article>
  • 14. <!DOCTYPE html> <header> <section> <aside> <article> <article> <footer>
  • 15. <!DOCTYPE html> <header> <nav> <section> <aside> <article> <article> <footer> <nav>
  • 16. Новые тэги <header > <article> <mark> <canvas> <figure> <hgroup> <details> <meter> <progress> <audio> <aside> <video> <nav> <time> <footer> <section> <output>
  • 17. <video> и graceful degradation <video width="640" height="360" src="http://site.com/video.mp4”> <object> <param value="http://site.com/video.mp4"> <param value="true"> <param value="false"> <embed src="http://site.com/video.mp4"> </embed> </object> </video>
  • 18. Поддержка видео-кодеков Theora Theora Theora Theora MP4 H.264
  • 19. Поддержка аудио-кодеков .wav .ogg .mp3 .ogg .wav .wav .wav
  • 20. <input type=“” />
  • 21. Кроме того •Video & Audio API •Drag & Drop API •Geolocation API •Web Storage •Form validation
  • 22. Объявляем тип языка разметки <!DOCTYPE html>
  • 23. Костыль для Internet Explorer <!--[if IE]> <script> document.createElement('header'); document.createElement('nav'); document.createElement('section'); document.createElement('article'); document.createElement('aside'); document.createElement('footer'); </script> <![endif]-->
  • 24. HTML5 IE enabling script <!--[if IE]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> http://code.google.com/p/html5shiv/
  • 25. Задаем базовые свойства header, footer, section, nav, article, aside { margin: 0px; padding: 0px; display: block; }
  • 26. Валидация HTML5 http://html5.validator.nu
  • 27. Синтаксис HTML5 •описание согласно терминам DOM; •HTML-сериализация ; •XML-сериализация.
  • 28. HTML-сериализация <!DOCTYPE html> <html> <head> <title>An HTML Document</title> </head> <body> <h1>Example</h1> <p>This is an example HTML document.</p> </body> </html>
  • 29. XML-сериализация <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>An HTML Document</title> </head> <body> <h1>Example</h1> <p>This is an example HTML document.</p> </body> </html>
  • 30. Преимущества HTML-сериализации •обратная совместимость; •«мягкий» синтаксис, прощающий мелкие ошибки; •возможность сокращения кода; •низкий порог входа разработчиков.
  • 31. Преимущества XML-сериализации •«жесткий» синтаксис, порождающий качественный код; •интеграция с другими XML-стандартами (SVG, MathML и пр.). •совместимость со стандартными средствами обработки XML (часто применяется при обработке и публикации материалов).
  • 32. HTML5 на различных платформах
  • 33. HTML5
  • 34. FIN Спасибо за внимание! Вопросы? lovtsevich@lovata.com pavel.lovtsevich@web-standards.ru