Il testo in html non necessita di tag fino a quando non creiamo un paragrafo (o inseriamo un tag particolare come per es. “span” o “hn“) perchè questo linguaggio è un linguaggio testuale; per formattare il testo con i css siamo obbligati ad inserirlo dentro un tag html.
1) formattare il tag p
La procedura più comune è quella di inserire il testo dentro un tag “p” (paragrafo); per fare ciò occorre selezionare il testo e chiedere “paragrafo” dalla barra delle proprietà, a meno che questo testo non abbia già un a capo (cioè un paragrafo).
Per formattare un tag p, occorre fare una regola promiscua che identifichi il tag all’interno del contenitore (div) dove risiede (es.: #mainContent p – che significa: formatta tutti i paragrafi dentro mainContent)
2) formattare i tag hn per le intestazioni testuali
I tag hn (h1, h2, …) sono chiamati intestazioni perchè danno una maggiore rilevanza al testo (soprattutto per i motori di ricerca). Oltre all’importanza testuale, formattano in maniera automatica il testo all’interno del tag modificandone la dimensione in funzione del numero associato (h1 e più importante di h2…); chiaramente il nostro compito è quello di creare regole di formattazione css promiscue per ogni tag all’interno dei vari contenitori div (es.: #mainContent h1). Anche in questo caso per racchiudere un testo dentro i tag occorre selezionarlo ed agire sulla barra delle proprietà chiedendo “intestazione n”.
3) formattare il testo con l’uso di regole di classe
I css con selettore di classe possono venire molto utili quando abbiamo la necessitò di differenziare un testo all’interno di uno stesso paragrafo (anche se il tag p non c’è). La procedura è inversa perchè dobbiamo creare prima la regola (di classe) e poi applicarla alla parte di testo selezionata. DW inserirà il testo evidenziato all’interno di un tag “span” al quale verrà associata la classe creata precedentemente.
4) sfruttare i tag hn per l’indicizzazione
Se abbiamo necessità che i motori di ricerca intendano una frase che risiede all’interno di un testo come una frase importante da indicizzare, possiamo creare una regola promiscua con i tag hn, formattandola con le stesse proprietà della regola css che formatta il tag p (presente dentro lo stesso contenitore);
es. #mainContent p e #mainContent h4 con le stesse proprietà (font, dimensione, colore…).
possiamo agire duplicando la regola e cambiandone il nome. Gli accorgimenti da adottare sono:
a) mandare a capo la frase inserendola dentro il tag hn;
b) impostare lo spessore del font su “normale” nella regola per hn;
c) impostare i margini a zero nella regola per hn;
NB: questi trucchi possono dare una maggiore indicizzazione al testo, ma in futuro potrebbero penalizzarla per via non corrispondenza della visualizzazione con l’importanza del tag.