As clasificacións de fontes xenéricas dispoñibles para usar no teu sitio web
Ao deseñar un sitio web, un dos elementos clave dunha páxina coa que vai traballar é o contido de texto. Como tal, cando constrúes unha páxina web e o estilo con CSS, gran parte dese esforzo centrarase en torno á tipografía do sitio.
O deseño tipográfico desempeña un papel importante no deseño do sitio web. Contido de texto ben definido e formateado axuda a que un sitio teña máis éxito creando unha experiencia de lectura que sexa agradable e fácil de consumir. Parte dos seus esforzos para traballar co tipo será escoller as fontes correctas para o seu deseño e logo usar CSS para engadir eses tipos e fontes á visualización da páxina. Isto faise empregando o que se chama " font-stack "
Font-Stacks
Cando especifica unha fonte para usar nunha páxina web, é unha boa práctica incluír tamén opcións de reserva se a súa fonte non se pode atopar. Estas opcións de devolución amósanse na "pila de fontes". Se o navegador non atopa a primeira fonte listada na pila, move á seguinte. Continúa este proceso ata atopar unha fonte que pode usar, ou se queda sen opcións (nese caso só elixe calquera fonte do sistema que queira). Aquí móstrase un exemplo de como se vería unha fonte-stack en CSS cando se aplicou ao elemento "body":
corpo {font-family: Georgia, "Times New Roman", serif; }Teña en conta que especificamos primeiro a fonte Georgia. Por defecto, isto é o que usará a páxina, pero se esa fonte non está dispoñible por algunha razón, a páxina recorrerá a Times New Roman. Engadimos ese nome de fonte en comiñas dobres porque é un nome de varias palabras. Os nomes de fontes de palabra única, como Georgia ou Arial, non requiren as comiñas, senón que o nome de fonte multi-palabra precisa deles para que o navegador saiba que todas esas palabras compoñen o nome da fonte.
Se ollas ao final da pila de fontes, debes notar que terminamos coa palabra "serif". Ese é un nome de familia de fontes xenérico. No caso improbable de que unha persoa non teña Xeorxia ou Times New Roman no seu computador, o sitio usaría calquera fonte serif que puidese atopar. Isto é preferible para permitir que o sitio faga referencia a calquera tipo de letra que desexe, porque polo menos pode dicir que tipo de fonte usar para que o aspecto xeral do proxecto dun sitio sexa o máis intacto posible. Si, o navegador escollerá unha fonte para ti, pero polo menos está a proporcionar orientación para que sabe que tipo de fonte funcionaría mellor dentro do deseño.
Familias de fontes xenéricas
O nome genérico de fonte dispoñible en CSS é:
- cursiva
- fantasía
- monospace
- serif
- sans-serif
Aínda que hai moitas outras clasificacións de fontes dispoñibles en deseño web e tipografía, incluíndo slab-serif, blackletter, pantalla, grunge e moito máis, estes 5 nomes de fontes xenéricos listados arriba son os que usaría nunha fonte-stack en CSS. Cales son as diferenzas entre estas clasificacións de fontes? Vexamos unha ollada!
As fontes cursivas adoitan ter letras de forma delgada e ornamentada que están destinadas a reproducir texto elegante manuscrito. Estas fontes, por mor das súas letras finas e floridas, non son apropiadas para grandes bloques de contido como a copia do corpo. Normalmente úsanse fontes cursivas para títulos e necesidades de texto máis curtas que se poden mostrar en tamaños de letra maiores.
As fontes de fantasía son fontes un tanto tolas que realmente non caen noutra categoría. As fontes que replican logotipos coñecidos, como as letras de Harry Potter ou Back to the Future, caerán nesta categoría. Unha vez máis, estas fontes non son apropiadas para o contido do corpo, xa que moitas veces son tan estilizadas que a lectura de textos máis longos de texto escritos nestas fontes é moi difícil de facer.
As fontes de monospace son aquelas onde todas as formas de letra son de tamaño e espazos igual, como se atopou nunha máquina de escribir antiga. A diferenza doutras fontes que teñen anchos variables para as letras segundo o seu tamaño (por exemplo, un "W" de capital tería moito máis espazo que un minúsculo "i"), as fontes de monospace son ancho fixo para todos os caracteres. Estas fontes úsanse a miúdo cando se mostra o código nunha páxina porque se ven distintamente diferente do que noutro texto nesa páxina.
Fontes Serif son unha das clasificacións máis populares. Estas son fontes que teñen as pequenas ligaduras extra nas formas de letras. Esas pezas adicionais son chamadas "serifs". As fontes serif comúns son Georgia e Times New Roman. As fontes serif pódense usar para texto grande como o título así como pasaxes longas de texto e copia corporal.
Sans-serif é a clasificación final que veremos. Son fontes que non teñen esas ligaduras. O nome significa "sen serifs". As fontes populares desta categoría serían Arial ou Helvetica. Do mesmo xeito que os serifs, as fontes sans-serif poden usarse igual de ben nos encabezados e no contido do corpo.
Artigo orixinal de Jennifer Krynin. Editado por Jeremy Girard o 16/10/17