Cómo inspeccionar elementos en un Chromebook y la tecla de teclado que confunde a todos

Un Chromebook ejecuta Chrome, por lo que tiene las mismas herramientas de desarrollador que Chrome en cualquier otro ordenador - la consola completa, la pestaña Red, el inspector de elementos, todo. Lo único que hace que sea una pregunta que merece su propia respuesta es el teclado, que no tiene la tecla que la mayoría de las instrucciones te dicen que presiones.

Alguien dice “presiona F12” o “abre la consola”, y en un Chromebook no hay F12 que encontrar. Aquí está cómo abrir las herramientas de desarrollador de todas formas, y qué hacer una vez que estén abiertas.

Abrir las herramientas de desarrollador

Tres formas de entrar, y la segunda es la que debes recordar porque no depende de ninguna tecla que el Chromebook no tenga.

• Haz clic derecho en la cosa que quieres revisar y elige Inspect. Si tu Chromebook no tiene botón derecho del ratón, toca el panel táctil con dos dedos. Esto abre las herramientas de desarrollador con ese elemento ya seleccionado, que es generalmente exactamente lo que querías.
• Presiona Ctrl + Shift + I para abrir las herramientas, o Ctrl + Shift + J para abrirlas directamente en la Consola. Estos atajos funcionan en todos los Chromebooks y son la respuesta confiable.
• Presiona la tecla en la fila superior donde estaría F12, si la necesitas. Esa fila es lo complicado, y tiene su propia sección a continuación.

El problema de F12, y cómo funciona realmente la fila superior

La fila superior de un Chromebook no son teclas de función. Son atrás, actualizar, pantalla completa, brillo y lo demás, y no hay F12 impreso en ningún lugar. Esta es la única cosa en la que la gente se queda atrapada, y tiene una solución.

Mantén presionada la tecla Launcher - la que tiene un círculo o una lupa, donde Bloq Mayús está en otros teclados - y la fila superior se convierte en F1 a F12 mientras la mantengas presionada. Entonces Launcher + la duodécima tecla en la fila superior es F12, y abre las herramientas de desarrollador.

Pero raramente la necesitas, porque Ctrl + Shift + I hace el mismo trabajo sin contar teclas. Si una instrucción dice F12 y estás en un Chromebook, léelo como “abre las herramientas de desarrollador” y usa el atajo en su lugar.

El atajo de teclado para inspeccionar, en cualquier teclado

Si ha llegado aquí por el atajo y no por la explicación: en un Chromebook es Ctrl + Shift + I, y esa es toda la respuesta. Vale la pena conocer los demás porque la instrucción que le dieron casi con seguridad se escribió para otra máquina, y seguirla al pie de la letra es lo que acaba con la gente buscando una tecla que su teclado no tiene.

• Chromebook, Windows y Linux: Ctrl + Shift + I abre las herramientas de desarrollador, y Ctrl + Shift + J las abre con la consola ya delante.
• Mac: Cmd + Option + I, y Cmd + Option + J para la consola. Safari es distinto otra vez y hay que activarlo antes de que nada de esto funcione, que es lo que cubre la guía para Mac.
• Solo Windows y Linux: F12 hace lo mismo que Ctrl + Shift + I. En un Chromebook no hay ningún F12 impreso, que es de lo que trata la sección anterior.

Hay dos cosas que confunden más que las propias teclas. El atajo abre las herramientas sin seleccionar nada, así que cuando quiera un elemento concreto, haga clic derecho sobre él y elija Inspeccionar: llegará con ese elemento ya resaltado. Y el atajo actúa sobre la página que está mirando, no sobre el navegador, de modo que no sirve de nada en una pestaña nueva, en una pantalla de configuración o en la Web Store.

Si está en Windows y no en un Chromebook, la guía para Windows continúa con qué panel responde a qué pregunta una vez que ha entrado.

Leyendo la Consola, que generalmente es el punto

La mayoría de las veces “inspeccionar elemento en un Chromebook” realmente significa “alguien me preguntó qué dice la consola”. La pestaña Console es donde la página reporta sus errores, y una línea roja allí a menudo es toda la explicación para una página que no funciona.

Abre las herramientas, haz clic en Console, y recarga la página para que se ejecute desde el principio con la consola observando. Rojo es un error, naranja es una advertencia. La primera línea roja es generalmente la que importa; el resto a menudo son consecuencias de ello. Si te pidieron que envíes lo que dice, la forma honesta es capturar todo en lugar de reescribir una línea, porque la línea debajo de la roja a menudo es donde está el detalle real.

La pestaña Red, para cuando nada se carga

Si el problema es que algo no se cargó en lugar de que la página lanzara un error, la pestaña Network es el lugar. Ábrela, recarga, y observa cómo la lista se llena con cada solicitud que hizo la página. Una fila roja es una solicitud que falló, y su código de estado dice cómo. La pestaña Red tiene su propia guía si el panel es nuevo para ti.

Inspeccionar un teléfono Android desde tu Chromebook

Vale la pena saber, porque un Chromebook es a menudo el ordenador que realmente tiene un probador: puede abrir las herramientas de desarrollador para una página que se ejecuta en un teléfono Android, sobre un cable USB, exactamente de la forma en que una máquina Windows o Mac puede. Escribe chrome://inspect en la barra de direcciones, conecta el teléfono, y las páginas abiertas en él aparecen en la lista con un enlace inspect al lado de cada una. Los pasos completos están en cómo inspeccionar elemento en Android; nada de ellos cambia porque el ordenador sea un Chromebook.

Si eres tú quien le está pidiendo a alguien que haga esto

Si estás guiando a una persona en un Chromebook a través de esto - un probador, un cliente, un colega - no le digas que presione F12. Buscará, no lo encontrará, y decidirá que las instrucciones están equivocadas. Di “haz clic derecho en la página y elige Inspect”, que no necesita ninguna tecla en absoluto, o “Ctrl + Shift + J abre la consola”. Ambos funcionan al primer intento, que es la diferencia entre obtener una respuesta y obtener una captura de pantalla de la pantalla equivocada.

Porque funciona en Chrome, funciona en un Chromebook, y captura la consola y el registro de red para quien obtenga el informe - por lo que la persona en el Chromebook no tiene que encontrar una tecla que no existe antes de poder decirte qué salió mal.

Referencia rápida

• Abre las herramientas de desarrollador: haz clic derecho e Inspect, o Ctrl + Shift + I.
• Abre directamente a la Consola: Ctrl + Shift + J.
• Si realmente necesitas F12: mantén presionada la tecla Launcher y presiona la duodécima tecla en la fila superior.
• Inspecciona un teléfono Android: chrome://inspect con el teléfono conectado por cable.