responsive adaptable

Diseño Web Responsive: Herramientas para testear tu sitio

2276

A estas alturas seguro que no hace falta convencerte de que adaptar tu sitio web al mobile es una necesidad y bastante prioritaria si no queremos perder visitantes que, cada vez más, acceden a nuestro sitio desde dispositivos móviles. De entre las opciones que existen para disponer de un sitio web optimizado para el móvil, el Responsive Design (o diseño web responsive o adaptable) se está convirtiendo en un estándar y es que no podemos perder de vista que Google ha declarado abiertamente su predilección por este tipo de solución.

Por si alguien todavía no sabe en qué consiste el Responsive Design, podríamos decir, de una manera muy sencilla, que la maquetación de este tipo de sitios web se adapta al ancho de la pantalla del dispositivo con el que se está visualizando el sitio web, de esta manera tendremos el mismo sitio web, con las mismas URLs y el mismo contenido para móviles, tablets, PCs o SmartTV. Si utilizamos un CMS para construir nuestra web, como WordPress, Prestashop, Joomla, etc. podremos dar el paso a Responsive con tan solo instalar una plantilla que venga declarada como tal, es decir que sea Responsive. Pero aún así es muy probable que tengamos que hacer algunos ajustes y retoques para que se siga viendo todo bien en cada dispositivo después de adaptar el template a nuestra imagen corporativa.

Vamos a repasar algunas herramientas que nos permiten testear nuestro sitio web responsive para saber cómo se va a visualizar en los diferentes dispositivos:

1. Responsinator Es una herramienta muy simple que nos permite hacer un preview de nuestro sitio web en algunos de los dispositivos móviles disponibles en el mercado. Lo único que tenemos que hacer es introducir la URL del sitio web a testear y luego ir haciendo scroll para ver cómo queda. El único inconveniente que le podríamos encontrar es que en ocasiones tarda un poco en mostrar el sitio web en todas las pantallas. responsinator  2. Responsive Design Testing Tool En esta herramienta, que es tan sencilla de utilizar como la anterior, nos muestra el sitio web en diferentes resoluciones de pantalla en lugar de hacerlo por dispositivos concretos, de modo que podemos comparar lo que ocurre al ir variando el ancho del dispositivo.

mattkersley

3. Screenfly

Screenfly es parecida a las anteriores, en esta podemos seleccionar el dispositivo concreto o utilizar diferentes medidas de pantalla. Dispone de una regla que nos puede ser muy útil para hacer los retoques necesarios para que nuestro sitio se vea de la mejor manera en todos los soportes.

screenfly

 

Y tu ¿Conoces alguna otra herramienta útil para optimizar o testear un sitio responsive? Si es así no dudes en comentar.

0

Leave a Comment

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *