Adobe Flash vs Hyper Text Markup Language 5 Autorzy: Piotr Kwiatek i Paweł Głębocki Grupa: I9H1S4

Wprowadzenie Czym jest HTML5? Nowości związane z HTML5 Wady HTML5 Popularność Flash Testy wydajności Co kiedy wybrać? Czy Adobe jest wrogiem HTML5? Bibliografia

Czym jest HTML5? 1994 HTML 2 1996 CSS 1 + JavaScript 1997 HTML 3.2 i 4 2000 XHTML 1 i HTML 4.01 2005 AJAX 2008 HTML 5 2007 Google Gears O3D

Nowe technologie związane ze standardem Multimedia Gromadzenie informacji Łączność i wykonywanie zadań Obsługa formularzy i stron Semantyka strony Dysk sieciowy: \\adresIP\Demonstracje

Multimedia Audio, Video – możliwość zagnieżdżenie odtwarzacza w przeglądarce Canvas – pozwala na dynamiczne, skryptowe renderowanie kształtów i obrazów bitmapowych WebGL – rozszerzenie Canvas o grafikę 3D SVG – uniwersalny format dwuwymiarowej grafiki wektorowej (statycznej i animowanej)

Multimedia Kodowanie Video: WebM: Firefox, Chrome, Opera, IE, Safari h.264: IE, Safari

Gromadzenie informacji WebStorage – gromadzenie informacji w lokalnej pamięci Web SQL Database – gromadzenie informacji w lokalnej bazie danych Indexed Database API – gromadzenie informacji w indeksowanej bazie danych Application Cache – przechowywanie zawartości całej strony w pamięci off-line API plikowe: FileSystem, File, FileWriter – obsługa plików i katalogów

Gromadzenie informacji

Łączność i realizacja zadań WebSocket Cross-Document messaging Serwer-Sent Events Geolocation Notifications WebWorkers

Łączność i realizacja zadań

Obsługa formularzy i stron Nowe elementy formularzy, takie jak paski postępu, suwaki, autouzupełnianie, kontrolki od wprowadzania liczb, dat, adresów… Obsługa walidacji zawartości znaczników – na podstawie typu elementu lub wyrażenia regularnego Speech Input API – możliwość wprowadzania danych przy użyciu głosu Zarządzanie historią odwiedzanych stron spod poziomu skryptów

Obsługa formularzy i stron

Semantyka stron Podział dokumentu na nagłówki, stopki, artykuły, sekcje umożliwiający łatwiejsze indeksowanie zawartości i wykrywanie tytułów Oznaczanie znaczenia poszczególnych fragmentów tekstu przy użyciu mikrodanych i mikroformatów, umożliwiające zrozumienie ich znaczenia, np. adres, imię i nazwisko, nazwa zespołu, firmy… Dodanie informacji nawigacyjnych zarówno na poziomie strony jak i poszczególnych odnośników

Semantyka stron

Wady HTML5 Problemy z kodekami Video – WebM vs h.254 Brak pełnej implementacji Standard ciągle rozwijany – następują w nim zmiany Ponad 40% wykorzystywanych przeglądarek go nie wspiera (wg. danych StatCounter) Różne przeglądarki implementują różne moduły standardu – mała część wspólna

Popularność Adobe Flash 1.2 miliarda telefonów komórkowych potrafi obsługiwać Flash 70% gier online wykorzystuje Flash 98% użytkowników Internetu z niego korzysta 85% ze 100 najpopularniejszych stron wykorzystuje Flash Wiele ważnych stron wykorzystuje Flash 2-3 miliony członków społeczności deweloperów technologii Flash 90% twórców posiada zainstalowaną obsługę Flash

Testy wydajności YouTube – odtwarzanie filmów WebM 720p (http://www.youtube.com/watch?v=e-fHh3a2ub4) Chrome 11 Firefox 4.0.1 Opera 11.11 Internet Explorer 9 Safari 5 HTML5 25% 10% 30% 14% 15% Adobe Flash 20% 16% 13% YouTube – wyniki testów z Wikipedii Chrome (Mac) Firefox (Mac) Safari Chrome (Win) Firefox (Win) Internet Explorer 8 Safari (Win) HTML5 49.89% - 12.39% X Adobe Flash 10 50.39% 40.25% 37.41% X-24% 22% 22.41 23.22% Adobe Flash 10.1 49.79% 42.07 32.07% X-58% 6% 14.62 7.43%

Co, kiedy wybrać? Kierunki rozwoju: Wypieranie XHTML i HTML 4.01 przez HTML5 Integracja obu standardów w zawartość stron Prognoza – brak dominującego standardu w najbliższym okresie Wybierz HTML5 Wybierz Adobe Flash W przypadku systemów o niskiej wydajności. Jeśli musisz obsługiwać wiele różnych, w tym starszych, przeglądarek. W przypadku ograniczeń finansowych. Gdy chcesz przetwarzać strumienie multimedialne wysokiej jakości. Jeśli chcesz być wspierany na produktach firmy Apple (iPad, iPhone, …) W przypadku gdy chcesz chronić zawartość publikowaną w sieci przed nieautoryzowanym wykorzystaniem. Jeśli chcesz pracować w otwartym środowisku Jeśli chcesz publikować reklamy zawierające wideo. W przypadku integracji komunikacji dwustronnej wykorzystującej strumienie multimedialne, np. rozmowy wideo.

Czy Adobe jest wrogiem HTML5? Adobe jest aktywnym członkiem grup zajmującym się tworzeniem i rozwijaniem standardu HTML5 W marcu 2011r. Adobe opublikowało wersję tesotową programu Wallaby – aplikacji pozwalającej na prostą i szybką konwersję plików źródłowych Action Script (Flash) do języka HTML5

Bibliografia Prezentacja HTML5 autorstwa Marcina Wicharego (http://slides.html5rocks.com) Wersja anglojęzyczna Wikipedii (http://en.wikipedia.org/wiki/HTML5) Materiały referencyjne World Wide Web Consortium (http://www.w3.org/TR/html5) i Web Hypertext Application Technology Working Group (http://www.whatwg.org/specs/web-apps/current-work/multipage)