¿Necesita acceder a un emulador de navegador de teléfono inteligente en su PC para probar la versión móvil de un sitio web que le interesa? Tal vez usted es un desarrollador web, o quiere convertirse en uno, y necesita simular un navegador móvil para el proyecto en el que está trabajando. Independientemente^(Regardless) de sus razones, aquí le mostramos cómo acceder a un emulador de navegador móvil en Google Chrome , Mozilla Firefox , Microsoft Edge y Opera:

Cómo encender y usar el emulador de navegador móvil en Google Chrome

En Google Chrome , navegue al sitio web que desea ver en el emulador de navegador móvil. Luego, presione las CTRL + SHIFT + I en su teclado o, con el mouse, haga clic en los tres puntos verticales en la esquina superior derecha para abrir el menú "Personalizar y controlar Google Chrome"^{(“Customize and control Google Chrome”)} . Elija Más herramientas,^{(More tools, )} seguido de Herramientas para desarrolladores^{(Developer Tools)} .

Acceda a las herramientas para desarrolladores^{(Access Developer Tools)} en Google Chrome

Haga clic o toque el botón "Alternar barra de herramientas del dispositivo"^{(“Toggle device toolbar”)} (parece un teléfono inteligente al lado de una tableta) o presione CTRL + Shift + M en su teclado. Esto activa la barra de herramientas del dispositivo donde se carga la página móvil. De forma predeterminada, la barra de herramientas del dispositivo utiliza una plantilla receptiva^(Responsive) para el sitio que cargó. Haga clic^(Click) en él y elija el dispositivo móvil que desea emular. Sus opciones incluyen muchos iPhones, iPads, Surface Duo , dos dispositivos Samsung Galaxy y un simulador de navegador móvil Moto G4 para PC.^{(Moto G4 mobile)}

Cómo habilitar el emulador de navegador móvil en Google Chrome

SUGERENCIA:^(TIP:) Desafortunadamente, puede usar el método abreviado de teclado CTRL + Shift + M

Navegue^(Navigate) por el sitio que desea probar, cambie entre los diferentes teléfonos inteligentes y tabletas y vea cómo se ve. Cuando haya terminado, presione el botón X (Cerrar)^{(X (Close))} en la esquina superior derecha de las herramientas para desarrolladores de Google Chrome para volver al modo de navegación de escritorio estándar.

Cerrar el emulador de navegador móvil Google Chrome

SUGERENCIA:^(TIP:) si es un gran usuario de Google Chrome , también puede querer aprender a usar las opciones de control de medios de Google Chrome^{(how to use Google Chrome’s media control options)} .

Cómo encender y usar el emulador de navegador móvil en Mozilla Firefox

En Mozilla Firefox , abra el sitio para el que desea utilizar un simulador de navegador móvil. Luego, presione CTRL + Shift + M en su teclado o haga clic en el botón de hamburguesa en la esquina superior derecha para abrir el menú de Firefox y elija Desarrollador web^{(Web Developer)} .

Accede a las herramientas de desarrollo web en ^{(Web Developer)}Firefox

Verá un menú lleno de herramientas que son útiles para los desarrolladores web. En la lista, seleccione "Modo de diseño receptivo",^{(“Responsive Design Mode,”)} y este modo particular de ver una página web se carga en Firefox .

Elija el modo de diseño receptivo^{(Responsive Design Mode)} en Firefox

Firefox habilita el modo de diseño receptivo^{(Responsive Design Mode)} . En la parte superior de la ventana, verá los parámetros utilizados por este modo de emulación. Si no se selecciona ningún dispositivo, haga clic o toque Responsive para abrir una lista desplegable con dispositivos disponibles para la emulación y luego elija el que desea simular.

Puede simular el navegador móvil para muchos iPhones, iPad, Kindle Fire ( Firefox es el único navegador que ofrece esta opción de emulación) y dispositivos Samsung Galaxy S9 .

Usa el emulador de navegador móvil en Firefox

Cuando haya terminado de probar con el emulador de navegador de teléfono inteligente, presione el botón X (Cerrar el modo de diseño receptivo)^{(X (Close Responsive Design Mode))} en la esquina superior derecha de Mozilla Firefox .

Cierre el emulador de navegador móvil en Firefox

Ha vuelto al modo de navegación de escritorio estándar.

Cómo encender y usar el emulador de navegador móvil en Microsoft Edge

Microsoft Edge usa el mismo motor de renderizado que Google Chrome y ofrece los mismos emuladores de navegador para teléfonos inteligentes. Para acceder a ellos, visite el sitio web que desea probar y presione las CTRL + SHIFT + I en su teclado o haga clic en los tres puntos horizontales ( "Configuración y más"^{(“Settings and more”)} ) en la esquina superior derecha de Microsoft Edge . En el menú que aparece, ve a Más herramientas^{(More tools)} y luego a Herramientas para desarrolladores^{(Developer Tools)} .

Accede a las herramientas de desarrollador en ^(Developer)Microsoft Edge

