Sempre il preda alle mie domande su come sia meglio scrivere il codice, ho trovato su Smashing Magazine un ottimo articolo che chiarisce alcuni dubbi su come le cose debbano essere fatte affinché il codice non diventi una zuppa.
Mantenere il codice XHTML e CSS pulito a volte può essere un’impresa a causa delle continue modifiche, ma con qualche piccolo accorgimento è possibile farlo senza diventare pazzi. Ecco 11 linee guida da seguire per riuscirci al meglio.
Doctype: meglio Strict
Sia che venga usato HTML 4.01 o XHTML 1.0 il consiglio è di abbandonare il doctype “Transitional” e utilizzare sempre lo “Strict”: codice più pulito e standard.
Caratteri speciali e charset
Nell’head della pagina verificare che sia presente il charset. Nel caso vengano usati caratteri speciali del tag head (pratica comunque sconsigliata), convertirli nel relativo codice HTML
Indentare il codice
Sembra noioso ma è la pratica più utile e la meno utilizzata: indentare il codice aiuta nella lettura di quest’ultimo. Non c’è un modo universale per farlo, basta essere coerenti e chiari.
CSS e Javascript esterni
Evitare in ogni modo di “sporcare” l’head della pagina con stili CSS e codice Javascript. Finché possibile mantenere entrambi in file esterni e includerli nella pagina.
Annidare il codice nel modo giusto
Evitare di inserire elementi di blocco all’interno di elementi di linea: un tag H1 può contenere un tag A ma non viceversa.
Eliminare i DIV non necessari
Tanti DIV = codice confusionario e pagina lenta. Il consiglio è di ridurre al minimo il numero di DIV. In fondo un menù in una lista può fare a meno di un DIV che la contiene: anche il tag UL è un elemento di blocco.
Convenzioni sui nomi
I nomi di classi e ID devono descrivere il contenuto e non l’aspetto. Ad esempio <span class=”rosso bold”>Convenzioni</span> è concettualmente errato: non è detto che ciò che è rosso e bold oggi sia blue e italic domani.
Lasciare la tipografia ai CSS
Scrivere maiuscolo nel codice della pagina è controproducente: domani potrebbe non esserlo più e ci si ritrova a doverlo cambiare a mano uno a uno. Il CSS svolge questo compito alla grande, perché non lasciarglielo fare?
Dare una classe/ID al body
Dare una classe o ID al body della pagina è utilissimo: mantenendo la stessa struttura XHTML e diversificando il nome del body a seconda della pagina è possibile definire una struttura diversa per ogni pagina ridefinendo tutti gli elementi al suo interno.
Validazione
Validare il codice è il modo più semplice per verificare se ci sono errori all’interno di esso.
Ordine logico
Mantenere l’ordine logico degli elementi nella pagina: la semantica è fondamentale. Evitare di strutturare la pagina in maniera presentazionale, ad esempio il footer dovrebbe essere l’ultima cosa nel markup.
Per ulteriori informazioni o per leggere l’originale, l’articolo è disponibile su Smashing Magazine.