Formattazione HTML: liste puntate e collegamenti ipertestuali
Oggi scopriremo come formattare le liste puntate e l’inserimento di link nel testo.

La qualità dei testi aumenta sempre di più e con essa anche le richieste dei nostri clienti. In passato abbiamo già raccolto in un tutorial alcuni consigli pratici sulla formattazione basilare dei testi in HTML, presentando i tag più comuni, dal grassetto al corsivo, all’inserimento di un paragrafo e titoli e sottotitoli.
Oggi invece scopriremo come formattare le liste puntate e l’inserimento di link nel testo.
Liste puntate
Ci sono diverse tipologie di liste puntate, quelle numerate, quelle alfabetiche e i semplici elenchi puntati. In base alla nostra esperienza i nostri clienti richiedono esclusivamente due tipologie di liste, che saranno quelle che andremo a presentare: liste non ordinate e liste ordinate.
Elenco non ordinato
Si tratta dell’elenco dove viene visualizzato il “pallino pieno”. È contraddistinto dal tag <ul> (che sta appunto per “unordered list”) e gli elementi dell’elenco vengono inseriti con il tag <li>
<ul>
<li>primo punto
<li>secondo punto
<li>terzo punto
</ul>
Il risultato sarà:
- primo punto
- secondo punto
- terzo punto
Elenco ordinato
Si tratta dell’elenco costituito da una serie progressiva di numeri o lettere. In questa occasione vi presentiamo la formattazione per la lista numerata che è contraddistinta dal tag <ol> (che sta per “ordered list”) e gli elementi della lista vengono inseriti con il tag <li>
<ol>
<li>primo punto</li>
<li>secondo punto</li>
<li>terzo punto</li>
</ol>
Il risultato sarà:
- primo punto
- secondo punto
- terzo punto
Collegamenti ipertestuali
Grazie all’ipertestualità, gli utenti del web possono navigare da una pagina all’altra e raggiungere anche siti esterni alla pagina semplicemente con un click su quello che definiamo comunemente come link o collegamento ipertestuale. Come fare per inserirne uno in una determinata parola o insieme di parole? La formattazione HTML basilare per l’inserimento di un link è la seguente:
<a href="SITO DELLA PAGINA">PAROLA DA COLLEGARE AL LINK</a>
Esempio:
In precedenza abbiamo già pubblicato un tutorial sulla formattazione HTML.
Ecco come viene formattata la frase precedente:
In precedenza abbiamo già pubblicato un <a href=”https://www.textbroker.it/html-consigli-pratici”>tutorial</a> sulla formattazione HTML.
Con un po’ di pratica, sarà un gioco da ragazzi!
Ecco, infine, un link su cui esercitarsi.
Immagine: © alex-mit_istockphoto
Nessun commento disponibile