Iconic Stroke: una fuente de iconos muy interesante

En las ultima semanas tengo el blog un poco parado ya que estoy a tope con otros proyectos. Entre ellos, algunos relacionados, como no, con aplicaciones móviles. Uno de estos proyectos lo estoy realizando junto a Javier Jimenez que es un experto en HTML5, JavaScript y todo lo relacionado con UX en general.

Diseñando una aplicación, a Javi se le ocurrió la idea de usar una fuente de Iconos en vez de imágenes para aligerar la aplicación y que fuera mas fácil de diseñar y trabajar con transparencias etc… La fuente en cuestión es la Iconic Stroke y las posibilidades que ofrece creo que son muy interesantes, no solo de cara a no tener que usar imagenes, ya que CSS3 nos permite usar fuente propias, sino que, de cara a diseñar iconos también nos puede ser de gran ayuda. Por eso os dejo aquí un link de donde podéis descargar esta fuente y un ejemplo de los iconos, cargando la fuente con CSS3.

http://googlefontdirectory.googlecode.com/hg/iconic/IconicStroke.ttf

Solo veréis los iconos si usáis un navegador que soporte CSS3 como Firefox, Crome o Safari.
! # $ % & ( ) *
! # $ % & ( ) *
+ , - . / 0 1 2 3 4
+ , - . / 0 1 2 3 4
5 6 7 8 9 : ; < = >
5 6 7 8 9 : ; < = >
? @ A B C D E F G H
? @ A B C D E F G H
I J K L M N O P Q R
I J K L M N O P Q R
S T U V W X Y Z [ \
S T U V W X Y Z [ \
] ^ _ ` a b c d e f
] ^ _ ` a b c d e f
g h i j k l m n o p
g h i j k l m n o p
q r s t u v w x y z
q r s t u v w x y z
{ | } ~
{ | } ~

2 Responses to Iconic Stroke: una fuente de iconos muy interesante
  1. Manrique

    ¿Habéis probado a usar css-sprites?
    http://www.w3.org/TR/mwabp/#bp-conserve-sprites

    Un saludo ;-)

  2. Iker

    El tema es que no nos interesaba usar imágenes… aunque para navegadores que no soporten web-fonts.. puede ser una posibilidad..

Deja un comentario

Your email address will not be published. Please enter your name, email and a comment.

Puedes usar las siguientes etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>