HTML5: differenze tra le versioni

Versione delle 12:25, 23 apr 2022

Versione delle 03:10, 30 mag 2022

Riga 30:

=== Tag deprecati ===

HTML5 ha deprecato i seguenti tag e attributi presenti in HTML4 poiché la loro funzione è ora gestita dai CSS3<ref>{{Cita web|url=https://www.c-sharpcorner.com/blogs/html-tags-which-are-deprecated-in-html5|titolo=HTML Tags Which Are Deprecated In HTML5|sito=www.c-sharpcorner.com|lingua=en|accesso=3 febbraio 2021}}</ref>:

[[File:Deprecated-HTML.png|alt=Elementi HTML4 deprecati in HTML5|centro|miniatura|390x390px|Elementi HTML4 deprecati in HTML5]]

Riga 45:

=== Supporto dei browser ===

[[File:IE-HTML5.png|alt=Esempio di una pagina HTML5 in Internet Explorer 7|miniatura|Esempio di una pagina HTML5 in [[Windows Internet Explorer 7|Internet Explorer 7]]. Essa appare sfasata poiché il browser non riconosce le specifiche]]

Alla nascita di HTML5 il motore di rendering [[WebKit|Webkit]] (Chrome e Safari) fu il primo a interpretare in modo corretto molti dei nuovi codici, il secondo ad aggiornarsi da quel punto di vista fu Gecko (Firefox) e per ultimo Trindent (Internet Explorer). Per alcuni anni i siti web che utilizzavano i nuovi tag HTML disponibili venivano visti in maniera differente a seconda del browser che utilizzava l'utente<ref name=":0">{{Cita web|url=https://speckyboy.com/getting-to-grips-with-html5-browser-compatibility/|titolo=Getting to Grips with HTML5 Browser Compatibility|sito=Speckyboy Design Magazine|data=26 marzo 2012|lingua=en|accesso=3 febbraio 2021}}</ref>. In parte questo problema veniva risolto da tecniche come CSS alternativi appositamente per [[Internet Explorer]], commenti condizionali su misura per esso e librerie [[JavaScript]] come Modernizr<ref>{{Cita web|url=https://www.targetweb.it/css3-su-internet-explorer/|titolo=Css3 su Internet Explorer 8? - da oggi si può|sito=Target Web.it|data=8 aprile 2011|accesso=3 febbraio 2021}}</ref><ref name=":1">{{Cita web|url=https://www.sitepoint.com/internet-explorer-conditional-comments/|titolo=Internet Explorer Conditional Comments - SitePoint|sito=www.sitepoint.com|lingua=en|accesso=3 febbraio 2021}}</ref><ref>{{Cita web|url=https://alistapart.com/it/article/approfittare-di-html5-e-css3-con-modernizr/|titolo=Approfittare di HTML5 e CSS3 con Modernizr|autore=Faruk Ateş|sito=Italian A List Apart|data=5 luglio 2010|accesso=3 febbraio 2021}}</ref>. Dal 2019 [[Microsoft Edge]] supporta la maggior parte delle specifiche HTML5<ref>{{Cita web|url=https://html5test.com/compare/browser/edge-12.html|titolo=HTML5test - How well does your browser support HTML5?|sito=html5test.com|accesso=3 febbraio 2021}}</ref>.

== Novità ==

Riga 225:

== WAI ARIA ==

{{Vedi anche|Accessibilità (web)|Accessibilità (design)|Wai-aria}}'''WAI-ARIA (''Web Accessibility Initiative - Accessible Rich Internet Applications'')''' è un insieme di documenti pubblicati dal W3C ([[World Wide Web Consortium]]) che specificano come aumentare l'[[Accessibilità (design)|accessibilità]] dei contenuti dinamici e dei componenti per l'interfaccia utente sviluppati con [[AJAX]], [[HTML]], [[JavaScript]] e altre tecnologie collegate. HTML5 ha aggiunto nuove regole [[Wai-aria|WAI ARIA]]<ref>{{Cita web|url=https://www.w3.org/TR/wai-aria-1.1/|titolo=Accessible Rich Internet Applications (WAI-ARIA) 1.1|sito=www.w3.org|lingua=en|accesso=2021-02-22}}</ref>.

== Orientamento del dispositivo ==

[[File:Deviceorientation.png|alt=Esempio di deviceorientation e devicemotion|miniatura|Esempio di ''deviceorientation'' e ''devicemotion'']]

L'evento<code>deviceorientation</code>viene generato quando sono disponibili nuovi dati da un sensore di orientamento sull'orientamento corrente del dispositivo rispetto al riquadro delle [[Coordinate geografiche|coordinate]] terrestri. Questi dati vengono raccolti da un [[magnetometro]] all'interno del dispositivo. In pratica, quando si ruota il dispositivo su cui la pagina web viene visualizzata, l'oggetto che contiene questa API ruota in base all'asse x, y o z del dispositivo<ref>{{Cita web|url=https://developer.mozilla.org/en-US/docs/Web/API/Window/deviceorientation_event|titolo=Window: deviceorientation event - Web APIs {{!}} MDN|sito=developer.mozilla.org|lingua=en-US|accesso=2021-10-08}}</ref><ref>{{Cita web|url=https://www.w3.org/TR/orientation-event/Overview.html|titolo=DeviceOrientation Event Specification|sito=www.w3.org|accesso=2021-10-08}}</ref>.

Codice base:<syntaxhighlight lang="javascript">

Riga 240:

=== Movimento ===

Gli eventi di movimento vengono gestiti allo stesso modo degli eventi di orientamento, tranne per il fatto che hanno il proprio nome di evento: <code>devicemotion</code><ref>{{Cita web|url=https://www.html.it/articoli/html5-device-orientation-api-e-websocket/|titolo=HTML5 Device Orientation API e WebSocket|autore=Sandro Paganotti|sito=HTML.it|lingua=it-IT|accesso=2021-10-08}}</ref><ref>{{Cita web|url=https://www.sitepoint.com/using-device-orientation-html5/|titolo=Using Device Orientation in HTML5 - SitePoint|sito=www.sitepoint.com|lingua=en|accesso=2021-10-08}}</ref>.

Esempio:<syntaxhighlight lang="javascript">