Families de tipografies i altres ajustos

Quan fem una pàgina web, difícilment sabem en quins entorns es visualitzarà. El CSS preveu això. La manera com definim les tipografies n’és un exemple.

Quan indiquem la tipografia que volem fer servir, hem de tenir en compte que no sabem si l’usuari tindrà aquesta tipografia instal·lada. Per això no donem una única tipografia, sinó una familia de tipografies.

p{
font-family: Helvetica, Arial, sans-serif;
}

En l’exemple, Helvetica i Arial són el nom de dues tipografies. Sans-serif, en canvi, és el nom de tota una familia (aquelles tipografies sense serifa). El navegador mirarà de fer servir Helvetica i si no la troba, provarà amb el següent element de la llista: Arial. Si tampoc troba Arial, aleshores buscarà una tipografia qualsevol que no tingui serifa.

Les families de tipografies són:

• sans-serif: sense serifa
• serif: amb serifa
• fantasy: especials
• cursive: imiten la caligrafia
• monospace: tipus màquina d’escriure, totes les lletres ocupen el mateix

Web fonts

Una altra opció és fer servir tipografies web. Aquestes tipografies són descarregades a l’ordinador de l’usuari temporalment per el seu ús a una pàgina web. El millor és fer servir un servei de tipografies web, que s’encarrega d’allotjar les tipografies i servir-les a l’usuari que les necessita. Hi ha serveis de tipografies web de pagament i gratuïts.

El servei d’allotjament de tipografies web gratuït més popular és Google Web Fonts.

Propietats aplicables a la tipografia

A continuació trobaràs una sèrie de propietats aplicables a la tipografia i les URLs on trobaràs tots els seus possibles valors.

font-weight
https://developer.mozilla.org/es/docs/Web/CSS/font-weight

font-style
https://developer.mozilla.org/es/docs/Web/CSS/font-style

text-transform
https://developer.mozilla.org/es/docs/Web/CSS/text-transform

text-decoration
https://developer.mozilla.org/es/docs/Web/CSS/text-decoration