Розробка HTML5 додатку для візуалізації та маніпуляції сітками елементів

6. Структурні можливості HTML5

Роблять структуру веб- документа простіший, а код чистіше. Нові семантичні елементи header, nav, section, article, aside і footer можуть використовуватися замість контейнерів div, що застосовуються зараз в HTML4. 0. нові елементи дозволяють більш конкретно описувати заголовок, нижній колонтитул, колонки тексту та інші. Ці нововведення можуть використовуватися для автоматичної генерації змісту та організації більш ефективної і простий навігації по веб -сторінці. Код при цьому стає чистішим і менш засміченим другорядними деталями.

Кілька конкретних прикладів:

Приклад 1. Замість громіздкої записи HTML4:

<! DOCTYPE html PUBLIC _ / / DTD XHTML1. 0 Transitional / / EN

< # « justify « > 7) Переваги для кінцевого користувача

З HTML5 життя кінцевого користувача стає помітно легше:

Не потрібно установка численних додаткових програм;

HTML5, на відміну від HTML4 сумісний, крім ПК і ноутбуків, ще й з планшетами, смартфонами і сучасними моделями телевізорів, які надають доступ в інтернет.

 

 

На сьогоднішній день в HTML5 присутні мінуси, через які він програє колишнім технологіями. Має місце деяка вразливість HTML5 в області захисту даних. Таку вразливість створює більший, в порівнянні з cookie стандарту HTML4, обсяг даних, які зберігаються на жорсткому диску користувача. Небезпека полягає в тому, що у великих обсягах даних може міститися більше докладна інформація про користувача. Експерти висловлюють думку, сто якщо сховище HTML5 залишається на комп'ютері користувача протягом багатьох місяців, то інтернет- сайти, звертаючись до нього через JavaScript після завантаження сторінки, можуть непомітно для користувача збирати і передавати дані власнику сайту.

Відносно мультимедійного контенту теж є недоліки, що не дозволяють зробити остаточний вибір на користь HTML5. Як наголошується в офіційному блозі YouTube, підтримка відео HTML5 дозволяє відтворювати мультимедійний контент на комп'ютерах і пристроях, які не підтримують Flash Player, проте повною мірою HTML5 всім цим потребам все ще не відповідає. На сьогоднішній день Adobe Flash забезпечує найкращу платформу для відтворення відео. У HTML5 поки немає, наприклад, повноекранного режиму. Є недоліки, що стосуються використання HTML5 для створення ігор. І, крім того, новий стандарт поки що не підтримується всіма браузерами.

Різниця в форматах HTML5 відео / аудіо в різних браузерах може привести:

1) До збільшення часу тестування і розробки;

2) До збільшення витрат дискового простору і навантаженні на сервер.

Також є й інші недоліки у використанні HTML5 відео / аудіо:

1) На даному етапі жоден їх кодеків не може підтримувати шифрування потоку з розпакуванням на клієнті, тобто не мають можливості віддавати контент в одну точку (теоретично його одночасно без шифрування зможе дивитися необмежену кількість клієнтів, а отже доведеться регулювати доступ до конкретного потоку на стороні сервера, що призведе до витрат потужностей) ;

2) Немає жодного універсального рішення окрім як Flash для створення мітингів і онлайн- трансляцій прямо в браузері без установки додаткового ПЗ.

Недоліки HTML5 в розробці ігор:

• Повільна робота ігор, створених за допомогою HTML5;

• Не кожна платформа підтримує ігри, розроблені на HTML5;

• При розробці гри на HTML5 потрібно набагато більше ресурсів і часу;

• Відкритість коду HTML5 неприйнятна для безкоштовних ігор;

Відсутність потужних і зручних інструментів для створення ігор, особливо для анімації;

Неможливість адекватно упаковувати гру в один файл для дистрибуції на різних порталах;

Платформа Flash використовується також для анімації і розробки інтерфейсів, її застосовують для створення більш складної реклами і в тривимірній графіці. Вона постійно еволюціонує і вдосконалюється.

Як зазначив Філіп Ле Егар (Philippe Le Hegaret), керівник напрямку компанії W3C, яка розробляє стандарт HTML5, в найближчі роки не вийти відмовитися від технології Flash. Причиною цьому він назвав те, що буде потрібен тривалий час для переходу всіх веб -клієнтів до підтримки HTML5. Протягом найближчого часу технології HTML5 і Adobe Flash будуть існувати.

2. 3 Canvas Canvas – елемент HTML5, який можна застосовувати для малювання графіки використовуючи скрипти (переважно JavaScript). Наприклад його можна застосувати для малювання графів, створення фотокомпозицій а також анімації.

Елемент <canvas> є частиною специфікації WhatWG Web applications 1. 0, що відома як HTML 5.

<canvas> вперше було втілено Apple в Mac OS X Dashboard Safari. У Gecko підтримка canvas з'явилася в версії 1. 5, уPresto з версії 9. 0 веб-браузера Opera. Internet Explorer підтримує canvas починаючи з 9-ї версії. Щоб відобразити <canvas> в html документі слід використати наступний код:

<canvas id=«tutorial» width=«150» height=«150»> </ canvas>

Він дуже схожий на тег <img>, з тією лише різницею, що не містить атрибутів src і alt. Елемент <canvas> має всього два атрибути – width і height. Обидва вони не є обов'язковими, і можуть бути задані через властивості DOM. Якщо ширина і висота не визначені, canvas буде створений шириною в 300 пікселів і 150 пікселів заввишки. Розмір елемента може бути довільним і задаватися через CSS, але при промальовуванні