Haga clic en el botón "Alternar emulación de dispositivo"^{(“Toggle device emulation”)} (parece un teléfono inteligente al lado de una tableta) o presione CTRL + Shift + M en su teclado. Esto activa la barra de herramientas del emulador de navegador móvil. De forma predeterminada, utiliza una plantilla receptiva^(Responsive) para el sitio que cargó. Haga clic^(Click) en él y elija el dispositivo móvil que desea emular. Sus opciones incluyen los mismos teléfonos inteligentes y tabletas que Google Chrome .

Accede al emulador de navegador móvil en Microsoft Edge

Explore el sitio que desea probar, cambie entre los diferentes dispositivos móviles y vea cómo se ve. Cuando haya terminado, presione el botón X (Cerrar)^{(X (Close))} en la esquina superior derecha de Microsoft Edge.

Cierre el emulador de navegador móvil en Microsoft Edge

Ahora está de vuelta en el modo de navegación de escritorio estándar.

Cómo encender y usar el emulador de navegador móvil en Opera

En Opera , visita la página web que deseas ver como si estuvieras usando un dispositivo móvil. Luego haga clic en el icono de Opera en la parte superior izquierda ( "Personalizar y controlar Opera"^{(“Customize and control Opera”)} ). En el menú que se abre, elija Desarrollador^(Developer) seguido de Herramientas^{(Developer tools)} de desarrollador . Si prefiere el teclado, presione las CTRL+Shift+I para obtener el mismo resultado.

Accede a las herramientas de desarrollador en Opera

Las herramientas del desarrollador^{( Developer tools)} se muestran en el lado derecho de la ventana del navegador. Haga clic en el botón "Alternar barra de herramientas del dispositivo"^{(“Toggle device toolbar”)} (parece un teléfono inteligente al lado de una tableta) o presione CTRL + Shift + M en su teclado. La barra de herramientas del dispositivo se muestra a la izquierda. De forma predeterminada, utiliza una plantilla receptiva^(Responsive) para el sitio que cargó. Haz clic^(Click) en él y elige el dispositivo móvil que quieres emular de la lista de opciones. Opera ofrece los mismos emuladores de navegadores móviles que Google Chrome y Microsoft Edge , ya que se basa en el mismo motor de renderizado ( Chromium ).

Accede al emulador de navegador móvil en Opera

Cuando termine de probar, presione el botón X ( Cerrar^(Close) ) en la esquina superior derecha para volver al modo de navegación de escritorio estándar.

Cierre el emulador de navegador móvil en Opera

¿^(Are) Está satisfecho con las opciones de emulación de navegador móvil disponibles?

Ahora ya sabes cómo emular todo tipo de dispositivos móviles en tu navegador web favorito. Sin embargo, puede notar que la mayoría de los navegadores web ofrecen las mismas opciones de emulación que favorecen a los iPhone y iPad. Si desea emular un teléfono inteligente o tableta Android moderno, sus posibilidades son bastante escasas, incluso en ^(Android)Google Chrome , el navegador desarrollado por la compañía detrás de Android . Si desea obtener los mejores resultados, es posible que deba usar dos navegadores para esta tarea: Chrome y Firefox , Firefox y Edge u Opera . Antes de ir, cuéntenos lo que piensa acerca de las opciones disponibles.

How to use the mobile browser emulator in Chrome, Firefox, Edge, and Opera -

Do you need to acceѕs a smartphonе browser emulator on your PC to test the mobile version of a website yoυ аre intereѕted in? Maybe you arе a web devеloper, or you want to become one, and you need to simulate a mobile browser for the project you are working on. Regardless of your reasons, herе is how to accеss a mobile browser emulator in Goоgle Chrome, Mozilla Fіrеfox, Microsoft Edge, and Opera:

How to turn on and use the mobile browser emulator in Google Chrome

In Google Chrome, navigate to the website that you want to view in the mobile browser emulator. Then, either press the CTRL + SHIFT + I keys on your keyboard or, with the mouse, click the three vertical dots in the top-right corner to open the “Customize and control Google Chrome” menu. Choose More tools, followed by Developer Tools.

Access Developer Tools in Google Chrome

Click or tap on the “Toggle device toolbar” button (it looks like a smartphone next to a tablet) or press CTRL + Shift + M on your keyboard. This activates the device toolbar where the mobile page is loaded. By default, the device toolbar uses a Responsive template for the site you loaded. Click on it and choose the mobile device that you want to emulate. Your options include many iPhones, iPads, Surface Duo, two Samsung Galaxy devices, and a Moto G4 mobile browser simulator for PC.

How to enable the mobile browser emulator in Google Chrome

TIP: Unfortunately, you can use the CTRL + Shift + M keyboard shortcut only after enabling the developer tools.

Navigate the site you want to test, switch between the different smartphones and tablets, and see how it looks. When you are done, press the X (Close) button in the top-right corner of Google Chrome’s developer tools to get back to the standard desktop browsing mode.

Closing the mobile browser emulator Google Chrome

TIP: If you are a heavy Google Chrome user, you may also want to learn how to use Google Chrome’s media control options.

How to turn on and use the mobile browser emulator in Mozilla Firefox

