SlideShare a Scribd company logo
1 of 10
HTML5– Semantics Štěpán Bechynský, @stepanb Developer Evangelist Microsoft, Czech Republic
What is HTML5? HTML5 is future of the web development HTML5 is future platform for some consumer applications HTML5 is future platform for connected devices (smartphones, tablets) Web Performance Working Group HTML5 is multiplatform HTML5 is markup or set of more technologies HTML5 is not final  HTML5 Markup Last Call started on 24th of May 2011 http://lists.w3.org/Archives/Public/public-html/2011May/0162.html
Back to roots Current semantics elements <h1>, <h2>, <strong>, … But what is <div>?  Source: Introducing HTML5
Small statistics Source: http://devfiles.myopera.com/articles/572/idlist-url.htm
Semantics element of HTML5 Source: Introducing HTML5
Selection of HTML5 semantics elements section nav article aside hgroup header footer figure figcaption mark
Thearticle element The article element represents a self-contained composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content. When article elements are nested, the inner article elements represent articles that are in principle related to the contents of the outer article. For instance, a blog entry on a site that accepts user-submitted comments could represent the comments as article elements nested within the article element for the blog entry. Zdroj: http://dev.w3.org/html5/spec/sections.html#the-article-element
Microdata Add more semantics to elements Supported by search engines Bing, Google, Yahoo Dictionaries on http://www.schema.org/ Attributes itemscope itemtype itemprop itemref itemid
Custom data attributes Custom data typically used by application Syntax: data-my-key Example of usages – jQuery Mobile <div data-role="page"> 	<div data-role="content"> 	… 	</div> </div>
HTML5.cz Shromažďuje české zdroje Komunitní překlad knihy Marka Pilgrima „Dive into HTML5“

More Related Content

Similar to HTML5 (Štěpán Bechynský)

Morley HTML5 and the Future
Morley HTML5 and the FutureMorley HTML5 and the Future
Morley HTML5 and the FutureJessica Morley
 
HTML5: The next disruptive technology
HTML5:  The next disruptive technologyHTML5:  The next disruptive technology
HTML5: The next disruptive technologyLinda Jacobson
 
Hyper Text Markup Language, Cascading Style Sheet
Hyper Text Markup Language, Cascading Style SheetHyper Text Markup Language, Cascading Style Sheet
Hyper Text Markup Language, Cascading Style SheetNitinShelake4
 
Science kjadnckj ljnadjc lk cnldj cj nlzkdncaj
Science kjadnckj ljnadjc lk cnldj cj nlzkdncajScience kjadnckj ljnadjc lk cnldj cj nlzkdncaj
Science kjadnckj ljnadjc lk cnldj cj nlzkdncajkefije9797
 
WD 2 Less Gooooooooooofwfweujb iefieniwenfwefuhw
WD 2 Less Gooooooooooofwfweujb iefieniwenfwefuhwWD 2 Less Gooooooooooofwfweujb iefieniwenfwefuhw
WD 2 Less Gooooooooooofwfweujb iefieniwenfwefuhwkefije9797
 
WEB MODULE 1.pdf
WEB MODULE 1.pdfWEB MODULE 1.pdf
WEB MODULE 1.pdfDeepika A B
 
What is hot on the web right now - A W3C perspective
What is hot on the web right now - A W3C perspectiveWhat is hot on the web right now - A W3C perspective
What is hot on the web right now - A W3C perspectiveArmin Haller
 
Eugene Poltorakov.HTML 5 and drupal.DrupalCamp Kiev 2011
Eugene Poltorakov.HTML 5 and drupal.DrupalCamp Kiev 2011Eugene Poltorakov.HTML 5 and drupal.DrupalCamp Kiev 2011
Eugene Poltorakov.HTML 5 and drupal.DrupalCamp Kiev 2011camp_drupal_ua
 
HTML5, the Evolution of Smart Media
HTML5, the Evolution of Smart MediaHTML5, the Evolution of Smart Media
HTML5, the Evolution of Smart MediaSeungyun Lee
 
IJCER (www.ijceronline.com) International Journal of computational Engineerin...
IJCER (www.ijceronline.com) International Journal of computational Engineerin...IJCER (www.ijceronline.com) International Journal of computational Engineerin...
IJCER (www.ijceronline.com) International Journal of computational Engineerin...ijceronline
 

