Seguramente muchos os hubierais dado cuenta de que actualmente los capítulos de la megaentrada “Como crear una web” todavía estaban un poco incompletos. Estas entradas no pretenden ser un curso completo, sino aportar datos conseguidos mediante la experiencia y así dar una visión más real de la creación de una página web.
Los iconos para tu web
Nuestros lectores habituales, es muy posible que hayan conocido Somos Binarios 1.0 es decir, la interfaz antigua de nuestra web, al renovarla una de las cosas en la que pusimos más atención fue en el tema de los iconos. Actualmente usamos una gran cantidad de iconos y os vamos a enseñar a como podéis usarlos en vuestros propios proyectos.
Lo primero de todo, es que principalmente hemos usado dos herramientas Font Awesome y Flaticon.
Font Awesome : iconos para tu web en forma tipografía
La verdad es que nunca habría podido imaginar, que a alguien se le ocurriese crear una tipografía, en la cual en lugar de tener las típicas letras del alfabeto, estuviera formada por iconos. Font Awesome se basa en eso, tienen un gran conjunto de iconos y al usarlo como una tipografía su uso es muy sencillo.
Lo primero de todo debemos incluir su archivo .css (hoja de estilos) en nuestra cabecera y después simplemente podemos usarlos de la siguiente manera.
<i class=fa fa-twitter> Icono de twitter</i>
y nos saldrá algo así:
Icono de twitter
Pero eso no es todo, al estar en ese formato es ampliamente escalable sin perder la calidad y admite muchos modificadores de estilo de CSS como es asignarle un color, un fondo, un borde etc.
Icono de twitter
Podéis ver más información en su web oficial.
Flaticon : iconos para tu web en multitud de formatos
Esta web es otra de las que hemos utilizado en gran medida, para realizar las imágenes que acompañan a nuestras entradas. Ofrecen una gran cantidad de iconos, tanto para descargar y usar (en distintos formatos):
Como por ejemplo:
La verdad es que su “repositorio” de iconos es muy grande y están todos diseñados con el mismo estilo, lo que permite que se mantenga un mismo estilo visual en toda la web.
Desde aquí queremos dar las gracias a este proyecto.
Finalmente, ¿conoces algún otro servicio de iconos, o te gustaría buscar alguna recomendación?, déjanos un comentario