Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Html5

1,185 views

Published on

What's new in HTML5.

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Html5

  1. 1. Присяжний Дмитро MCP [email_address] Нові можливості за допомогою: HTML5
  2. 2. <ul><li>WHATWG ( Web Hypertext Application Technology Working Group ) - це швидкозростаюче спільнота людей зацікавлених в розвитку Інтернету. </li></ul><ul><li>2022 р. – Офіційна рекомендація HTML5. Ian Hickson пояснив, що це дата взята по максимуму і тоді всі браузери повинні будуть підтримувати HTML5 повністю. А десять років готуватимуться тести, без яких нормально написати ядро рендеринга складно. </li></ul><ul><li>Основні функції HTML5 можна і потрібно використовувати вже сьогодні, а Браузери їх мали б почати підтримувати до 2012 р. </li></ul>
  3. 3. Відмінність HTML5 від HTML4
  4. 4. <ul><li><! DOCTYPE html> - повідомляє браузеру, що це файл HTML 5, і, відповідно, браузер буде його інтерпретувати як файл HTML 5. </li></ul><ul><li>Публікація - <article> </ article> </li></ul><ul><li>Зона заголовків - <hgroup> </ hgroup> </li></ul><ul><li>Різні заголовки - <h1> </ h1> - <h6> </ h6> </li></ul><ul><li>Зона вмісту - <section> </ section> </li></ul><ul><li>Абзац тексту - <p> </ p> </li></ul><ul><li><time> </ time> - форматування дати і часу. </li></ul>
  5. 5. Основні відмінності HTML 5 від HTML 4 складають: <ul><li>Нові правила лексичного розбору; </li></ul><ul><li>Нові елементи - section, video, audio, progress, nav, meter, time, aside, canvas; </li></ul><ul><li>Нові типи input-елементів; </li></ul><ul><li>Нові атрибути; </li></ul><ul><li>Глобальні атрибути - id, tabindex, repeat; </li></ul><ul><li>Застарілі елементи прибрані - center, font, strike. </li></ul>
  6. 6. <ul><li>Крім визначення розмітки, в HTML 5 визначені API. Існуючі інтерфейси DOM розширені, також були додані нові API: </li></ul><ul><li>Малювання 2D-картинок в реальному часі; </li></ul><ul><li>Контроль над програванням медіа файлів; </li></ul><ul><li>Зберігання даних в браузері; </li></ul><ul><li>Редагування; </li></ul><ul><li>Drag-and-drop; </li></ul><ul><li>Робота з мережею; </li></ul><ul><li>MIME. </li></ul>
  7. 7. <ul><li>У стандарті пропонується елемент datagrid для організації динамічних структур даних, елемент command для виклику команд користувача, елемент progress - індикатор ходу виконання операції. Для мультимедійного змісту з'явилися елементи audio та video . Область для малювання на сторінці canvas . Засоби DOM для редагування вмісту прямо на веб-сторінці, перетягування, виділення, роботи з буфером обміну і багато чого іншого . </li></ul>
  8. 8. <ul><li>Браузери які не підтримують HTML 5 можуть спокійно ігнорувати елементи. </li></ul><ul><li>П'ята версія чітко прописує правила лексичного розбору, щоб різні браузери відображали один і той же результат у разі некоректного синтаксису. </li></ul><ul><li>HTML 5 не дозволяє використовувати деякі елементи, але описує, як браузер має на них реагувати. </li></ul>
  9. 9. Нові “event” атрибути onabort onprogress onended onerror onloadeddata onvolumechange onpause onplaying onplay The attributes for media ( audio, embed, img, object, video ) onscroll onmousewheel ondrop ondragstart ondragover ondragleave ondragenter ondragend ondrag Events triggered by a mouse, or similar user actions: oninvalid onforminput onforminput The attributes below can be used in form elements:
  10. 10. Форми <ul><li>Autofocus ; </li></ul><ul><li>Необов'язкові атрибути ; </li></ul><ul><li>Нові поля введення; </li></ul><ul><li>Зв'язка з кількома формами; </li></ul><ul><li>Універсальність control- ів; </li></ul><ul><li>Validation форм. </li></ul>
  11. 11. <a href= &quot;#321&quot; rel= &quot;bookmark&quot; > Перейти до розділу Фрукти </a> <h1 id= &quot;321&quot; > Фрукты </h1>
  12. 12. Сумісність NO YES NO NO WEB forms 2.0 NO YES NO NO Forms validation YES YES YES NO Styles YES YES YES YES <article> <hgroup> <section> Chrome 3. 0.195.33 Opera 10.01 FF 3.0.15 IE 8
  13. 13. Запитання? [email_address]

×