Sebbene il suo sviluppo fosse iniziato molti anni prima, l'HTML5 ha iniziato a entrare in uso comune con i web designer / sviluppatori nel 2010. Fin dall'inizio, il linguaggio sembrava familiare a molti professionisti del Web perché invece di provare a reinventare tutto da zero, HTML5 costruito su ciò che era venuto prima. Chiunque conoscesse HTML 4.01 ha scoperto subito che un bel po 'di quella versione poteva ora essere trovata in HTML5.
Sebbene HTML5 includa molti elementi che sono stati in giro in HTML per un po ', ha anche introdotto una manciata di elementi che erano nuovi in HTML5. Per molti di questi nuovi elementi è stato utilizzato un approccio chiamato "pavimentazione dei cammini". Questo è un termine comunemente usato nell'IT per significare essenzialmente come guardare ciò che le persone stanno già facendo e farlo. Nel caso dei web designer, questo significava vedere come stavano già costruendo pagine e basare le decisioni su nuovi elementi su quelle attività. Ad esempio, molti professionisti del Web creerebbero siti Web con divisioni che utilizzavano attributi ID o Class di "header", "nav" e "footer". Pertanto, HTML5 ha introdotto questi elementi come nuovi elementi, consentendo ai professionisti del Web di aggiungere più significato ai propri documenti utilizzando elementi di sezione dedicati anziché solo divisioni. Questa combinazione di familiarità e un approccio che ha riconosciuto le pratiche attuali ha aiutato HTML5 a essere rapidamente adottato dall'industria del web design.
Il Doctype HTML5
Innanzitutto, per utilizzare qualsiasi nuovo elemento HTML5, il documento deve includere il doctype HTML5 che è:
Si può notare che questo doctype non menziona specificamente "HTML5", ma semplicemente dichiara la versione come "html". Questo perché questo doctype è ciò che si intende utilizzare in futuro per tutte le iterazioni della lingua.
In effetti, HTML5 dovrebbe essere l'ultima versione numerata della lingua, con nuove modifiche che verranno aggiunte in modo coerente in futuro. In effetti, alcuni degli elementi nella lista qui sotto sono stati aggiunti alla lingua dopo quella spinta iniziale nel 2010!
I tag HTML5
| Etichetta | Spiegazione | |
|---|---|---|
| Ancora o link | ||
| Abbreviazione | ||
| Indirizzo o autori del documento | ||
| Mappa immagine lato client | ||
| Articolo | ||
| Contenuto tangenziale | ||
| Flusso audio | ||
| Grassetto | ||
| Percorsi URI di base per elementi nel documento | ||
| Algoritmo bidirezionale | ||
| Lunga citazione | ||
| Corpo della pagina | ||
| Interruzione di linea | ||
| Pulsante modulo HTML | ||
| Tela per una grafica dinamica | ||
| Commento | ||
| Didascalia | ||
| Citazione | ||
| Codice di riferimento | |
| Colonna della tabella | ||
| Raggruppamento di colonne di tabella | ||
| Comando o azione sulla pagina | ||
| Definizione del tipo di documento | ||
| Griglia di dati | ||
| Opzioni predefinite per altri controlli | ||
| Descrizione dell'elenco di definizioni o estensione del discorso | ||
| Testo cancellato | ||
| Ulteriori informazioni su richiesta | ||
| Definizione | ||
| Conversazione | ||
| Divisione logica | ||
| Elenco di descrizione | ||
| Termine dell'elenco di definizione o altoparlante di dialogo | ||
| enfasi | ||
| Elemento incorporato per plugin | ||
| Gruppo di controlli modulo | ||
| La didascalia utilizzata per a | ||
| Figura con didascalia opzionale | ||
| Piè di pagina della pagina | ||
| Modulo | ||
| Titolo di primo livello | ||
| Titolo di secondo livello | ||
| Titolo di terzo livello | ||
| Titolo di quarto livello | ||
| Titolo di quinto livello | ||
| Titolo di sesto livello | ||
| Capo del documento | ||
|
| Intestazione di una pagina | |
| Gruppo di direzione | ||
| Regola orizzontale | ||
| Elemento principale di una pagina Web | ||
| Stile di testo in corsivo | ||
| Telaio in linea | ||
| Immagine | ||
| Elemento modulo di input | ||
| Elemento di forma pulsante | ||
| Elemento del modulo Checkbox | ||
| Colore di input | ||
| Inserimento della data | ||
| Inserimento di data e ora globali | ||
| Inserimento di data e ora locale | ||
| Inserimento dell'indirizzo email | ||
| File caricare l'elemento del modulo | ||
| Elemento campo modulo nascosto | ||
| Elemento del modulo immagine | ||
| Input anno e mese | ||
| Numero di input | ||
| Elemento del modulo di password | ||
| Elemento modulo pulsante radio | ||
| Input numerico impreciso | ||
| Ripristina elemento modulo pulsante | ||
| Campo di ricerca | ||
| Invia elemento modulo pulsante | ||
| Numero di telefono | ||
| Elemento di forma del campo di testo | ||
| Tempo di inserimento | ||
| Input URL | ||
| Input anno e settimana | ||
| Testo inserito | ||
| Testo da inserire dall'utente | ||
| Genera chiavi sicure per la gestione dei certificati | ||
| Etichetta del modulo | ||
| Formatta la didascalia fieldset | ||
| Elemento dell'elenco | ||
| Link ai documenti correlati | ||
| Area principale del contenuto su una pagina | ||
| Mappa immagine lato client | ||
| Testo contrassegnato o evidenziato | ||
| Elenco di comandi | ||
| Meta informazioni sul documento | ||
| Calibro scalare | ||
| Definisci un'area con collegamenti di navigazione | ||
| Contenuto quando gli script non sono disponibili | ||
| Oggetto non standard | ||
|
| Elenco ordinato o numerato | |
| Gruppo di opzioni in un elenco selezionato | ||
| Opzione in un elenco selezionato | ||
| Risultato di un calcolo del modulo | ||
| Paragrafo | ||
| Parametro di un elemento oggetto | ||
|
| Testo preformattato | |
| Indicatore di progresso | ||
| Breve quotazione in linea | ||
| Parentesi rubino | ||
| Testo rubino | ||
| Annotazione rubino | ||
| Testo barrato | ||
| Uscita di esempio | ||
| Script | ||
| Sezione di una pagina | ||
| Seleziona o elenchi di menu a discesa | ||
| Piccola dimensione del carattere | ||
| Fonte multimediale | ||
| Contenitore generico in linea | ||
| Forte enfasi | ||
| Fogli di stile | ||
| deponente | ||
| Riassunto dei contenuti dell'elemento DETTAGLI | ||
| indice | ||
| tavolo | ||
| Righe del corpo della tabella | ||
| Cella di tabella | ||
| Elemento di forma a più righe | ||
| Righe del piè di pagina | ||
| Cella di intestazione della tabella | ||
| Righe dell'intestazione della tabella | ||
| Definisce il tempo | ||
| Titolo | ||
| Riga della tabella | ||
|
| Lista non ordinata o voluta | |
| Testo variabile o definito dall'utente | ||
|
Video o film incorporato nella pagina |
