Uso de iconos como tipografía en tus desarrollos webs. ¡También accesibles!

Por qué seguimos utilizando sprites para nuestros iconos, pngs, hablando de iconos para retina…  pudiendo vincular una css que tira de una tipografía y que podemos personalizar nosotros mismos y que nos permite entre muchas otras cosas redimensionarlas, cambiarlas de color…

Es hora de cambiar el chip, aquí os dejo el link ¿Cómo convertir iconos en fuentes?,  un interesante artículo que habla de ello y como implementarlo de forma muy sencilla. Ya no tienes escusa.

Si además necesitas que sean accesible, os dejo otro link de cómo hacer iconsfonts accesibles.

 

como-covertir-tus-iconos-en-fuentes

 

También os dejo otra herramienta, fontastic, que permite hacer los mismo de una forma sencilla intuitiva y fácil.

 

fontastic_me

Debug responsive desde tu smartphone Android

remote-debug-banner

¿Cuántas veces hemos escuchado eso de “Ójala se pudiera hacer debug desde el movil” para tus sitios responsive?

Pues esto ya no es un problema. Android y Chrome nos lo ponen fácil. Sólo hay que seguir estos sencillos pasos:

  1. Abrimos cualquier URL desde el chrome de nuestro smartphone Android.
  2. Conectamos nuestro smartphone Android por USB a nuestro PC.
  3. Desde Settings > Developer options., activamos el Debug por USB
    1. En Android 4.2 o superiores, para acceder a las Developer options hay que entrar en Settings > About phone y hacer tap 7 veces en Build number
  4. Ahora nos vamos a nuestro PC, abrimos Chrome y pulsamos F12. En las opciones abrimos Inspect Devices y activamos Discover USB Devices.
  5. ¡Listo! ¡Ya tenemos la navegación de nuestro Smartphone y nuestro PC sincronizada!

Ahora, si navegamos por cualquier site con nuestro smartphone (hay que usar chrome) podremos hacer debug desde nuestro PC.  A partir de aquí lo mejor es probarlo por tí mismo porque es muy sencillo.

El resultado final será algo parecido a esto:

 

 

A debugear!!

El maravilloso mundo del Email Responsive

img

Hola, tenemos que maquetar este email responsive… NOOOOOO!!!

Todos los que nos enfrentamos a este reto, sabemos la gran cantidad de variables que existen a la hora de maquetar un email responsive para que se visualice bien en la gran mayoría de los proveedores de correo; que si Outlook no soporta margins, que si las app de Gmail para iOS y Android  no soporta media-queries…

Os dejo un post donde nos explican cómo solucionar la mayoría de problemas y que nuestros emails se visualicen correctamente. http://webdesign.tutsplus.com/tutorials/creating-a-future-proof-responsive-email-without-media-queries–cms-23919

Espero que os sea útil.