Cómo depurar páginas web en Chrome para Android en la computadora

Como administrador de un blog, depuro mi sitio web personal usando Chrome para ver cómo se verían los cambios en el tema y CSS antes de implementarlos de forma permanente en el servidor. No fue hace mucho cuando nunca pagué

atención a las páginas móviles

ya que solo unos pocos visitantes visitaron mi sitio usando un teléfono inteligente. Pero hoy en día, un porcentaje significativo de visitantes se compone de teléfonos inteligentes y tabletas y, por lo tanto, también se ha vuelto necesario cuidar la apariencia y la presentación.

Si fuera una página en la computadora, se podría haber depurado fácilmente usando la opción del menú contextual del botón derecho del ratón de Chrome, pero esa no es la opción con las páginas en el móvil. Entonces, hoy le mostraré cómo puede depurar páginas web móviles en su computadora usando Chrome para Android y Android SDK.

Depuración de la página web

Paso 1: Descargue e instale Android SDK en su computadora y ejecútelo. El instalador le pedirá que descargue Java si no lo tiene instalado.

La primera vez que ejecute Android SDK en su computadora, le pedirá que descargue varias API y herramientas. Si su único propósito de instalar el SDK de Android es depurar las páginas, desmarque todo excepto Herramientas de la plataforma Android SDK y haga clic en el Paquete de instalación botón.

Paso 2: Después de instalar las herramientas de la plataforma Android, abra Run Box (Windows+R) y ejecute %perfil de usuario%\AppData\Local\Android\android-sdk\plataforma-herramientas para abrir el directorio de herramientas de la plataforma Android.

Paso 3: Ahora mantenga presionada la tecla Ctrl + Shift y haga clic derecho en la carpeta para abrir el símbolo del sistema allí. También puede abrir el símbolo del sistema usando el cuadro Ejecutar y navegar a la carpeta manualmente.

Etapa 4: Habiendo hecho eso, abra Chrome en su teléfono Android, abra Configuración—>Herramientas de desarrollador y marque la opción Habilitar depuración web USB.

Paso 5: Ahora, en el símbolo del sistema, ejecute el comando adb reenviar tcp: 9222 resumen local: chrome_devtools_remote y abra el navegador Chrome en Windows en ejecución exitosa.

Paso 6: Abra la página que desea depurar en su navegador Android Chrome y abra la URL servidor local: 9222 en el navegador Chrome de su computadora.

Eso es todo, verá todas las páginas que están abiertas en su navegador de Android como miniaturas en su computadora. Para abrir la página de depuración, simplemente haga clic en la miniatura del sitio web respectivo. Podrá realizar un seguimiento de los cambios de depuración que realice en su computadora directamente en Android en tiempo real.

Conclusión

Estoy seguro de que este truco ayudará a muchos desarrolladores web a optimizar sus páginas web para teléfonos inteligentes. He usado el truco para configurar mis páginas web y funcionó a la perfección. Sin embargo, si conoce una mejor manera de depurar páginas web de teléfonos inteligentes en la computadora, compártala con nosotros.