Una delle prime difficoltà che potresti incontrare imparando l'HTML è la necessità di scrivere nel testo le lettere accentate oppure dei caratteri speciali che fanno parte della sintassi HTML o che, semplicemente, non sono disponibili sulla tastiera.
La soluzione del problema è semplice: per evitare l'errore di visualizzazione delle lettere accentate, assicurati di aver impostato la codifica della tua pagina HTML.
Per tutti gli altri caratteri, invece di scrivere il carattere "così com'è", scrivi il codice HTML a esso corrispondente come suggerito nella seguente Tabella dei principali Caratteri Speciali HTML.
Nota bene: per ciascun carattere speciale possono esistere sia un codice nominale che un codice numerico (unicode), tra i due, se disponibile, ti consigliamo di scegliere il primo. La sintassi per inserire i codici (che prendono il nome di entità HTML) è sempre &[entità];
Per cercare un carattere speciale puoi anche utilizzare la funzione di ricerca del tuo browser, di solito attivabile premendo Ctrl+F su PC o Cmd+F su Mac, ma non dirlo in giro! 😉
| Carattere Speciale | HTML Code (case sensitive) | Unicode | Nome o significato |
|---|---|---|---|
| ° | ° | ° | grado (simbolo dei gradi celsius) |
| « | « | « | virgolette sinistre in stile europeo |
| » | » | » | virgolette destre in stile europeo |
| – | – | – | trattino o meno |
| — | — | — | trattino lungo |
| ¡ | ¡ | ¡ | punto esclamativo invertito |
| ¿ | ¿ | ¿ | punto di domanda invertito |
| " | " | " | virgolette |
| “ | “ | “ | virgolette sinistre inclinate |
| ” | ” | ” | virgolette destre inclinate |
| ‘ | ‘ | ‘ | virgoletta sinistra inclinata |
| ’ | ’ | ’ | virgoletta destra inclinata |
| (blank space) | |   | spazio vuoto |
| Simboli | |||
| & | & | & | e commerciale |
| ¢ | ¢ | ¢ | simbolo di cent |
| © | © | © | simbolo di copyright |
| ÷ | ÷ | ÷ | simbolo di divisione |
| > | > | > | simbolo maggiore |
| < | < | < | simbolo minore |
| µ | µ | µ | simbolo micron |
| · | · | · | punto centrale |
| ¶ | ¶ | ¶ | delimitatore di paragrafo o simbolo di paragrafo |
| ± | ± | ± | più o meno |
| € | € | € | simbolo valuta Euro |
| £ | £ | £ | simbolo valuta Sterlina britannica Pound |
| ® | ® | ® | simbolo di marchio registrato |
| § | § | § | delimitatore di sezione |
| ™ | ™ | ™ | simbolo trademark |
| ¥ | ¥ | ¥ | simbolo valuta Yen Giapponese |
| Diacritici | |||
| á Á | á Á | á Á | aminuscola accentata con accento acuto A maiuscola accentata con accento acuto |
| à À | à À | à À | aminuscola accentata con accento grave A maiuscola accentata con accento grave |
| â Â | â Â | â Â | aminuscola con accento circonflesso A maiuscola con accento circonflesso |
| å Å | å Å | å Å | aminuscola con anello o occhiello A maiuscola con anello o occhiello |
| ã Ã | ã Ã | ã Ã | aminuscola con tilde A maiuscola con tilde |
| ä Ä | ä Ä | ä Ä | aminuscola con dieresi A maiuscola con dieresi |
| æ Æ | æ Æ | æ Æ | aeminuscola con legatura fonetica AE maiuscola con legatura fonetica |
| ç Ç | ç Ç | ç Ç | cminuscola con cediglia C maiuscola con cediglia |
| é É | é É | é É | eminuscola con accento acuto E maiuscola con accento acuto |
| è È | è È | è È | eminuscola con accento grave E maiuscola con accento grave |
| ê Ê | ê Ê | ê Ê | eminuscola con accento circonflesso E maiuscola con accento circonflesso |
| ë Ë | ë Ë | ë Ë | eminuscola con dieresi o umlaut E maiuscola con dieresi o umlaut |
| í Í | í Í | í Í | iminuscola con accento acuto I maiuscola con accento acuto |
| ì Ì | ì Ì | ì Ì | iminuscola con accento grave I maiuscola con accento grave |
| î Î | î Î | î Î | iminuscola con accento circonflesso I maiuscola con accento circonflesso |
| ï Ï | ï Ï | ï Ï | iminuscola con diaeresis o umlaut I maiuscola con diaeresis o umlaut |
| ñ Ñ | ñ Ñ | ñ Ñ | nminuscola con tilde N maiuscola con tilde |
| ó Ó | ó Ó | ó Ó | ominuscola con accento acuto O maiuscola con accento acuto |
| ò Ò | ò Ò | ò Ò | ominuscola con accento grave O maiuscola con accento grave |
| ô Ô | ô Ô | ô Ô | ominuscola con accento circonflesso O maiuscola con accento circonflesso |
| ø Ø | ø Ø | ø Ø | ominuscola barrata (simbolo di diametro) O maiuscola barrata (simbolo di diametro) |
| õ Õ | õ Õ | õ Õ | ominuscola con tilde O maiuscola con tilde |
| ö Ö | ö Ö | ö Ö | ominuscola con dieresi o umlaut upper-case O maiuscola con dieresi o umlaut |
| ú Ú | ú Ú | ú Ú | uminuscola con accento acuto U maiuscola con accento acuto |
| ù Ù | ù Ù | ù Ù | uminuscola con accento grave U maiuscola con accento grave |
| û Û | û Û | û Û | uminuscola con accento circonflesso U maiuscola con accento circonflesso |
| ü Ü | ü Ü | ü Ü | uminuscola con dieresi o umlaut U maiuscola con dieresi o umlaut |
| ß | ß | ß | simbolo beta |
| ÿ | ÿ | ÿ | y minuscola con dieresi o umlaut |
| ´ | ´ | accento acuto o apostrofo senza lettera | |
| ` | ` | accento grave o apostropo inverso senza lettera | |
| Scacchi | |||
| ♔ | ♔ | Re bianco | |
| ♚ | ♚ | Re nero | |
| ♕ | ♕ | Regina bianca | |
| ♛ | ♛ | Regina nera | |
| ♖ | ♖ | Torre bianca | |
| ♜ | ♜ | Torre nera | |
| ♗ | ♗ | Afiere bianco | |
| ♝ | ♝ | Alfiere nero | |
| ♘ | ♘ | Cavallo bianco | |
| ♞ | ♞ | Cavallo nero | |
| ♙ | ♙ | Pedone bianco | |
| ♟ | ♟ | Pedone nero | |
| Frecce | |||
| → | → | ← | Freccia a destra |
| ← | ← | → | Freccia a sinistra |
| ↑ | ↑ | ↑ | Freccia in basso |
| ↓ | ↓ | ↓ | Freccia in basso |
| ↔ | ↔ | ↔ | Doppia freccia orizzontale |
| ↕ | ↕ | ↕; | Doppia freccia verticale |
| Vari | |||
| ♥ | ♥ | ♥ | Cuore 1 |
| ❤ | ❤ | Cuore 2 | |
| ☼ | ☼ | Sole | |
| ☾ | ☾ | Luna crescente | |
| ☽ | ☽ | Luna calante | |
| ☮ | ☮ | Simbolo Pace | |
| ☯ | ☯ | Simbolo Tao | |
Pssst... Quante volte ti è capitato di trovare una pagina web utile e poi perderla?
Puoi aggiungere un segnalibro al tuo browser premendo Ctrl+D su PC o Cmd+D su Mac, ma non dirlo a nessuno! 😉
Alcuni consigli
Per la lista completa di tutti i caratteri speciali html puoi consultare anche la documentazione ufficiale del W3C (il Consorzio internazionale che stabilisce gli standard del Web).
Se stai studiando l'HTML per imparare le basi del Web, ti sarebbero molto utili dei corsi di Web Design oppure per imparare a programmare: apprenderai più in fretta e meglio!
Se stai studiando l'informatica per farne un lavoro, ricordati che anche la lingua inglese ti sarà indispensabile. Per questo motivo ti suggeriamo questi corsi di inglese, trova il migliore per te!
Buon lavoro!
