HTML5

This translation is incomplete. Please help translate this article from English.

HTML5 és l'última evolució de la norma que defineix HTML. El terme representa dos conceptes diferents:

  • És una nova versió del llenguatge HTML, amb nous elements, atributs i comportaments,
  • i un ampli conjunt de tecnologies que permet les més diverses i potents aplicacions i llocs web. Aquest conjunt es diu de vegades HTML5 i amics i, sovint escurçat a simplement HTML5.

Dissenyat per a ser utilitzable per tots els desenvolupadors de la Web Oberta, aquesta pàgina de referència enllaça a nombrosos recursos sobre tecnologies HTML5, que es classifiquen en diversos grups segons la seva funció.

  • Semàntica: us permet descriure amb major precisió quin és el seu contingut.
  • Connectivitat: us permet comunicar-vos amb el servidor de formes noves i innovadores.
  • Fora de línia i emmagatzematge: permetre que les pàgines web emmagatzemin les dades localment en el client i funcionin de forma més eficient.
  • Multimèdia: fer ciutadans de primera classe d'àudio i vídeo a la Web Oberta.
  • Gràfics i efectes 2D/3D: permetre una gamma molt més àmplia d'opcions de presentació.
  • Rendiment i integració: proporcionar una major optimització de la velocitat i un millor ús del maquinari de l'equip.
  • Accés al dispositiu: permetre l'ús de diversos dispositius d'entrada i de sortida..
  • Estil: deixar que els autors escriuen temes més sofisticats.

SemàntIcA

Seccions i esquemes en HTML5
Una ullada als nous elements d'esquema i secció en HTML5: <section>, <article>, <nav>, <header>, <footer> i <aside>.
Ús d'àudio i vídeo en HTML5
Els elements <àudio> i <vídeo> incrustats, permeten la manipulació dels nous continguts multimèdia.
Formularis en HTML5
Una mirada a les millores en els formularis web en HTML5: l'API de validació restringida, diversos atributs nous, nous valors per l'atribut type de l'element <input>  i l'element nou <output>.
Nous elements semàntics
Al costat dels elements de seccions, de medis i de formularis, hi ha nombrosos elements nous, com <mark>, <figure>, <figcaption>, <data>, <time>, <output>, <progress> o <meter> i <main>, augmentant la quantitat d'elements HTML5 vàlids.
Millora en {{HTMLElement ("iframe")}}
Utilitzant els atributs sandbox i srcdoc, els autors ara poden ser precisos sobre el nivell de seguretat i la representació desitjada d'un element <iframe>.
MathML
Permet la incorporació directa de fórmules matemàtiques.
Introducció a HTML5
Aquest article presenta com indicar al navegador que utilitzeu HTML5 en el vostre disseny web o una aplicació web.
Analitzador HTML5 compatible
L'analitzador, que converteix els bytes d'un document HTML en un DOM, s'ha ampliat i ara defineix amb precisió el comportament d'utilitzar en tots els casos, fins i tot quan s'enfronten amb HTML vàlid. Això condueix a una major previsibilitat i interoperabilitat entre els navegadors compatibles amb HTML5.

Conectivitat

Web Sockets
Permet la creació d'una connexió permanent entre la pàgina i el servidor i l'intercanvi de dades no HTML a través d'aquest mitjà.
Esdeveniments enviats pel servidor
Permet a un servidor enviar esdeveniments a un client, en lloc del paradigma clàssic en què el servidor podria enviar les dades només en resposta a la petició d'un client.
WebRTC
Aquesta tecnologia, on RTC és sinònim de comunicació en temps real, permet la connexió amb altres persones i el control de la videoconferència directament en el navegador, sense necessitat d'un complament o una aplicació externa.

Sense connexió & emmagatzematge

Recursos sense connexió: El cau de l'aplicació
Firefox és totalment compatible amb l'especificació de recursos sense connexió d'HTML5. La majoria dels altres recursos sense connexió tenen suport en un cert nivell.
Esdeveniments amb i sense connexió
Firefox 3 suporta WHATWG, esdeveniments amb i sense connexió, que permeten a les aplicacions i extensions detectar si hi ha o no una connexió a Internet, així com tambien, detectar quan la connexió es perd o es recupera.
WHATWG sessió del costat client i emmagatzamatge continu (emmagatzamatge DOM)
Sessió del costat client i l'emmagatzematge continu permet a les aplicacions web emmagatzemar dades estructurades al costat del client.
IndexedDB
IndexedDB és un estàndard web per a l'emmagatzematge de grans quantitats de dades estructurades en el navegador i per a les recerques d'alt rendiment d'aquestes dades mitjançant índexs .
Ús d'arxius des d'aplicacions web
El suport per a la nova API d'arxius d'HTML5 ha estat afegit a Gecko, per la qual cosa és possible que les aplicacions d'Internet accedeixin als arxius locals seleccionats per l'usuari. Això inclou el suport per a la selecció de diversos arxius utilitzant l'element HTML <input> de type file amb el nou atribut multiple. També hi ha FileReader.

Multimèdia

L'ús àudio i vídeo en HTML5
Els elements <audio> i <video> incrustats permeten la manipulació dels nous continguts multimèdia.
WebRTC
Aquesta tecnologia, on RTC és sinònim de comunicació en temps real, permet la connexió amb altres persones i el control de la videoconferència directament en el navegador, sense necessitat d'un complement o una aplicació externa.
Ús de l'API de la càmera
Permet utilitzar, manipular i emmagatzemar una imatge des de la càmera de l'ordinador.
Pista i WebVTT
L'element <track> permet subtítols i capítols. WebVTT és un format de pista de text.

