Pobierz prezentację
Pobieranie prezentacji. Proszę czekać
2
Damian Zawada Damian.Zawada@praktyki.onmicrosoft.com
4
Narzędzia
5
Drobny pokaz możliwości
6
Czy HTML5… istnieje? Odpowiedź na to pytanie jest trochę bardziej skomplikowana niż mogłoby się wydawać.
7
Krótka lekcja historii
W3C (1 października 1994 roku) zrzesza ponad 400 organizacji. Ostatni zatwierdzony standard HTML rok. HTML5 tak naprawdę jeszcze nie skończony. Jednak Microsoft na najlepszej drodze do osiągnięcia celu ;)
8
Proces zatwierdzania znaczników
9
Jak wygląda sprawa aktualnie
10
Ktoś mógłby powiedzieć, że jest słabo ale wbrew pozorom jest całkiem nieźle, bo mimo wszystko dostajemy kilka fajnych bajerów.
11
Składniowe rzeczy Jedną z fajniejszych rzeczy jest fakt, że w HTML5 nie musimy domykać znaczników!!! Nie ma również potrzeby wstawiania cudzysłowu w ścieżce, oraz znaczenie straciła wielkość liter.
12
Kilka przykładów <img src=„usmiech/jpg” /> == <img src=„usmiech.jpg”> <img src=„usmiech.jpg „/>==<img src=usmiech.jpg/> <img src = usmiech.jpg>==<iMG sRc=usmiech.jpg>
13
Video/audio
14
Zaczniemy od video <video id=„video” controls autoplay> <source src=„jakies.mp4”type=„video/mp4”/> </video>
15
Obsługiwane formaty
16
No to teraz audio <audio id=„audio” src=„jakies.mp3” controls> </audio> Atrybuty: src, autoplay, controls, preload
17
Wygląd odtwarzaczy audio
18
Obsługiwane formaty audio
19
Tagi semantyczne
20
Najpopularniejsze ID
21
Tagi semantyczne bardziej ogólnie
22
<canvas> Znacznik ten pozwala dynamicznie renderować grafikę 2D, oraz bitmapy. Canvas zawiera region z parametrami height i width. Wykorzystuje się go przy animacjach, grach, budowaniu grafów. Pracuje na niskim poziomie.
23
Przykład <canvas id="example" width="200" height="200"> Twoja przeglądarka lami :P</canvas> var example = document.getElementById('example'); var context = example.getContext('2d'); context.fillStyle = "rgb(255,0,0)"; context.fillRect(30, 30, 50, 50);
24
<svg> Jest rozwijane przez W3C. Format grafiki wektorowej zarówno statycznej jak i dynamicznej. Należy do rodziny XML. Istnieje szansa, że zastąpi format grafiki wektorowej Adobe.
25
Przykład
26
<svg> czy <canvas> ???
27
Podsumowanie Nowy HTML daje nam dużo więcej możliwości, chociażby ze względu na wsparcie sprzętowe o którym wcześniej można było tylko marzyć. Mogę wyjawić, że to przyszłość Na koniec zdjęcie lemura.
29
Pytania?????????
30
Dziękuję za uwagę!!! Zapraszam na dalsze prezentacje
TAADAAAAAAAAAAMMMMM!!! Dziękuję za uwagę!!! Zapraszam na dalsze prezentacje
Podobne prezentacje
