Ultimamente estoy viendo esto por muchos lados, y etsa muy asociado conel SVG (otro post), alguein tiene idea que utilizadad tienen estos.
Gracias
Printable View
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. Attachment 203
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?
Hola Rodrigo, no hay reglas de tamaño pero facilita mucho el trabajo del maquetador en CSS que cada estado del icono ocupe el mismo tamaño (contando el espacio en blanco alrededor) y que los centros de cada estado sean equidistantes.
Se tiene que tener en cuanto las dimensiones de pantalla de los dispositivos donde se va a visualizar. Esa es la unica limitante
Pero los dispositivos tienen todos diferentes formatos ... hay algún standard?
Entonces hay que diseñarlos centrados en el medio? y como cortan el blanco con una máscara?Quote:
Originally Posted by Salvadorm
