Uno dei principali punti di forza di HTML5 è stato basarsi sul principio che non si doveva necessariamente "rompere" con il passato per creare un prodotto vincente ma che, piuttosto, proprio partendo dagli errori e conquiste del vecchio HTML si poteva costruire qualche cosa di grandioso e magnifico.

E' proprio in quest'ottica che dei tag ormai considerati obsoleti come <b>, <i>, <strong> e <em> siano stati recuperati ed utilizzati da HTML5 per avere a disposizione degli strumenti che consentissero un più ampio spettro di sfumature semantiche senza doversi inventare complicate alchimie e nuovi tag.

Vediamo nel dettaglio, allora, a che cosa servono (di nuovo) i vecchi tag in questione

<i>: il corsivo

Immaginiamo di guardare un film: l'azione si svolge, i dialoghi si susseguono, ad un certo punto, osservando un paesaggio, si sente una voce (la cosiddetta "voice-over") che racconta i pensieri di un personaggio. Ecco, quel brano raccontato dalla voce narrante è in corsivo – ovvero un pezzo di contenuto "staccato" del resto del testo, per l'appunto "over".

Un altro uso del tag <i> è per indicare parole in un altra lingua, ad esempio:

la guêpière di mia moglie ieri sera la faceva sembrare una salsicca ripiena

In questo caso avremo usato qualcosa tipo

<i lang="fr">guêpière</i>

indicando anche, con l'attributo "lang", che la parola in questione è in francese.

Ricordiamoci comunque di usare il tag <i> quando nessuno degli altri tag che abbiamo a disposizione (<em> per enfasi, <strong> per importanza, <cite> per citazioni, <dnf> per definizioni e <var> per variabili matematiche) fa al caso nostro e abbiamo dunque bisogno di indicare una "estraneità" della frase o parola dal resto del discorso

<b>: il grassetto

Il buon vecchio <b> ci viene in soccorso quando vogliamo indicare una parola in "grassetto" (cioè evidenziata – ma solo graficamente! – rispetto al resto del testo). Pensiamo ad esempio ad una lista di

nome: valore

dove vogliamo che l'etichetta "nome" non sia interpretata come semanticamente più importante del "valore" ma sia semplicemente immaginata e vista graficamente come separata.

Anche in questo caso, cerchiamo di usare il tag <b> solo quando nessuno degli altri tag (citati prima, a cui aggiungiamo <mark> per testo "evidenziato" oltre agli heading <h1> – <h6>) non soddisfano le nostre esigenze "visive" (lo metto tra virgolette perchè, come vedremo dopo, questi tag devono essere pensati e utilizzati a prescindere da come i browser li mostrano a video)

 

Rispetto a queste "vecchie glorie" del nostro HTML, vediamo dei tag relativamente nuovi che hanno per così dire sostituito – ampliandone il campo semantico – i tag summentovati.

<em>: enfasi

Usiamo il tag <em> quando vogliamo che la parola o la frase venga pronunciata (anche mentalmente, quando viene letta) con una certa enfasi. Ad esempio in una frase del genere:

Sono tre ore che ti aspetto!

è evidente che l'oratore ha dato una certa <em>enfasi</em> alle tre, interminabili ore di attesa

<strong>: importante

Quando invece vogliamo indicare ai nostri lettori (e, bada bene, anche agli spider dei motori di ricerca) una parola o una frase importante nel nostro testo è bene usare questo tag – che dunque va usato non tanto per il suo (eventuale) valore grafico quanto piuttosto per il "peso" semantico che assegna ai termini che racchiude

Concludendo

La conclusione del discorso? HTML5 è addirittura riuscito a risuscitare due tag ormai dati per spacciati come <b> e <i>: chiaramente vanno usati con intelligenza e parsimonia, ma aiutandosi anche con il documento ufficiale di specifica (qui la pagina relativa a <i> e qui quella relativa a <b>) queste vecchie glorie possono aiutarci a definire ancora meglio il campo semantico di tutti gli elementi della nostra pagina.

Un'ultima considerazione, piuttosto importante: nessuno dei tag indicati (anzi, a dire il vero nessuno dei tag in generale <- enfasi) ha una valenza grafica. Tutti i tag sono media-independent (<- corsivo, <i>), ovvero il loro "peso" semantico non dipende da come vengono visualizzati in un browser (che, peraltro, potrebbe anche essere non visuale).