# HTML 5

HTML5 (HyperText Markup Language, versió 5) és la cinquena gran revisió del llenguatge bàsic de la World Wide Web, HTML. HTML5 especifica dues variants de sintaxi per a HTML: un «clàssic» HTML (text / html), la variant coneguda com a HTML5, i una variant XHTML coneguda com a sintaxi XHTML5 que haurà de ser usada com a XML (XHTML) (application/xhtml+xml). Aquesta és la primera vegada que HTML i XHTML s'han desenvolupat en paral·lel. El desenvolupament d'aquest codi és regulat pel Consorci W3C.

## Nous elements

HTML5 estableix una sèrie de nous elements i atributs que reflecteixen l'ús típic dels llocs web moderns. Alguns d'ells són tècnicament similars a les etiquetes <div> i <span>, però tenen un significat semàntic, com ara <nav> (bloc de navegació del lloc web) i <footer>. Altres elements proporcionen noves funcionalitats a través d'una interfície estandarditzada, com els elements <audio> i <video>. També presenta millores en l'element <canvas>.
Alguns elements de HTML 4.01 han quedat obsolets, incloent elements purament de presentació, com <font> i <center>, ja que els efectes són manejats pel CSS. També es dona èmfasi en la importància de l'scripting DOM per al comportament de la web.

### Diferències amb HTML5 i XHTML

Com a nous elements: article, dialog.
Com a nous atributs: media, ping, autofocus, inputmode, min, max, pattern.
Els elements eliminats són: acronym, applet, basefont, big, center, dir, font, frame, frameset, isindex, noframes, s, strike, tt, u.
Atributs eliminats:
* rev i charset a <link> i <a>
* target a <link>
* nohref a <area>
* profile a <head>
* version a <html>
* name a <map>
* scheme a <meta>
* archive, classid, codetype, declare i standby a <object>
* valuetype a <param>
* charset a <script>
* summary a <table>
* header, axis i abbr a <td> i <th>

## Diferències detallades

| Etiqueta | Atributs | Comentaris |
| <!-- --> | Estàndard o cap | |
| <!DOCTYPE> | Estàndard o cap | |
| <a> | href | target | rel | hreflang | media | type | Atribut afegit: mediaAtribut canviat: Target |
| <abbr> | Estàndard o cap | |
| <acronym> | | Etiqueta eliminada |
| <address> | Estàndard o cap | |
| <applet> | | Etiqueta eliminada |
| <area> | Estàndard o cap | |
| <article> | Atributs globals | Nova etiqueta |
| <aside> | Atributs globals | Nova etiqueta |
| <audi> | autbuffer | autplay | controls | loop | src | Nova etiqueta |
| <b> | Atributs globals | Etiqueta canviada |
| <base> | Estàndard o cap | |
| <basefont> | | Etiqueta eliminada |
| <bb> | Estàndard o cap | |
| <bdo> | Estàndard o cap | |
| <big> | | Etiqueta eliminada |
| <blockquote> | Estàndard o cap | |
| <body> | Estàndard o cap | |
| <br> | Estàndard o cap | |
| <button> | Estàndard o cap | |
| <canvas> | height | width | Nova etiqueta |
| <captin> | Estàndard o cap | |
| <center> | | Etiqueta eliminada |
| <cite> | Atributs globals | Etiqueta canviada |
| <code> | Estàndard o cap | |
| <col> | Estàndard o cap | |
| <colgroup> | Estàndard o cap | |
| <command> | checked | default | disabled | hidden | icon | label | radigroup | type | Nova etiqueta |
| <datagrid> | Estàndard o cap | |
| <datalist> | Atributs globals | Nova etiqueta |
| <dd> | Estàndard o cap | |
| <del> | Estàndard o cap | |
| <details> | open | Nova etiqueta |
| <dialog> | Atributs globals | Nova etiqueta |
| <dir> | | Etiqueta eliminada |
| <div> | Estàndard o cap | |
| <dfn> | Estàndard o cap | |
| <dl> | Estàndard o cap | |
| <dt> | Estàndard o cap | |
| <em> | Estàndard o cap | |
| <embed> | height | src | type | width | Nova etiqueta |
| <fieldset> | Estàndard o cap | |
| <figure> | Atributs globals | Nova etiqueta |
| <font> | | Etiqueta eliminada |
| <footer> | Atributs globals | Nova etiqueta |
| <form> | Estàndard o cap | |
| <frame> | | Etiqueta eliminada |
| <frameset> | | Etiqueta eliminada |
| <h1> ... <h6> | Estàndard o cap | |
| <head> | Estàndard o cap | |
| <header> | Atributs globals | Nova etiqueta |
| <hgroup> | Atributs globals | Nova etiqueta |
| <hr> | cap | Etiqueta canviada |
| <html> | Estàndard o cap | |
| <i> | cap | Etiqueta canviada |
| <iframe> | Estàndard o cap | |
| <img> | Estàndard o cap | |
| <input> | accept | alt | aut-complete | autfocus | cheked | disabled | form | formactin | formenctype | formmethod | formnovalidate | formtarget | height | list | max | maxlength | min | multiple | name | pattern1 placeholder | readonly | required | size | src | step | type | value | width | Etiqueta canviada: Afegits 13 elements a type |
| <ins> | Estàndard o cap | |
| <isindex> | | Etiqueta eliminada |
| <kbd> | Estàndard o cap | |
| <label> | Estàndard o cap | |
| <legend> | Estàndard o cap | |
| <li> | Estàndard o cap | |
| <link> | Estàndard o cap | |
| <mark> | Atributs globals | Nova etiqueta |
| <map> | Estàndard o cap | |
| <menu> | Estàndard o cap | |
| <meta> | Estàndard o cap | |
| <meter> | high | low | max | min | optimum | value | Nova etiqueta |
| <nav> | Atributs globals | Nova etiqueta |
| <noframes> | | Etiqueta eliminada |
| <noscript> | Estàndard o cap | |
| <object> | Estàndard o cap | |
| <ol> | Estàndard o cap | |
| <optgroup> | Estàndard o cap | |
| <optin> | Estàndard o cap | |
| <output> | form | Nova etiqueta |
| <p> | Estàndard o cap | |
| <param> | Estàndard o cap | |
| <pre> | Estàndard o cap | |
| <progress> | max | value | Nova etiqueta |
| <q> | | |
| <ruby> | cite | Nova etiqueta |
| <rp> | Atributs globals | Nova etiqueta |
| <rt> | Atributs globals | Nova etiqueta |
| 
 | | Etiqueta eliminada |
