Diseño web para móviles y tablets

Llevaba ya demasiado tiempo relegando la tarea de adaptar el diseño web de diferentes blogs y portales para su correcta visualización en terminales móviles y tables con resoluciones reducidas. Finalmente me he animado tras consultar las estadísticas de visitas vía statcounter y descubrir como cerca de un 25% del tráfico proviene de este tipo de dispositivos.



No es una tarea sencilla o evidente, por lo que me he liado la manta a la cabeza y he comenzado un proceso de investigación a través del cual pretendo rescatar sencillos consejos para adaptar los diseños web ya existentes. Otra opción era el rediseño desde cero, pero meditando el tema creo que me llevaría bastante más tiempo.

En este artículo me gustaría recopilar los diferentes enlaces que he encontrado y que me están ayudando en esta labor.

- studiopress.com : Comprobar rápidamente como se visualizará nuestra web en múltiples resoluciones o dispositivos.
- html5rocks.com : Algunos consejos básicos para arrancar un proyecto desde cero.
- hongkiat.com : Otra interesante recopilación de consejos para dispositivos móviles.
- Elementos embed, object, y en concreto youtube y vimeo embebido avexdesigns.com
- Sobre Adsense: Responsive ads y
codeitdown
Algunas de las cosas importantes que no podemos olvidar:

- Para evitar que el dispositivo trate de hacer un zoom "inteligente" por su cuenta: Recordar definir el meta viewport con width=device-width.


Algunas comprobaciones:

- PageSpeed Insights
- Mobile Checker W3C

De momento arrancamos con esto, y a buen seguro el listado irá creciendo durante las próximas semanas.