Cuando especificamos un font-family esperamos que se tomen las fuentes citadas por orden de preferencia. De tal forma que si la primera no esta disponible en la plataforma del usuario, se recurra a la segunda y así sucesivamente.

Se debe buscar compatibilidad y unidad del diseño, siendo muy importante la similitud en el orden de preferencia.

body {
	font-family: verdana, arial, helvetica, sans-serif;
}
  1. verdana
  2. arial
  3. helvetica
  4. sans-serif

El problema es que muchos editores web (por ejemplo Dreamweaver) tienen por defecto asignados unos «grupos» de fuentes en los que el orden según las similitudes es algo cuestionable (como en el ejemplo expuesto).

La verdana tiene más similitudes con tahoma y menos con arial.

Lo ideal sería conocer a fondo los tipos que se desean emplear en un proyecto web y establecer un buen orden de preferencia con otros tipos realmente similares.

CSS permite escribir las reglas de forma abreviada lo cual repercute principalmente en dos beneficios:

  • Optimización: La escritura abreviada hace que nos ahorremos muchas líneas de código CSS y esto se traduce en menos bytes a descargar por parte del navegador que accede al sitio web.
  • Legibilidad: Un código con reglas de CSS abreviadas es inmensamente más legible y fácil de mantener.

Continue reading «Formas abreviadas para optimizar CSS»