Gràfics i efectes 3D

Tutorial Canvas
Aprendre sobre el nou element <canvas> i com dibuixar gràfics i altres objectes en Firefox.
API de text HTML5 per elements <canvas>
L'API de text HTML5 és ara compatible amb elements <canvas>..
WebGL
WebGL porta gràfics en 3D a la web mitjançant la introducció d'una API que s'ajusta estretament a OpenGL ÉS 2.0 que pot ser utilitzat en elements HTML5 <canvas>.
SVG
Un format basat en XML d'imatges vectorials que pot ser directament incrustat en el codi HTML.

Rendiment i Integració

Web Workers
Permet delegar l'avaluació de JavaScript a subprocessos en segon pla, permetent que aquestes activitats evitin alentir esdeveniments interactius.
XMLHttpRequest nivell 2
Permet anar a buscar de forma asíncrona algunes parts de la pàgina, la qual cosa li permet mostrar contingut dinàmic, variant segons el temps i les accions de l'usuari. Aquesta és la tecnologia que hi ha darrere d'Ajax.
Motors JavaScript un compilador JIT
La nova generació de motors de JavaScript són molt més potents, el que porta a un major rendiment.
API historial
Permet la manipulació del històrial del navegador. Això és especialment útil per a les pàgines que carreguen interactivament nova informació.
L'atribut contentEditable: Transformeu el vostre lloc web en una wiki!
HTML5 ha estandarditzat l'atribut contentEditable. Més informació sobre aquesta característica.
Arrosegar i deixar anar
El API d'arrossegar i deixar anar d'HTML5 permet el suport per arrossegar i deixar anar elements dins i entre llocs web. Això també proporciona una API senzilla per a l'ús d'extensions i aplicacions basats en Mozilla.
Gestió del focus en HTML
Els nous atributs d'HTML5 activeElement i hasFocus són compatibles.
Controladors de protocols basats en la Web
Ara podeu registrar aplicacions web com controladors de protocol utilitzant el mètode navigator.registerProtocolHandler().
requestAnimationFrame
Permet controlar les animacions de renderitzat per obtenir un rendiment òptim.
API Pantalla completa
Controla l'ús de tota la pantalla per a una pàgina Web o aplicació, sense que es mostri la interfície d'usuari del navegador.
API Bloqueig del punter
Permet bloquejar el punter al contingut, de manera que els jocs i aplicacions similars no perdin el focus quan el punter arriba al límit de la finestra.
Esdeveniments amb línia i sense línia
Amb la finalitat de construir una bona aplicació web sense connexió, necessiteu saber quan la vostra aplicació està realment fora de línia. Per cert, també necessiteu saber quan la vostra aplicació ha tornat a un estat en línia de nou.

accés al dispositiu

Ús de l'API de la càmera
Permet utilitzar, manipular i emmagatzemar una imatge des de la càmera de l'ordinador.
Esdeveniments tàctils
Manipuladors per reaccionar als esdeveniments creats per un usuari pressionant pantalles tàctils.
Ús de la geolocalització
Permet als navegadors localitzar la posició de l'usuari mitjançant la geolocalització.
Detecció de l'orientació del dispositiu
Obtenir la informació quan el dispositiu en el qual s'executa el navegador canvia l'orientació. Això pot ser usat com un dispositiu d'entrada (per exemple, per fer jocs que reaccionen a la posició del dispositiu) o per adaptar el disseny d'una pàgina a l'orientació de la pantalla (vertical o horitzontal)..
API Bloqueig del punter
Permet bloquejar el punter al contingut, de manera que els jocs i aplicacions similars no perdin el focus quan el punter arriba al límit de la finestra.

ESTIL

CSS s'ha ampliat per ser capaç de poder donar estil als elements en una forma molt més complexa. Això es coneix com CSS3, encara que CSS no és una especificació monolítica i els diferents mòduls no estan tots en el nivell 3: alguns són en el nivell 1 i altres al nivell 4, amb tots els nivells intermedis coberts.

Noves característiques d'estil de fons
Ara és possible posar una ombra a una caixa, mitjançant box-shadow i es poden configurar diversos fons.
Més vores de luxe
No només ara és possible usar imatges per a l'estil de vores, usant border-image i les seves propietats associades, també les vores arrodonides són suportades a través de la propietat border-radius.
Animació del vostre estil
Usant CSS Transitions per animar entre diferents estats o usar CSS Animations per animar parts de la pàgina sense un esdeveniment desencadenant, ara podeu controlar elements mòbils en la vostra pàgina.
Tipografia millorada
Els autors tenen un millor control per arribar a una millor tipografia. Poden controlar text-overflow i la separació de síl·labes (hyphenation), però també poden afegir una ombra (shadow) a ella o controlar amb més precisió les seves decoracions (decorations). Tipus de lletra personalitzades poden ser descarregades i aplicades gràcies a la nova regla @ font-face.
Nous dissenys de presentació
Per tal de millorar la flexibilitat dels dissenys, s'han afegit dos nous dissenys: el CSS multi-column layouts i CSS flexible box layout.

Document Tags and Contributors

 Contributors to this page: Legioinvicta
 Last updated by: Legioinvicta,