In Mozilla Firefox, open the site for which you want to use a mobile browser simulator. Then, either press CTRL + Shift + M on your keyboard or click the burger button on the top-right corner to open Firefox’s menu, and choose Web Developer.

Access the Web Developer tools in Firefox

You see a menu filled with tools that are useful to web developers. In the list, select “Responsive Design Mode,” and this particular mode of viewing a web page is loaded in Firefox.

Choose the Responsive Design Mode in Firefox

Firefox enables the Responsive Design Mode. At the top of the window, you see the parameters used by this emulation mode. If no device is selected, click or tap on Responsive to open a drop-down list with devices available for emulation, and then choose the one that you want to simulate.

You can simulate the mobile browser for many iPhones, the iPad, the Kindle Fire (Firefox is the only browser to offer this emulation option), and Samsung Galaxy S9 devices.

Use the mobile browser emulator in Firefox

When you’re done testing with the smartphone browser emulator, press the X (Close Responsive Design Mode) button on the top-right corner of Mozilla Firefox.

Close the mobile browser emulator in Firefox

You are back to the standard desktop browsing mode.

How to turn on and use the mobile browser emulator in Microsoft Edge

Microsoft Edge uses the same rendering engine as Google Chrome and offers the same smartphone browser emulators. To access them, visit the website that you want to test, and either press the CTRL + SHIFT + I keys on your keyboard or click the three horizontal dots (“Settings and more”) in the top-right corner of Microsoft Edge. In the menu that appears, go to More tools and then to Developer Tools.

Access the Developer tools in Microsoft Edge

Click the “Toggle device emulation” button (it looks like a smartphone next to a tablet) or press CTRL + Shift + M on your keyboard. This activates the mobile browser emulator toolbar. By default, it uses a Responsive template for the site you loaded. Click on it and choose the mobile device that you want to emulate. Your options include the same smartphones and tablets as Google Chrome.

Access the mobile browser emulator in Microsoft Edge

Browse the site you want to test, change between the different mobile devices, and see how it looks. When you are done, press the X (Close) button in Microsoft Edge’s top-right corner.

Close the mobile browser emulator in Microsoft Edge

You are now back to the standard desktop browsing mode.

How to turn on and use the mobile browser emulator in Opera

In Opera, visit the web page that you want to view as if you were using a mobile device. Then click the Opera icon on the top-left (“Customize and control Opera”). In the menu that opens, choose Developer followed by Developer tools. If you prefer the keyboard, press the CTRL+Shift+I keys for the same result.

Access the Developer tools in Opera

The Developer tools are displayed on the right side of the browser window. Click the “Toggle device toolbar” button (it looks like a smartphone next to a tablet) or press CTRL + Shift + M on your keyboard. The device toolbar is shown on the left. By default, it uses a Responsive template for the site you loaded. Click on it and choose the mobile device that you want to emulate from the list of options. Opera offers the same mobile browser emulators as Google Chrome and Microsoft Edge, as it is based on the same rendering engine (Chromium).

Access the mobile browser emulator in Opera

When you are done testing, press the X (Close) button in the top-right corner to get back to the standard desktop browsing mode.

Close the mobile browser emulator in Opera

Are you happy with the mobile browser emulation options available?

Now you know how to emulate all kinds of mobile devices in your favorite web browser. However, you might notice that most web browsers offer the same emulation options that favor iPhones and iPads. If you want to emulate a modern Android smartphone or tablet, your chances are pretty slim, even in Google Chrome - the browser developed by the company behind Android. If you want the best results, you might need to use two browsers for this task: Chrome and Firefox, or Firefox and Edge or Opera. Before you go, tell us what you think about the available options.

Related posts

• Cómo silenciar una pestaña en Chrome, Firefox, Microsoft Edge, y Opera

• Cómo imprimir un artículo sin anuncios en todos los navegadores principales

• Cómo PIN de un sitio web a la barra de tareas o al Start Menu en Windows 10

• Cómo hacer Chrome el default browser en Windows 10 (Firefox & Opera)

• Cómo cambiar el default browser en Windows 11

• Cómo cambiar el motor Firefox search predeterminado

• Cómo desinstalar Microsoft Edge de Windows

• Cómo actualizar páginas en su navegador, en una Mac (Safari, Chrome, Firefox y Opera)

• Cómo reservar pestañas en Microsoft Edge y usarlas más tarde

• Cómo encender y apagar Dark Mode en Microsoft Edge

• ¿Qué versión de Microsoft Edge tengo?

• Cómo ampliar y alejar en su web browser

• ¿Qué versión de Chrome tengo?6 maneras de averiguarlo

• Cómo iniciar Microsoft Edge en Windows 10 (12 maneras)

• Acerca de InPrivate and Incognito. ¿Qué es la navegación privada? Which browser es el mejor?

• Chrome de 64 bits o Chrome de 32 bits: descargue la versión que desee, para Windows 10 o anterior

• Cómo desbloquear Adobe Flash Player en Google Chrome

• Cómo obtener, configurar y eliminar extensiones Microsoft Edge

• 12 maneras de administrar pestañas en Microsoft Edge

• Cómo configurar un servidor proxy en Chrome, Firefox, Edge y Opera