In prima pagina su Google con il Metodo Go.S.T.

fatti trovare dai tuoi clienti

Corso SEO & HTML: #22 Tag UL e OL

2021-11-03 12:00:00

Oggi ti svelo un segreto per potenziare la tua presenza online con l'itilizzo degli elenchi puntati numerati e gli elenchi puntati non numerati, tag UL e tag OL

« Corso SEO & HTML: #21 Tag P, Span, B, I, ...

  • Tag Ul e Ol: elenchi puntati ed elenchi numerati
  • Come sfruttare al massimo gli elenchi per essere in prima pagina
  • Quando vanno usati gli elenchi in HTML5

In questa rubrica sulla SEO dedicata alla scrittura di codice HTML ti spiego con parole semplici quali sono i tag HTML fondamentali di ogni pagina web per farti capire come è fatto un sito web in modo da sfruttare al meglio le conoscenze sulla SEO ed essere in prima pagina su Google, senza farti necessariamente diventare un webmaster o un hacker!

Tag Ul e Ol

Gli elenchi puntati e gli elenchi numerati

Il tag è un tag HTML sempre esistito fin dalla prima versione del linguaggio HTML e letterariamente è l'acronimo di unordered list (ovvero lista non numerata). Noi italiani lo chiameremmo Elenco Puntato.

Il tag  analogamente è l'acronimo di ordered list (ovvero lista numerata). Noi italiani lo chiameremmo Elenco Numerato.

Ogni volta che desideriamo fare una lista di punti chiave all'interno di una pagina HTML, possiamo introdurre nel testo gli elenchi puntati o gli elenchi numerati nel seguente modo:

Come puoi notare, sia per il tag <ul> che per il tag <ol>, ogni elemento della lista deve essere racchiuso in un tag <li> che letterariamente significa List Item (o in italiano elemento della lista).

L'effetto che si avrà aprendo il file html di esempio con un browser è il seguente:

Naturalmente — come al solito — anche la veste grafica di un elenco puntato o numerato è terribile dal punto di vista estetico, ma grazie al CSS è possibile creare uno stile assolutamente magnifico, secondo il tuo gusto estetico.

La cosa importante da tener presente non è la bellezza estetica, ma l'utilità degli elenchi puntati e numerati, sia per contribuire a rendere il testo più leggibile agli utenti del nostro sito web, ma soprattutto perché ai motori di ricerca gli elenchi piacciono tantissimo!

Elenchi nei menu

Usare sempre gli elenchi puntati nei menu di navigazione

Come abbiamo già visto nella trattazione del Tag Nav, e come vedremo tra pochissimo quando ti parlerò di CSS, l'utilizzo degli elenchi è particolarmente utile nella costruzione dei menu di navigazione. 

Questa pratica piace molto anche ai motori di ricerca, in quanto l'uso degli elenchi, consente di introdurre nei pulsanti del menu le parole chiave!

Devi sapere che agli albori della rete, i webmaster (me compreso) adoravano creare i menu utilizzando delle GIF, immagini preconfezionate che spesso erano oggetti incomprensibili agli occhi dei motori di ricerca.

Dunque, i menù di navigazione fatti con immagini (spesso abbinati con codice Javascript o peggio ancora animazioni Flash) facevano perdere tantissimi punti ai siti agli occhi dei motori di ricerca.

Elenco come indice degli argomenti

Analogamente ai menu di navigazione, un sito web viene molto ben visto dai motori di ricerca — e per questo viene premiato — quando nella prima parte della pagina HTML l'autore fa un elenco degli argomenti sotto forma di elenco puntato o numerato (è indifferente che sia numerato) e all'interno dei tag <li> inserisce un link interno alla pagina per spostare l'utente direttamente al paragrafo menzionato!

I link interni a una pagina si chiamano "àncore". Le ancore sono particolari elementi di navigazione che permettono di spostarsi all'interno di una pagina. Le àncore compaiono nell'url dopo il segno cancelletto (#)

Dunque ti faccio la lista della spesa per essere in prima pagina su Google:

  1. elenco puntato o numerato all'inizio della pagina web con link alle àncore
  2. àncore posizionate sui tag <h2> o <h3> dei titoletti o sottotitoli dei vari paragrafi o capitoli
  3. url interni alla pagina con #ancora

Ti faccio un esempio pratico:

Il codice HTML appena scritto produrrà sul browser il seguente effetto:

e sul motore di ricerca produrrà l'effetto di portarti in prima pagina 🤩


Naturalmente nel Corso SEO Operativo BASIC ti spiego anche che cosa scrivere nel titolo di ogni paragrafo e di ogni capitolo per potenziare al massimo l'efficacia di questa tecnica, molto usata dai più grandi Blogger al mondo!


Conclusioni

Hai capito l'importanza di usare le liste o elenchi puntati nel tuo sito web!

Per la parte relativa all'HTML abbiamo praticamente completato, se vuoi approfondire tutti i tag HTML5 per diventare un buon webmaster, ti invito a comprarti un buon libro come questo:


La prossima settimana in questo Corso SEO  inizieremo a vedere che cos'è il CSS e perchè dobbiamo usarlo per essere in prima pagina su Google, quindi fai click su "Seguimi" per ricevere una notifica!

Ti do appuntamento alla prossima settimana, nel frattempo metti un like se questo articolo ti è stato utile e condividilo con tutti i tuoi amici che — come te — vogliono essere in prima pagina su Google, te ne saranno immensamente grati.

Se qualcosa non ti è chiaro, fammi le tue domande nei commenti, risponderò a tutti, oppure scrivimi in privato.

Iscriviti al Corso SEO Operativo per poter entrare nel gruppo privato dove parliamo ogni giorno di SEO e di come fare per essere in prima pagina su Google, a presto.

Corso SEO & CSS: #23 Introduzione »

Corso SEO Operativo: come funziona l'algoritmo di Google
Impara come funziona l'algoritmo di Google per creare i giusti contenuti e sarai sempre in prima pagina sui motori di ricerca!
by Emanuele Frisoni
73