Antes de comenzar o continuar con un diseño responsivo es recomendable saber si este sigue los 10 tips que jamás deben faltar en este tipo de proyectos y que ha recopilado la agencia de marketing digital Mainstreethost en una infografía.
Notas relacionadas
Los 7 principios sagrados del diseño
Este currículo no destaca tus logros, sino tus debilidades
6 tendencias que cambian la naturaleza del diseño
Mainstreethost comienza por una rápida definición del diseño responsivo, el cual se caracteriza por ser flexible y adaptarse al medio en el que se consulta. De igual manera recuerda que la consulta de sitios móviles cada vez se incrementa más en el mundo.
1. Mantén tu layout simple. Dile adiós a JS y Flash, es mejor HTML5 para mantener la mayor simpleza.
2. Utiliza las medidas de consulta. Revisa bien las medidas de resolución más frecuentes para cada tipo de medio consultado.
3. Define los breakpoints.
4. Haz un layout flexible. Utiliza grids flexibles para organizar el contenido. No olvides que la fluidez en el layout es el mejor camino para cualquier tamaño y orientación de la pantalla.
5. El “comportamiento” de las imágenes. Se pueden usar breakpoints para alternar imágenes, vigila que sea adaptable el tamaño, ajusta el ancho.
6. No olvides el máximo y mínimo. Utiliza el máximo y mínimo como límites aplicados a los tamaños relacionados.
7. Haz más cosas que se relacionen. Define una unidad en el contenido y que todo se relacione a él.
8. Si es para móvil, haz navegación tipo telar. Una navegación lineal es lo mejor para un sitio móvil, no debe ser igual que para un dispositivo de escritorio.
9. Mantén lo esencial. Elimina del menú de navegación lo que no sirve o que menos se consulta en una navegación para un dispositivo móvil.
10. Revisa el meta viewport. Una manera simple para hacer que el navegador utilice el tamaño real de la pantalla física es usar un meta tag viewport.