Similar to HTML5 (Štěpán Bechynský) (20)

Technology Research
Technology ResearchTechnology Research
Technology Research
 
Actsheet10
Actsheet10Actsheet10
Actsheet10
 
Morley HTML5 and the Future
Morley HTML5 and the FutureMorley HTML5 and the Future
Morley HTML5 and the Future
 
HTML5: The next disruptive technology
HTML5:  The next disruptive technologyHTML5:  The next disruptive technology
HTML5: The next disruptive technology
 
HTML 5
HTML 5HTML 5
HTML 5
 
Html5
Html5Html5
Html5
 
Hyper Text Markup Language, Cascading Style Sheet
Hyper Text Markup Language, Cascading Style SheetHyper Text Markup Language, Cascading Style Sheet
Hyper Text Markup Language, Cascading Style Sheet
 
WEB Mod1@AzDOCUMENTS.in (1).pdf
WEB Mod1@AzDOCUMENTS.in (1).pdfWEB Mod1@AzDOCUMENTS.in (1).pdf
WEB Mod1@AzDOCUMENTS.in (1).pdf
 
Science kjadnckj ljnadjc lk cnldj cj nlzkdncaj
Science kjadnckj ljnadjc lk cnldj cj nlzkdncajScience kjadnckj ljnadjc lk cnldj cj nlzkdncaj
Science kjadnckj ljnadjc lk cnldj cj nlzkdncaj
 
WD 2 Less Gooooooooooofwfweujb iefieniwenfwefuhw
WD 2 Less Gooooooooooofwfweujb iefieniwenfwefuhwWD 2 Less Gooooooooooofwfweujb iefieniwenfwefuhw
WD 2 Less Gooooooooooofwfweujb iefieniwenfwefuhw
 
WEB MODULE 1.pdf
WEB MODULE 1.pdfWEB MODULE 1.pdf
WEB MODULE 1.pdf
 
What is hot on the web right now - A W3C perspective
What is hot on the web right now - A W3C perspectiveWhat is hot on the web right now - A W3C perspective
What is hot on the web right now - A W3C perspective
 
Eugene Poltorakov.HTML 5 and drupal.DrupalCamp Kiev 2011
Eugene Poltorakov.HTML 5 and drupal.DrupalCamp Kiev 2011Eugene Poltorakov.HTML 5 and drupal.DrupalCamp Kiev 2011
Eugene Poltorakov.HTML 5 and drupal.DrupalCamp Kiev 2011
 
HTML5, the Evolution of Smart Media
HTML5, the Evolution of Smart MediaHTML5, the Evolution of Smart Media
HTML5, the Evolution of Smart Media
 
IJCER (www.ijceronline.com) International Journal of computational Engineerin...
IJCER (www.ijceronline.com) International Journal of computational Engineerin...IJCER (www.ijceronline.com) International Journal of computational Engineerin...
IJCER (www.ijceronline.com) International Journal of computational Engineerin...
 
Html5
Html5Html5
Html5
 
Html5
Html5Html5
Html5
 
Html5
Html5Html5
Html5
 
Html5
Html5Html5
Html5
 
Html5
Html5Html5
Html5
 

More from Národní technická knihovna (NTK)

Overlooked Principles of Strategic Management of Research at a National Level...
Overlooked Principles of Strategic Management of Research at a National Level...Overlooked Principles of Strategic Management of Research at a National Level...
Overlooked Principles of Strategic Management of Research at a National Level...Národní technická knihovna (NTK)
 
