¿Mi sitio se visualiza correctamente en un dispositivo móvil?

La web actualmente impone ciertas reglas para que se pueda adaptar en cualquier dispositivo, como computadoras de escritorio, laptops, tablets, smartphones e incluso televisiones. Una de estas reglas es tener un sitio web adaptativo, mejor conocido como responsive.

Responsive es una forma de concepción web que permite ofrecer una mejor experiencia de consultación que se adapta a todos los dispositivos. Como mencionamos anteriormente, también puedes visualizar y navegar en tu sitio web desde una computadora o un smartphone.

Image illustration 2

¿Como saber si mi sitio es responsive?

Desde hace ya un buen tiempo, todos los temas que se proponen en emiweb son responsive. Si hoy creas un sitio, tu tema será responsive. Si todavía no cuentas con este tipo de temas, es posible cambiarlo.

Elegir el tema no lo es todo, pues también se tiene que utilizar contenido adecuado. Después de haber creado tu contenido con estas recomendaciones, es necesario que previsualices tu sitio para corroborar que es responsive. Para ello te vamos a explicar como puedes comprobar esto.



Primera solución

La primera solución es la más simple. Como si fueras un visitante, puedes simplemente abrir tu sitio web con tu smartphone o tablet, para verificar que todo funciona correctamente, te aconsejamos probar diferentes menús y links para obtener una vista general de la navegación.

Sin embargo, ciertas personas no cuentan con estos dispositivos , o tienes un smartphone análogo con un navegador web no actualizado. Aveces es más fácil probar directamente desde el navegador de tu computadora.









Directamente en el navegador

Ciertos navegadores cuentan con opciones que te permiten previsualizar tu sitio en diferentes formatos. Vamos a realizar estos ejemplos con los navegadores de Google Chrome y Mozilla Firefox.

Con Google Chrome

  • Dirigete a tu sitio
  • Oprime la tecla F12
  • Aparecerá una ventana a la derecha o en la parte inferior de tu pantalla. En la parte superior a la izquierda de esta ventana verás dos iconos pequeños.
  • Da click en el segundo icono que tiene forma de un smartphone o tablet.

  • Puedes elegir el tamaño de la pantalla en la barra horizontal de la parte superior. Esta barra te permitirá de probar en diversas resoluciones, como el Nexus 5X, iPhone 6 o iPad Pro.



Con Mozilla Firefox

  • Dirigete a tu sitio
  • Oprime la tecla F12
  • Aparecerá una ventana a la derecha de tu pantalla. En la parte superior a la derecha de esta ventana verás seis iconos pequeños.
  • Da click en el tercer icono que representa un smartphone.
  • Puedes elegir el tamaño de la pantalla en la barra horizontal de la parte superior.
  • Al contrario que Chrome, Firefox no ofrece la opción de los nombres de smartphones o tablets, pero sí resoluciones equivalentes.


Por medio de una extensión Chrome

El punto fuerte de los navegadores actuales es que están abiertos a más posibilidades. Descargando las extensiones, puedes utilizar nuevas herramientas. Hay extensiones especiales de pequeño formato en la visualización de tu sitio (las cuales no están disponibles para Mozilla Firefox).

En Google Chrome, es posible descargar la extensión Responsive Web Design Tester. Da click en Añadir a Chrome para instalarla. Esa se mostrará en un pequeño icono en la parte superior a la derecha de tu navegador. Cuando hayas ingresado a tu sitio, da click en este icono. Aparecerá una lista con modelos de smartphones y tablets Android y iOS (Apple) cada vez que estés en modo paisaje (landscape) o retrato, solo tienes que seleccionar un elemento de la lista para probar la visualización del sitio en el formato de este elemento.



Por medio de un sitio especializado

Hay una tercera solución. Si no quieres instalar una extensión en Google Chrome o utilizar un navegador diferente, existen sitios que te permiten visualizar el resultado en responsive.

  • Dirígete al sitio Piresponsive
  • Ingresa la dirección de tu sitio web (con el formato  " www.mi-sitio-pro.emiweb.com" o "www.mi-sitio-pro.com" si es que cuentas con un Dominio) en la barra que se encuentra en el centro de la pantalla.
  • En la barra horizontal en la parte superior puedes cargar la visualización, puedes elegir entre computadoras, tablets y smartphones.
  • También puedes cambiar la visualización de retrato o paisaje dando click en el icono que se encuentra ala derecha del icono de smartphones.