| <samp> | Estàndard o cap | |
| <script> | Estàndard o cap | |
| <sectin> | cite | Nova etiqueta |
| <select> | Estàndard o cap | |
| <small> | Atributs globals | Etiqueta Canviada |
| <source> | media | src | type | Nova etiqueta |
| <span> | Estàndard o cap | |
| <strike> | | Etiqueta eliminada |
| <strong> | Estàndard o cap | |
| <style> | Estàndard o cap | |
| <sub> | Estàndard o cap | |
| <sup> | Estàndard o cap | |
| <table> | Estàndard o cap | |
| <tbody> | Estàndard o cap | |
| <td> | Estàndard o cap | |
| <textarea> | Estàndard o cap | |
| <tfoot> | Estàndard o cap | |
| <th> | Estàndard o cap | |
| <thead> | Estàndard o cap | |
| <time> | datetime | pubdate | Nova etiqueta |
| <title> | Estàndard o cap | |
| <tr> | Estàndard o cap | |
| <tt> | | Etiqueta eliminada |
| <u> | | Etiqueta eliminada |
| <ul> | Estàndard o cap | |
| <var> | Estàndard o cap | |
| <video> | src | poster | autbuffer | autplay | loop | controls | width | height | Nova etiqueta |
| <xmp> | | Etiqueta eliminada |
Notes: En groc aquelles etiquetes introduïdes en aquesta nova versió, en blau les etiquetes que han sigut canviades tot o en part i en gris les etiquetes eliminades d'aquesta versió. Si bé a la pràctica els navegadors no ho estan tenint en compte per evitar perdre quota de mercat.

## Novetats

* Incorpora etiquetes (canvas 2D i 3D, àudio, vídeo) amb còdecs per mostrar els continguts multimèdia. Actualment hi ha una lluita entre imposar còdecs lliures (WebM+VP8) o privatius (H.264/MPEG-4 AVC).
* Etiquetes per manejar grans conjunts de dades: DataGrid, Details, Menu i Command. Permeten generar taules dinàmiques que poden filtrar, ordenar i amagar contingut en client.
* Millores en els formularis. Nous tipus de dades (eMail, number, url, datetime ...) i facilitats per validar el contingut sense Javascript.
* Visors: MathML (fórmules matemàtiques) i SVG (gràfics vectorials). En general es deixa obert a poder interpretar altres llenguatges XML.
* Drag & Drop. Nova funcionalitat per arrossegar objectes com imatges.

## Web Semàntica

* Afegeix etiquetes per gestionar la Web Semàntica (Web 3.0): header, footer, article, nav, time (data del contingut), link rel =(tipus de contingut que s'enllaça).
* Aquestes etiquetes permeten descriure quin és el significat del contingut. Per exemple la seva importància, la seva finalitat i les relacions que existeixen. No tenen especial impacte en la visualització, s'orienten a cercadors.
* Els cercadors poden indexar i interpretar aquesta meta informació per no buscar simplement aparicions de paraules en el text de la pàgina.
* Permet incorporar a les pàgines fitxers RDF/OWL (amb meta informació) per descriure relacions entre els termes utilitzats.

## Noves APIs i Javascript

* API per fer Drag & Drop. Mitjançant esdeveniments.
* API per treballar Off-Line. Permet descarregar tots els continguts necessaris i treballar en local.
* API de Geoposicionament per a dispositius que ho suportin.
* API Storage. Facilitat d'emmagatzematge persistent en local, amb bases de dades (basades en SQL Lite) o amb emmagatzematge d'objectes per aplicació o per domini web (Local Storage i Global Storage). Es disposa d'una Base de dades amb la possibilitat de fer consultes SQL.
* WebSockets. API de comunicació bidireccional entre pàgines. Similar als Sockets de C.
* WebWorkers. Fils d'execució en paral·lel.
* ESTÀNDARD FUTUR. System Information API. Accés al maquinari a baix nivell: xarxa, fitxers, CPU, Memòria, ports USB, càmeres, micròfons ... molt interessant però amb nombroses excepcions de seguretat.

## Exemples de codis HTML5

Codi HTML5 per a reproduir audio sense flash:

## Referències

* ↑ W3C. «HTML 5» (en anglès). Ian Hickson y David Hyatt, 06-10-2009. [Consulta: 6 octubre 2009].

## Enllaços externs

* Esborrany actual d'especificacions d'HTML5.
* Font del codi HTML5