Cargando

Ir a contenido


 


Emular dispositivos móviles en Google Chrome

En este tutorial te mostraremos como puedes emular el comportamiento de una página web en distintos dispositivos móviles desde Google Chrome.


Escrito por el jul 27 2015 10:41 chrome


Al momento de construir un sitio o aplicación web, siempre nos queda la tarea de comprobar si todo luce de manera correcta en un dispositivo móvil o incluso tablet, y si estamos trabajando en desarrollo no tenemos como hacerlo, ya que tendríamos primero que enviar nuestros cambios al servidor y allí consultarlo en nuestro dispositivo móvil.

 

Pero no debemos preocuparnos ya que Google Chrome posee una funcionalidad la cual nos permite con unos simples pasos verificar como luce nuestro sitio web o aplicación en el dispositivo móvil que deseemos.

 

Paso 1

Primero abrimos el sitio web o aplicación en Google Chrome, y acto seguido hacemos click derecho y en el menú seleccionamos Inspeccionar Elemento.

 

Paso 2

Tendremos un menú en la parte inferior que se desplegará, el cual nos muestra el código HTML de la página, estando allí nos dirigimos a la parte izquierda y seleccionamos el ícono del móvil y vemos como un menú con unas listas desplegables de colores aparecen, además de una especie de cuadrícula alrededor de nuestra página.

 

Paso 3

Estando allí nos dirigimos al menú desplegable de color naranja y seleccionamos el dispositivo que deseamos emular, en este caso seleccionamos Apple iPhone 6 y refrescamos para que los cambios se hagan efectivos:

 

 

Paso 4

También podemos emular la red en la que nos encontremos en el menú desplegable azul, y si en la lista de dispositivos no se encuentra el móvil el cual queremos probar podemos ingresar las medidas de la pantalla de manera manual:

 

 

Ya con esta funcionalidad no tendremos que buscar nuestro móvil para probar que nuestra página web o aplicación funcione de manera correcta, solo queda de cada quién explorar esta herramienta un poco más y utilizarla para acortar los tiempos de prueba e implementación.

¿Te ha gustado y ayudado este Tutorial?
Puedes premiar al autor pulsando este botón para darle un punto positivo
  • -
  • 0
10
VOTA
5
100%
4
0%
3
0%
2
0%
1
0%

  Información

  •   Publicado jul 27 2015 10:41
  •   Actualizado ago 22 2016 15:50
  •   Visitas 1.1K
  •   Nivel
    Básico



Tutoriales Relacionados


2 Comentarios

Genial tutoríal, nos va a servir a más de uno a trastear y testear en versión móvil.

Enrique Martin
jul 27 2015 20:47
Lo uso a menudo, ayuda más de lo que imagináis. Salen todas las versiones de mobile disponibles
No esperes más y entra en Solvetic
Deja tus comentarios y aprovecha las ventajas de la cuenta de usuario ¡Únete!
Demuestra que eres experto!
  ESCRIBIR TUTORIAL
Suscribirse