HTML 5
From Wikipedia, the free encyclopedia
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).[1] 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.
 | |
 | |
| Tipus | Markup language |
|---|---|
| Extensió | HTML: .html, .htm XHTML: .xhtml, .xht, .xml |
| MIME | HTML: text/html XHTML: application/xhtml+xml, application/xml |
| Codi de tipus | TEXT |
| Uniform Type Identifier | public.html |
| Desenvolupador | W3C HTML WG, WHATWG |
| Versió inicial | 28 octubre 2014 |
| Extensió de | Standard Generalized Markup Language |
| Estàndard | |
| Més informació | |
| Stack Exchange | Etiqueta, Etiqueta, Etiqueta, Etiqueta, Etiqueta, Etiqueta, Etiqueta, Etiqueta, Etiqueta, Etiqueta, Etiqueta i Etiqueta |
| LocFDD | fdd000481 |
| PRONOM | fmt/471 |
| Lloc web | html.spec.whatwg.org… |
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: media Atribut canviat: Target |
<abbr> |
Estàndard o cap |
|
Etiqueta eliminada | ||
<address> |
Estàndard o cap |
|
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 |
|
Etiqueta eliminada | ||
<bb> |
Estàndard o cap |
|
<bdo> |
Estàndard o cap |
|
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 |
|
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 |
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 |
Etiqueta eliminada | ||
<footer> |
Atributs globals |
Nova etiqueta |
<form> |
Estàndard o cap |
|
Etiqueta eliminada | ||
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 |
|
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 |
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 |
|
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 |
|
Etiqueta eliminada | ||
Etiqueta eliminada | ||
<ul> |
Estàndard o cap |
|
<var> |
Estàndard o cap |
|
<video> |
src | poster | autbuffer | autplay | loop | controls | width | height |
Nova etiqueta |
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:
<html>
<head>
<title>font de múltiples elements</title>
</head>
<body>
<audio id="audioTestElem" autobuffer controls >
El teu navegador no suporta l'etiqueta d'audio a HTML5.
</audio>
</body>
</html>Referències
Enllaços externs
Wikiwand - on
Seamless Wikipedia browsing. On steroids.