Basi di HTML e gli EDITOR per scriverlo

L’HTMLHTML è la sigla di HyperText Markup Language. È il linguaggio di programmazione delle pagine... Leggi è il linguaggio di tutte le pagine che stanno su Internet e che permette di creare degli IPERTESTI, ovvero i testi contenenti LINK che portano ad altri documenti. La struttura di ogni pagina web, infatti, è in linguaggio HTML (quello che, ad esempio, usiamo nella versione “testo” dell’editor di WordPressQuesto CMS gratuito è nato nel 2003 ed in pochi anni è diventato la piattaforma... Leggi).

Ci permette di marcare i contenuti definendo con dei TAG i loro significati.

Esempi di utilizzo di base dell’HTML

Per inserire un paragrafo all’interno del testo dobbiamo racchiuderlo nel tag di apertura <p> usando le parentesi angolari:

<p>Questo è il mio paragrafo.</p>

Formattazioni:

gli stili di testo, come l’italico o il neretto (bold), sono anch’essi definiti dall’HTML. Ecco come inserire lo stile Bold n parte del testo).

Mi chiamo Giovanni e vivo a Milano

ecco come va scritta usando un editor:

<p><strong>Mi chiamo <strong>Giovanni</strong> e vivo a Milano</p>

Apertura e chiusura del TAG

Come vediamo dagli esempi precedenti, al tag di apertura <p> abbiamo fatto seguire quello di chiusura </p> alla fine del paragrafo, chiudendolo con lo slash </>

Mentre per attribuire il BOLD solo al nome Alessandra, abbiamo usato il tag per il bold <strong> subito dopo la parola che andava formattata in neretto. Se non avessimo inserito la chiusura, tutta la frase sarebbe risultata in neretto.

Gli attributi HTML

Sono elementi inseriti all’interno di un tag prima della chiusura,

Ad esempio l’elemento <img> che ha tra i vari attributi, l’alt. Ecco come lo possiamo imputare alla foto a lato:

<img src="https://supportowp.it/wp-content/uploads/2017/01/ale-profilo-2016.jpg" alt="digital marketing specialist">

L’alt tag, molto importante ai fini SEOQuesta siglia sta per Search Engine Optimization (trad: Ottimizzazione per i Motori di Ricerca) Comprende..., definisce il contenuto della foto e va impostato secondo logica attinente alla foto o al contenuto del documento.

Consigli HTML

da Andrea Barghigiani – SkillsAndMore:

All’interno di un linguaggio come l’HTML esistono moltissimi tag e moltissimi attributi che sarebbero impossibili da elencare in una singola pagina. Per vederle tutte puoi consultare le specifiche HTML5.

Il nuovo HTML5 porta con se nuovi elementi che hanno aggiunto ulteriore semantica al codice che definisce la struttura delle pagine web.

Se vuoi approfondire questi argomenti puoi consultare il nostro corso dedicato che ti guiderà nella creazione del tuo primo sito web, ma c’è un consiglio che voglio lasciarti prima di terminare questa definizione.

Qualunque sia l’uso che vorrai fare del codice HTML ricorda di utilizzare sempre un editor di testo dedicato, non utilizzare mai Word o altri editor di testo provenienti da una suite d’ufficio.

Ti avverto su questo aspetto perché molto spesso, chi è alle prime armi tende a utilizzare gli strumenti che già trova installati sul computer pensando “in fin dei conti è sempre testo” ma faresti un grosso errore perché Word e i programmi di scrittura aggiungono del codice dietro le quinte e potrebbero causare problemi alla struttura HTML della pagina.