Využití bibliometrických ukazatelů v řízení výzkumné instituce (Daniel Münich...
Využití bibliometrických ukazatelů v řízení výzkumné instituce (Daniel Münich...Využití bibliometrických ukazatelů v řízení výzkumné instituce (Daniel Münich...
Využití bibliometrických ukazatelů v řízení výzkumné instituce (Daniel Münich...Národní technická knihovna (NTK)
 
Bibliometrie v Národní technické knihovně: metody, zkušenosti, mise a vize (J...
Bibliometrie v Národní technické knihovně: metody, zkušenosti, mise a vize (J...Bibliometrie v Národní technické knihovně: metody, zkušenosti, mise a vize (J...
Bibliometrie v Národní technické knihovně: metody, zkušenosti, mise a vize (J...Národní technická knihovna (NTK)
 
Rešeršní služby v komerčním sektoru (Martin Mlčoch, nezávislý konzultant)
Rešeršní služby v komerčním sektoru (Martin Mlčoch, nezávislý konzultant)Rešeršní služby v komerčním sektoru (Martin Mlčoch, nezávislý konzultant)
Rešeršní služby v komerčním sektoru (Martin Mlčoch, nezávislý konzultant)Národní technická knihovna (NTK)
 
Speciální informační služby pro zdravotníky v Národní lékařské knihovně (Mgr....
Speciální informační služby pro zdravotníky v Národní lékařské knihovně (Mgr....Speciální informační služby pro zdravotníky v Národní lékařské knihovně (Mgr....
Speciální informační služby pro zdravotníky v Národní lékařské knihovně (Mgr....Národní technická knihovna (NTK)
 
Rešeršní služby v NK ČR (Mgr. Karolína Košťálová, NK ČR)
 Rešeršní služby v NK ČR (Mgr. Karolína Košťálová, NK ČR)  Rešeršní služby v NK ČR (Mgr. Karolína Košťálová, NK ČR)
Rešeršní služby v NK ČR (Mgr. Karolína Košťálová, NK ČR) Národní technická knihovna (NTK)
 
Model rešeršních služeb v NTK (Bc. Drahomíra Dvořáková, NTK)
 Model rešeršních služeb v NTK (Bc. Drahomíra Dvořáková, NTK)  Model rešeršních služeb v NTK (Bc. Drahomíra Dvořáková, NTK)
Model rešeršních služeb v NTK (Bc. Drahomíra Dvořáková, NTK) Národní technická knihovna (NTK)
 
Rešeršní služby Bibliografie dějin Českých zemí v Historickém ústavu AV ČR (M...
Rešeršní služby Bibliografie dějin Českých zemí v Historickém ústavu AV ČR (M...Rešeršní služby Bibliografie dějin Českých zemí v Historickém ústavu AV ČR (M...
Rešeršní služby Bibliografie dějin Českých zemí v Historickém ústavu AV ČR (M...Národní technická knihovna (NTK)
 
Co znamená, že Google o nás ví víc než my sami; aneb zaprodáme duši vyhledáva...
Co znamená, že Google o nás ví víc než my sami; aneb zaprodáme duši vyhledáva...Co znamená, že Google o nás ví víc než my sami; aneb zaprodáme duši vyhledáva...
Co znamená, že Google o nás ví víc než my sami; aneb zaprodáme duši vyhledáva...Národní technická knihovna (NTK)
 
Co se skrývá za vyhledáváním v katalogu NTK (Kristýna Busch, Eliška Veselá)
Co se skrývá za vyhledáváním v katalogu NTK (Kristýna Busch, Eliška Veselá)Co se skrývá za vyhledáváním v katalogu NTK (Kristýna Busch, Eliška Veselá)
Co se skrývá za vyhledáváním v katalogu NTK (Kristýna Busch, Eliška Veselá)Národní technická knihovna (NTK)
 

More from Národní technická knihovna (NTK) (20)

Overlooked Principles of Strategic Management of Research at a National Level...
Overlooked Principles of Strategic Management of Research at a National Level...Overlooked Principles of Strategic Management of Research at a National Level...
Overlooked Principles of Strategic Management of Research at a National Level...
 
Využití bibliometrických ukazatelů v řízení výzkumné instituce (Daniel Münich...
Využití bibliometrických ukazatelů v řízení výzkumné instituce (Daniel Münich...Využití bibliometrických ukazatelů v řízení výzkumné instituce (Daniel Münich...
Využití bibliometrických ukazatelů v řízení výzkumné instituce (Daniel Münich...
 
Zkušenosti Knihovny Akademie věd ČR (Pavel Míka, AV ČR)
Zkušenosti Knihovny Akademie věd ČR (Pavel Míka, AV ČR)Zkušenosti Knihovny Akademie věd ČR (Pavel Míka, AV ČR)
Zkušenosti Knihovny Akademie věd ČR (Pavel Míka, AV ČR)
 
Bibliometrie v Národní technické knihovně: metody, zkušenosti, mise a vize (J...
Bibliometrie v Národní technické knihovně: metody, zkušenosti, mise a vize (J...Bibliometrie v Národní technické knihovně: metody, zkušenosti, mise a vize (J...
Bibliometrie v Národní technické knihovně: metody, zkušenosti, mise a vize (J...
 
Bibliometrie: přínosy, úskalí (Jiří Jirát, VŠCHT)
Bibliometrie: přínosy, úskalí (Jiří Jirát, VŠCHT)Bibliometrie: přínosy, úskalí (Jiří Jirát, VŠCHT)
Bibliometrie: přínosy, úskalí (Jiří Jirát, VŠCHT)
 
Rozhraní VPK
Rozhraní VPKRozhraní VPK
Rozhraní VPK
 
Šmankote, co je to NUŠL? (aktualizovaná verze 2014)
Šmankote, co je to NUŠL? (aktualizovaná verze 2014)Šmankote, co je to NUŠL? (aktualizovaná verze 2014)
Šmankote, co je to NUŠL? (aktualizovaná verze 2014)
 
Rešeršní služby v komerčním sektoru (Martin Mlčoch, nezávislý konzultant)
Rešeršní služby v komerčním sektoru (Martin Mlčoch, nezávislý konzultant)Rešeršní služby v komerčním sektoru (Martin Mlčoch, nezávislý konzultant)
Rešeršní služby v komerčním sektoru (Martin Mlčoch, nezávislý konzultant)
 
Speciální informační služby pro zdravotníky v Národní lékařské knihovně (Mgr....
Speciální informační služby pro zdravotníky v Národní lékařské knihovně (Mgr....Speciální informační služby pro zdravotníky v Národní lékařské knihovně (Mgr....
Speciální informační služby pro zdravotníky v Národní lékařské knihovně (Mgr....
 
Rešeršní služby v NK ČR (Mgr. Karolína Košťálová, NK ČR)
 Rešeršní služby v NK ČR (Mgr. Karolína Košťálová, NK ČR)  Rešeršní služby v NK ČR (Mgr. Karolína Košťálová, NK ČR)
Rešeršní služby v NK ČR (Mgr. Karolína Košťálová, NK ČR)
 
Legislativní rámec rešerší (Mgr. Alena Pavelová, NTK)
Legislativní rámec rešerší (Mgr. Alena Pavelová, NTK) Legislativní rámec rešerší (Mgr. Alena Pavelová, NTK)
Legislativní rámec rešerší (Mgr. Alena Pavelová, NTK)
 
Model rešeršních služeb v NTK (Bc. Drahomíra Dvořáková, NTK)
 Model rešeršních služeb v NTK (Bc. Drahomíra Dvořáková, NTK)  Model rešeršních služeb v NTK (Bc. Drahomíra Dvořáková, NTK)
Model rešeršních služeb v NTK (Bc. Drahomíra Dvořáková, NTK)
 
Rešeršní služby Bibliografie dějin Českých zemí v Historickém ústavu AV ČR (M...
Rešeršní služby Bibliografie dějin Českých zemí v Historickém ústavu AV ČR (M...Rešeršní služby Bibliografie dějin Českých zemí v Historickém ústavu AV ČR (M...
Rešeršní služby Bibliografie dějin Českých zemí v Historickém ústavu AV ČR (M...
 
Novinky ve vyhledávání Seznam .cz (Otakar Smrž)
Novinky ve vyhledávání Seznam .cz (Otakar Smrž)Novinky ve vyhledávání Seznam .cz (Otakar Smrž)
Novinky ve vyhledávání Seznam .cz (Otakar Smrž)
 
Co znamená, že Google o nás ví víc než my sami; aneb zaprodáme duši vyhledáva...
Co znamená, že Google o nás ví víc než my sami; aneb zaprodáme duši vyhledáva...Co znamená, že Google o nás ví víc než my sami; aneb zaprodáme duši vyhledáva...
Co znamená, že Google o nás ví víc než my sami; aneb zaprodáme duši vyhledáva...
 
Vyhledávání hudbou: YouTube trochu jinak (Ondřej Voců)
Vyhledávání hudbou: YouTube trochu jinak (Ondřej Voců)Vyhledávání hudbou: YouTube trochu jinak (Ondřej Voců)
Vyhledávání hudbou: YouTube trochu jinak (Ondřej Voců)
 
Co se skrývá za vyhledáváním v katalogu NTK (Kristýna Busch, Eliška Veselá)
Co se skrývá za vyhledáváním v katalogu NTK (Kristýna Busch, Eliška Veselá)Co se skrývá za vyhledáváním v katalogu NTK (Kristýna Busch, Eliška Veselá)
Co se skrývá za vyhledáváním v katalogu NTK (Kristýna Busch, Eliška Veselá)
 
Kouzlo muzejní noci
Kouzlo muzejní nociKouzlo muzejní noci
Kouzlo muzejní noci
 
Postery ntk
Postery ntkPostery ntk
Postery ntk
 
Referenční služby NK ČR (Lenka Válková)
Referenční služby NK ČR (Lenka Válková)Referenční služby NK ČR (Lenka Válková)
Referenční služby NK ČR (Lenka Válková)
 

Recently uploaded

presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century educationjfdjdjcjdnsjd
 
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfRising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfOrbitshub
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWERMadyBayot
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FMESafe Software
 
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Orbitshub
 
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Angeliki Cooney
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businesspanagenda
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Victor Rentea
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...DianaGray10
 
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...apidays
 
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityPlatformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityWSO2
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxRustici Software
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDropbox
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistandanishmna97
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdfSandro Moreira
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontologyjohnbeverley2021
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Victor Rentea
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...apidays
 
WSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2
 

Recently uploaded (20)

presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfRising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
 
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
 
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityPlatformless Horizons for Digital Adaptability
Platformless Horizons for Digital Adaptability
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistan
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontology
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
WSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering Developers
 

HTML5 (Štěpán Bechynský)

  • 1. HTML5– Semantics Štěpán Bechynský, @stepanb Developer Evangelist Microsoft, Czech Republic
  • 2. What is HTML5? HTML5 is future of the web development HTML5 is future platform for some consumer applications HTML5 is future platform for connected devices (smartphones, tablets) Web Performance Working Group HTML5 is multiplatform HTML5 is markup or set of more technologies HTML5 is not final HTML5 Markup Last Call started on 24th of May 2011 http://lists.w3.org/Archives/Public/public-html/2011May/0162.html
  • 3. Back to roots Current semantics elements <h1>, <h2>, <strong>, … But what is <div>? Source: Introducing HTML5
  • 4. Small statistics Source: http://devfiles.myopera.com/articles/572/idlist-url.htm
  • 5. Semantics element of HTML5 Source: Introducing HTML5
  • 6. Selection of HTML5 semantics elements section nav article aside hgroup header footer figure figcaption mark
  • 7. Thearticle element The article element represents a self-contained composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content. When article elements are nested, the inner article elements represent articles that are in principle related to the contents of the outer article. For instance, a blog entry on a site that accepts user-submitted comments could represent the comments as article elements nested within the article element for the blog entry. Zdroj: http://dev.w3.org/html5/spec/sections.html#the-article-element
  • 8. Microdata Add more semantics to elements Supported by search engines Bing, Google, Yahoo Dictionaries on http://www.schema.org/ Attributes itemscope itemtype itemprop itemref itemid
  • 9. Custom data attributes Custom data typically used by application Syntax: data-my-key Example of usages – jQuery Mobile <div data-role="page"> <div data-role="content"> … </div> </div>
  • 10. HTML5.cz Shromažďuje české zdroje Komunitní překlad knihy Marka Pilgrima „Dive into HTML5“

Editor's Notes

  1. http://lists.w3.org/Archives/Public/public-html/2011May/0162.html
  2. Open en.wikipedia.orgShowstructureofmainpageOpen facebook.comShowstructureofmainpageOpen twitter.comShowstructureofmainpage – itisHTML5oreilly.comShowstructureofmainpageThere are repeatedidslikecontent, page, footer,…
  3. Itcanbe very usefullforscreenreaders
  4. Every element has descriptionhow-to use it.
  5. Open http://dev.w3.org/html5/spec/sections.htmlShow specificationforeach elementDemoOpenWebmatrixCreatenewsitefromtemplate – StarterSiteOpen it in Visual Studio 2010 SP1 with ASP.NET Web Pages supportAddsemanticselementsAddpicturewithfigure and figcaptionDisputeaboutit, specialheader and nav on the top
  6. Show Dictionaries on http://www.schema.org/
  7. http://dev.w3.org/html5/spec/elements.html#embedding-custom-non-visible-data-with-the-data-attributes