All’inizio erano tabelle; ricordiamo tutti bene il tedio provocato dal dover costruire strutture complesse spezzandole all’interno di una griglia fatta da infiniti <tr> e <td>: un attività noiosa, resa ancora peggiore dalla scarsa qualità e flessibilità del risultato. Poi arrivarono i <div> e fu una vera e propria rivelazione; finalmente un modello di costruzione del documento pensato per separare in modo chiaro i contenuti tipici di una pagina web. Grazie alla commistione tra questo elemento e i CSS nacquero pagine con codici HTML eleganti e leggibili come:
<html>
<head>
</head>
<body>
<div id="header">
--- Titolo e Testata ---
</div>
<div id="body">
<div id="menu">
--- Voci di Menu ---
</div>
<div id="main_content">
<div class="post">
--- Un Post ---
</div>
<div class="post">
--- Un altro Post ---
</div>
</div>
</div>
</body>
</html>All’interno di un costrutto come questo è tutto molto semplice da interpretare: basta seguire il flusso dei rientri di pagina facendosi guidare dai valori semantici attribuiti a id e class.
Passarono anni e il modello cominciò a mostrare le sue prime debolezze; in primo luogo ci si accorse che da un lato non vi era una regola collettiva e quello che per uno sviluppatore era ‘body’ per l’altro poteva benissimo essere ‘corpo’; inoltre si realizzò che né il browser né tantomeno i motori di ricerca avrebbero mai potuto beneficiare di questa divisione semantica, proprio per colpa di quell’arbitrarietà che permetteva a milioni di siti web di essere organizzati in strutture simili ma sempre leggermente diverse tra loro e per questo non raggruppabili secondo schemi automatici. Emerse in questo modo uno dei più grandi problemi dell’HTML4: l’incapacità di descrivere il significato delle informazioni di una pagina web in un formato interpretabile da altri software. In un mondo sempre più caratterizzato dall’interconnessione e dall’aggregazione su base semantica dei contenuti ci si adattò inventando e condividendo convenzioni studiate per rappresentare eventi di calendario, persone e quant’altro; nacquero così diversi microformati, come ad esempio hRecipe per le ricette:
<span class="hrecipe">
<span class="fn">Tisana alla liquirizia</span>
<span class="ingredient">2 cucchiai di Zucchero</span>
<span class="ingredient">20g Radice di liquirizia</span>
<span class="yield">2</span>
<span class="instructions">
Scaldare un pentolino con 200cl d’acqua fino a 95°C;
versare la radice di liquirizia;
lasciar macerare per 7 minuti;
zuccherare e servire.
</span>
<span class="duration">
<span class="value-title" title="PT90M"></span> 90 min
</span>
</span>L’HTML5 nasce per gestire ed incanalare tutte queste problematiche; nelle prossime lezioni scopriremo come beneficiare di nuovi tag disegnati appositamente per le più comuni strutture di contenuto e di attributi utilizzabili per definire ulteriore contenuto semantico alle pagine. Ma per arrivare a questo prima serve fare un po’ di pulizia...
Elementi e attributi non più previsti nelle specifiche
Le specifiche HTML5 sanciscono definitivamente la fine di tutta una serie di elementi e attributi che mantengono validità formale solo per preservare la retrocompatibilità di pagine datate ma sono espressamente vietati nella creazione di nuovi documenti.
I primi a subire questo esilio sono tutti quei costrutti funzionali alla parte di presentazione e caduti ampiamente in disuso con l’introduzione dei fogli di stile. Stiamo parlando di elementi come: basefont, big, center, font, s, strike, tt e u.
Ad essi si aggiunge una moltitudine di attributi più o meno noti, tra i quali ricordiamo: align e valign, background, bgcolor, cellpadding, border, cellspacing e molti altri. In realtà alcuni tra i citati perdurano solamente su specifici elementi, per una lista completa ed esaustiva consigliamo di visionare questa pagina del W3C dedicata al tema.
Interessante notare come si sia deciso invece di mantenere elementi come i e b; trasformandoli, però, da modificatori tipografici a semplici indicatori di porzioni di testo particolari e consentendone l’uso solo come ultima risorsa.
La falce della semplificazione si è successivamente abbattuta su un piccolo elenco di elementi obsoleti: acronym (sostituibile dal più comune abbr), applet (rimpiazzato da object), isindex (già arcaico in HTML4) e infine dir, sfavorito nel confronto con ul.
Cadono, infine, anche tutti i tag che gravitano intorno al concetto dei frame, ritenuti dannosi per usabilità e accessibilità: frame, frameset e noframes.
E con questi ultimi si chiude la lista degli elementi soppressi; in loro onore terminiamo la lezione con un piccolo snippet che li omaggi:
<center>
<font color="blue" size="2">
<big>Addio</big>,
<s>monti sorgenti dall'acque, ed elevati al cielo;
cime</s> elementi di markup inuguali,
noti a chi è cresciuto tra voi,
e impressi nella sua mente,
non meno che lo sia l'aspetto de' suoi più familiari.
</font>
Liberamente adattato da: <acronym title="I Promessi Sposi">IPS</acronym>
</center>
