Una de las mejores maneras de mejorar la carga de nuestros sitios web, es la de intentar utilizar la menor cantidad posible de imágenes en el diseño de los mismos. Para ello, podemos utilizar diversas técnicas CSS para sustituir dichas imágenes y realizar algunos de los efectos que necesitemos. Sin embargo, siempre hay que utilizar algunas imágenes porque no es posible sustituirlas con CSS.
En el caso de los iconos que utilizamos en nuestros trabajos, también podemos sustituirlos con @font-face gracias a las tipografías compuestas por símbolos. Además de mejorar la carga reduciendo las peticiones al servidor, también disponemos de diversas medidas de icono según el tamaño que dispongamos en la fuente.
A continuación os dejo una lista de 10 tipografías gratuitas compuestas por iconos:
Social Media Icons Pack
- Número de iconos: 74
- Página de descarga: Social Media Icons Pack
Modern Pictograms
- Número de iconos: 89
- Página de descarga: Modern Pictograms
Font Awesome
- Número de iconos: 220
- Página de descarga: Font Awesome
Foundation Icon Fonts 2
- Número de iconos: 97
- Página de descarga: Foundation Icon Fonts 2
Raphaël Icon-Set
- Número de iconos: 116
- Página de descarga: Raphaël Icon-Set
Entypo
- Número de iconos: 150
- Página de descarga: Entypo
PulsarJS
- Número de iconos: 73
- Página de descarga: PulsarJS
Iconic
- Número de iconos: 171
- Página de Descarga: Iconic
Ligature Symbols
- Número de iconos: 212
- Página de descarga: Ligature Symbols
A Free Icon Webfont
- Número de iconos: 60
- Página de descarga: A Free Icon Webfont