HTML

HTML è l’acronimo di  “HyperText Markup Language”.
È un linguaggio di codifica utilizzato per chiamare o visualizzare gli elementi di un sito web.
La maggior parte dei tag HTML racchiude il pezzo di testo che viene visualizzato dai visitatori del tuo sito web e può determinare,  ad esempio , lo stile in cui un pezzo di testo viene visualizzato.

L’HTML è la lingua per i blocchi di base del tuo sito web.
I tag , delimitano quale testo è collegato a uno specifico codice CSS nel foglio di stile, che a sua volta impartisce informazioni al browser web su come  visualizzare il testo tra questi tag.
I tag di apertura e di chiusura si differenziano per l’aggiunta di una barra in quest’ultimi.

Visualizzazione e sperimentazione con il codice

Ci sono alcuni modi in cui è possibile visualizzare il codice ‘markup’ di qualsiasi sito web.
Questi sono strumenti del tuo browser che ti permettono di vedere dietro la facciata e avere un’idea degli elementi che compongono un sito.
Questi strumenti sono ottimi per l’apprendimento del codice, perché si ottiene un confronto in tempo reale del codice “back-end” con il front-end visivo. ”

Vedi la fonte

Il primo strumento che voglio menzionare è il comando “visualizza sorgente” nel browser (“ispezione elemento” in Safari, “visualizza sorgente pagina” in Chrome e Firefox).
È possibile accedervi facendo clic con il pulsante destro del mouse in qualsiasi punto del sito Web e selezionandolo dal menu contestuale.
Si aprirà una nuova finestra che mostra tutto il codice che il browser utilizza per visualizzare la pagina.
Questo è semplicemente visualizzato come un grande blocco di testo, quindi potrebbe non essere molto facile da leggere per chi non è esperto.

Ispeziona elemento (o Firebug)

Per l’apprendimento del codice, lo strumento di ispezione Web o “ispezione elemento” è molto più prezioso della visualizzazione della fonte.

I browser Webkit, come Safari di Apple e Google Chrome, dispongono di strumenti di “modalità di sviluppo” integrati che sono molto utili per l’ispezione dei diversi elementi che compongono il tuo sito.
Per Firefox, c’è un componente aggiuntivo gratuito chiamato Firebug che farà essenzialmente la stessa cosa.
Un semplice clic con il tasto destro del mouse sull’elemento della pagina che vuoi controllare rivela molto sulla formattazione di quell’elemento, permettendoti di risolvere i problemi.

Quando scegli di ispezionare un elemento di pagina, si aprirà un nuovo riquadro nella parte inferiore della finestra del browser, mostrando (sul lato sinistro) tutto il codice che compone la pagina, con particolare attenzione al codice sorgente per la parte specifica che cliccato su Sul lato destro, puoi vedere tutti i CSS che si applicano a quel particolare elemento.

È quindi possibile modificare quel CSS per testare diversi stili, prima di applicare tali modifiche al foglio di stile.

Lo strumento Elemento di ispezione consente inoltre di visualizzare i tempi di caricamento delle pagine, le immagini e altre risorse utilizzate nella pagina e altro ancora.

Ulteriori risorse per l’apprendimento del codice HTML

• W3 Schools: impara praticamente qualsiasi linguaggio di programmazione e tecnologia di sviluppo web a cui puoi pensare … e alcuni di cui non hai mai nemmeno sentito parlare!
• Mozilla Webmaker: una risorsa per imparare a “fare il web”.
• CodePen: scrivere il codice, vedere come si presenta e condividerlo con gli altri.