Cómo examinar un elemento en una Chromebook

Si te apetece experimentar con el código de un sitio web o quieres solucionar un problema de diseño molesto, usar la herramienta Inspeccionar Elemento en Chrome es prácticamente indispensable. Te muestra el HTML, CSS y JavaScript sin procesar que componen una página web, lo cual puede ser una verdadera revelación. Además, puedes ajustar las cosas temporalmente para ver cómo se verán sin romper nada, como jugar al doctor con el código. En Chromebooks, es sencillo, pero a veces el método que uses depende de cómo prefieras acceder o de los atajos que prefieras.

Cómo inspeccionar un elemento en una Chromebook

Dado que las Chromebooks son simplemente laptops con ChromeOS, las Herramientas para Desarrolladores del navegador Chrome están integradas. Puedes usar el clic derecho o preferir menús o atajos de teclado, lo que te resulte más rápido o cómodo. Ten en cuenta que las opciones del menú de Chrome a veces se ocultan tras diferentes rutas según las actualizaciones, pero el proceso general sigue siendo el mismo.

Cómo usar el menú de clic derecho para inspeccionar

Esta es probablemente la forma más sencilla, ya que solo necesitas un ratón o un panel táctil. Nada sofisticado, pero efectivo. Si no te gusta explorar menús o configuraciones:

• Abra su navegador Chrome y vaya a la página web que desea ver.
• Haga clic derecho en cualquier parte de la página (sí, el clic derecho normal que usaría para cualquier otra cosa).
• En ese menú contextual, seleccione Inspeccionar.¡Listo! Se abrirán las Herramientas para desarrolladores y podrá ver el HTML y el CSS.

Es un poco extraño que a veces el menú contextual tenga un orden u opciones diferentes según el sitio web o la versión de Chrome, pero Inspeccionar suele estar ahí. En algunas configuraciones, puede llamarse __Inspeccionar Elemento__ o simplemente __Inspeccionar__.

Uso del menú de Chrome (opción Herramientas para desarrolladores)

Si te gusta más el menú o buscas una forma de hacerlo sin hacer clic derecho, el menú de Chrome es la solución. Este método es útil si prefieres explorar los menús para acceder a más funciones para desarrolladores:

• Haga clic en el icono de tres puntos en la esquina superior derecha de Chrome.
• Coloque el cursor sobre Más herramientas en el menú desplegable.
• Seleccione Herramientas para desarrolladores en el submenú.

Esto abrirá un panel en el lateral o en la parte inferior de la ventana que muestra el código fuente de la página web. A veces, este método es un poco más lento, pero es más limpio si no quieres que clics con el botón derecho accidentalmente activen otras opciones.

Uso de atajos de teclado para acceso rápido

Bueno, esta es la ruta más rápida, si recuerdas el atajo. En una Chromebook, es solo una Ctrl + Shift + Icombinación, y ¡zas!, las Herramientas de Desarrollo aparecen al instante. No hay necesidad de complicarse con menús ni clics con el botón derecho.

Este atajo suele funcionar de inmediato y, después de un tiempo, suele ser el que uso por defecto porque me parece más rápido que navegar por los menús. Sin embargo, ten en cuenta que en algunas configuraciones más recientes o si has reasignado teclas, los atajos pueden variar un poco, pero, en general, este es el estándar.

Resumen

Lo más probable es que, en una Chromebook, inspeccionar elementos resulte bastante natural una vez que te acostumbras a estos métodos. Ya sea que estés realizando una depuración rápida, intentando entender cómo se crea un sitio web o simplemente experimentando con los estilos de página, las Herramientas para desarrolladores de Chrome son tus aliadas. El método del clic derecho es económico y práctico, el del menú es un poco más formal y el atajo es el demonio de la velocidad.

---

---