Thread: Responsive Icons

Ultimamente estoy viendo esto por muchos lados, y etsa muy asociado conel SVG (otro post), alguein tiene idea que utilizadad tienen estos.
Gracias

Responsive significa que se adapta a la resolucion de pantalla donde se visualice, los formatos son vectoriales por tanto son muy recomendables para usar en la web.

Hola tamaramf, conozco el concepto de Responsive Icons aplicado al diseño web, el uso de CSS3 permite detectar características del usuario como las dimensiones su pantalla y el dispositivo que está usando, y en base a eso modificar los estilos de la página, en el caso de un icono puede ser una imagen de fondo cuya posición va variando, éste sería un ejemplo:

Responsive Icons

al redimensionar la ventana de nuestro navegador podemos ver como cambia el icono, que realmente siempre es la misma imagen pero cambia la posición dentro de la misma, ésta es la imagen:

icon

Gracias por sus respuestas!!
parece ser algo muy útil. Esto se tiene que setear desde el diseño del icono, o es algo que se maneja desde el maquetado o ya es mas de programación?

Bueno, primeramente la imagen debe contener todas las posibles formas del icono, como una tira de imágenes en una sola, luego en el maquetado CSS de la página se decide cual "pedacito" de la imagen se muestra en función de detalles como pueden ser las dimensiones de la ventana del navegador del usuario.

Ahhh! entonces en el ilustrator se hace un imagen/dibujo con los tamaños posibles, osea progresivo de más pequeno a más grande y luego eso se exporta y la configuracion se hace desde el maquetado?

se llaman "sprite" y es exactamente eso una tira de imagenes de todos los tamaños posibles a visualizar. icono-svg-illustrator.jpg

Así mismo, luego la persona que maqueta en CSS establece las reglas para que de acuerdo a condiciones del dispositivo desde el que el usuario ve la página se muestre uno u otro pedacito de esa tira de imagenes.

Ahh buenismo, esta genial que el icono se adapte segun el tamaño. Después lo voy a probar con una página que tengo que hacer.
Muchas Gracias

Hay alguna regla en tamaño a respetar a la hora de diseñarlos?