Elenco di tutti gli elementi HTML / HTML5 👩‍💻

L’elemento Radice (1) html – elemento radice Elementi dedicati ad aggiungere metadata nei documenti (6) head – elemento radice di altri elementi metadatatitle – il titolo del documentobase – il base URL del documentolink – indica relazioni con altri documentimeta – elemento multiuso per vari metadatastyle – elemento per la presentazione delle informazioni Elementi di Scripting (2) script – script incorporatinoscript – fallback se il browser non supporta javascript Sezioni (14) body – rappresenta il corpo del documento htmlsection – rappresenta una sezionenav – raggruppa elementi di navigazionearticle – rappresenta un articoloaside – contenuto lateraleh1 – titolo/intestazione della sezioneh2 – titoloh3 – titoloh4 – titoloh5 – titoloh6 – titolohgroup – raggruppa le intestazioni della paginaheader – raggruppa le intestazioni della paginaaddress – rappresenta le informazioni di contatto Elementi per raggruppare i contenuti (14) p – paragrafo (paragraph)hr – pausa/rottura tematicabr – interruzione di linea (break)pre – testo preformattato (preformatted)blockquote – blocco per citazioniol – lista ordinata (ordered list)ul – lista non ordinata (unordered list)li – elemento della listadl – elenco di descrizionidt – termine o nomedd – descrizione o valorefigure – immagine con una didascalia opzionalefigcaption – didascalia dell’immaginediv – contenitore generico di contenuto Semantica specifica per il testo (26) a – collegamento ipertestualeem – efatizzazionestrong – grande importanzasmall – testo piccolos – testo non importante, obsoletocite – titolo di un testo citatoq – testo quotatodfn – istanza di un termineabbr – abbreviazionetime – data e/o tempocode – frammento di codicevar – variabile o test placeholdersamp – samplekbd – input utentesub sup – indicei – testo solitamente formattato in corsivob – testo solitamente formattato in grassettou – testo solitamente sottolineatomark – testo evidenziatoruby – annotazione rubyrt – testo rubyrp – parentesi rubybdi – BiDi isolatobdo span – elemento generico Modificatori (2) ins – testo inseritodel – testo cancellato Elementi che rappresentano del contenuto incorporato (11) img – immagineiframe – contesto di navigazione nidificatoembed – integrazione di pluginobject – contenuto generico esternoparam – parametri di inizializzazione di plginvideo – elemento per i videoaudio – stream di audiosource – risorsa generica per caricare mediatrack – traccia audio supplementarecanvas – tela per renderizzare grafica dinamicamap – definizioni di image-maparea – collegamenti ipertestuali nelle image-map Tabelle (10) table – tabellacaption – titolo della tabellacolgroup – gruppo di colonnecol – colonna della dabellatbody – gruppo righe tabellathead – gruppo intestazione tabellatfoot – footer della tabella, piè paginatr – riga della tabellatd – cella della tabellath – titolo della cella della tabella Forms (15) form – form inviabile dall’utentefieldset – set di controlli correlati al formlegend – titolo o didascalialabel – didascalia per un inputinput – constollo input multipurposebutton – bottoneselect – selezione di opzioni multiplidatalist – opzioni predefinite per altri controllioptgroup – gruppi di opzionioption – opzionitetarea – input area per l’inserimento del testokeygen – generatore key/pain di controlli inputoutput – risultato di un calcolo nel formprogress – indicatore di progressometer – range, misura scalare Elementi Interativi (4) details – controllo per informazioni addizionali on-demandsummary – sommario, titolo o legenda per l’elemento detailscommand – comandomenu – lista di comandi

In totale ci sono quindi 105 elementi (sena contare l’elemento <math> e l’elemento <svg>), se cerchi una referenza più completa guarda qui, vai qui se invece vuoi imparare a creare pagine web con l’html.… Continua a leggere

Inserire commenti nel codice HTML

Per inserire un commento nel codice HTML utilizza la seguente sintassi:

<main<!-- Questo è un commento nel codice HTML --<h1Benvenuto su Explosive Lab.</h1</main

Tutto il codice inserito tra i caratteri <!– –> verrà interpretato come un commento e quindi non verrà eseguito dal browser.… Continua a leggere

I meta tag nel linguaggio HTML(5)

I meta tag in HTML sono dei metadati usati per identificare le proprietà di un documento e definirne l’ eventuale valore(esempio: autore, scadenza, un lista di keyword…).Questi tag sono nati con l’ esigenza dei primi motori di ricerca di avere una descrizione immediata e categorica della pagina in questione senza sprecare troppe risorse visto che un tempo le capacità di storage erano notevolmente minori.Nel corso del tempo sempre più meta tag sono stati aggiunti permettendo una maggiore personalizzazione della pagina, in questo articolo ti farò un riassunto dei tag più usati ma prima vediamo le regole principali per non sbagliare a inserire i metadati nelle nostre pagine:

I meta tag devono essere inseriti dentro il tag <head></head> della tua pagina e non al di fuori.… Continua a leggere

Perchè l’ HTML5?

Introduzione L’ html è in continua evoluzione sin da quando è stato introdotto a internet nel lontano 1990. L’ html4 diventò una raccomandazione W3C nel 1997, quando io avevo solo 3 anni, e nel frattempo furono sviluppati l’ XHTML1, XML, DOM Level 2… L’ HTML5, il quale sviluppo fu iniziato nel 2004, intende sostituire questi documenti.… Continua a leggere

Doctype HTML, HTML5 e DTD

Come dice il W3C non esiste solo un tipo di HTML, ma c’è ne sono molti:  HTML 4.01 Strict, HTML 4.01 Transitional, XHTML 1.0 Strict, HTML5 e altri ancora. Tutti questi tipi sono definiti dalle loro rispettive specifiche ma la loro struttura è anche definita da un linguaggio chiamato DTD usato per definire i componenti ammessi e la struttura dello stesso documento.Visto il variare di questo tipo di specifiche è necessario usare il giusto doctype differenziandolo nei diversi tipi di documenti.… Continua a leggere

Css3 Transition

Normalmente quando un valore di una proprietà Css cambia, il risultato viene reso in modo immediato, modificando immediatamente il valore della vecchia proprietà con quella nuova.… Continua a leggere

ProcessingJs demo, WebApp

Dopo un piccolo periodo sabbatico eccomi a scrivere un nuovo articolo per Explosive Lab blog, oggi vi voglio parlare del mio ultimo progetto creato chiamato Processing.Js Demo il quale scopo è quello di raggruppare tutte le mie demo e i miei esempi creati con il linguaggio processing e quindi con Canvas e Html5.Qui trovi un link diretto al sito.… Continua a leggere

Free 404 page template

Ho creato una nuova versione del tema, lo trovi qui: 404 page layout gratis. ðŸ™‚

Oggi vi presento un design di una pagina d’ errore 404(Page not found) creata interamente con Html5 e Css3, niente immagini o script, sono animazioni e transizioni Css; per visualizzare correttamente la pagina il tuo browser deve supportare i Css3 e almeno il markup Html5.… Continua a leggere