Proprietà Wap CSS dei font e del testo

Lo stesso XHTML MP ha un certo numero di tag che possono contribuire a cambiare lo stile del carattere e la dimensione. Per esempio, per visualizzare un testo in grassetto, è possibile utilizzare la coppia di tag <b> e </b>; per il testo in corsivo si puù usare la coppia di tag <i> e </i>; per il testo con una dimensione più piccola esistono i tag <small> e </small>.

Tuttavia, l'uso di questi tag in una pagina XHTML MP potrebbe confondersi con il contenuto e questo non sarebbe corretto, se dovesse accadere. Si supponga che venga utilizzato il tag <b> associato a tutti i titoli di livello 1 (<h1>), in una pagina renderizzata attraverso un diospositivo mobile. Se si dovesse eliminare il grassetto da tutte le pagine del sito... potrebbe richiedere molto tempo, oltre che essere abbastanza fastidioso.

Le proprietà dei font definite nei WCSS fornisce un maggior controllo sulla dimensione, sullo stile e sul nome del font. Quando si utilizzava il WML (Wireless Markup Lenguage) non era possibile definire tutti questi dettagli, al contrario di quanto acade con l'uso dei WCSS. Tuttavia, si deve tener presente che i font disponibili in molti dispositivi mobili potrebbero essere piuttosto limitati, il che significa che lo stile specificato potrebbe non essere supportato dagli stessi dispositivi. Supponiamo che si dichiari il font Arial per un paragrafo. Se tale carattere non è disponibile nel dispositivo, verrà utilizzato un font alternativo. Da questa considerazione sul comportamento dei dispositivi mobili possiamo dedurre che non sempre potremo avere un risultato rispetto a come lo abbiamo progettato, proprio per via del fatto che, ad oggi, sono stati fatti molti passi avanti per quanto riguarda la tecnologia dei mobile devices ma siamo pur sempre in presenza di uno strumento con delle limitazioni.

Definire specifici nomi di font o usare font generici (proprietà font-family )

Per impostare un nome di font specifico o un font generico è necessario utilizzare la proprietà font-family dei WCSS (uguale a quella dei CSS per i siti web su pc). Ecco un esempio:

In questo caso, Arial e Verdana sono specifici nomi di font e l'ultimo, sans-serif, è il nome generico di una famiglia di font. Lo stile dichiarato nella regola CSS indica al browser WAP che deve essere utilizzato il carattere Arial per visualizzare il testo racchiuso in tutto il sito (body{font-family: Arial, Verdana, sans-serif;}). Se il carattere Arial non è disponibile, deve essere "chiamato in causa" il font Verdana. Se nessuno dei due è installato di default, il browser WAP cercherà di trovare un tipo di carattere che appartiene alla famiglia "sans-serif".

Sarebbe una buona abitudine quella di indicare, alla fine dei nomi dei font specifici, un nome di font generico. Se il nome di un font è composto da più di una parola, separata da spazi, è necessario racchiuderlo tra apici singoli o doppi. Di seguito alcuni esempi WAP CSS:

{font-family: "Times New Roman"}

oppure

  <p style="font-family: 'Times New Roman';">Testo....</p>

Cinque nomi di famiglie di font generici sono accettati dalla proprietà font-family. Essi sono:

• serif;
• sans-serif;
• monospace;
• cursive;
• fantasy.

Da notare che i nomi di queste famiglie di font generici sono delle "parole chiave" e non dovrebbero essere racchiusi all'interno di apici singoli o doppi. Come anticipato più su, è importante notare che non esiste nessuna garanzia che un determinato dispositivo mobile conterrà almeno un font per ogni famiglia di caratteri generici. Infatti, dal sito di Opera, richiamando la seguente pagina: www.extrowebsite.com/lab/xhtml-mobile-profile/pagina-dieci.xhtml, non si vede nessuna differenza tra le famiglie di font. Viene visualizzato il testo con un carattere san-serif.

Impostare la dimensione del font (proprietà font-size)

La proprietà WCSS font-size è utilizzata per impostare la dimensione del carattere di un testo. E' necessario dichiarare un valore affinchè tale dimensione venga rispettata. Un esempio tipico è:

  p {font-size: 12px}  

La proprietà WCSS font-size accetta anche le seguenti parole chiave:

• xx-small;
• x-small;
• small;
• medium;
• large;
• x-large;
• xx-large

Il valore di default dei WCSS per la proprietà font-size è medium. Le parole chiave smaller e larger sono altrettanto valori validi per la proprietà font-size.

Anche in questo caso, come per le famiglie di font, la risposta di un dispositivo mobile è a discrezione. Infatti se si richiama la pagina www.extrowebsite.com/lab/xhtml-mobile-profile/pagina-undici.xhtml attraverso il simulatore di Opera, non si ottiene un risultato uguale a quello che vedremmo se richiamassimo la stessa pagina da un browser per computer.