¿Cómo abrir la consola de desarrollador de tu navegador?

La consola de desarrollador de tu navegador te puede ayudar a encontrar errores en el JavaScript de alguna de tus páginas web o a inspeccionar los elementos del HTML. Te mostramos cómo acceder al inspector de elementos de la consola de desarrollador en Google Chrome, Firefox, Safari e Internet Explorer. De este modo podrás ver el HTML concreto de un elemento y así buscar su ID o el selector CSS para usar en Nelio A/B Testing.

Google Chrome

Para usar el inspector de elementos en Google Chrome, tienes varias opciones diferentes:

  • Haz clic con el botón derecho en cualquier elemento de la página web y luego selecciona Inspeccionar en el menú.
  • Accede al menú de configuración de Google Chrome (los tres puntos verticales en la esquina superior derecha del panel de control de la ventana del navegador). En el menú desplegable, seleccione Más herramientas, luego Herramientas para desarrolladores.

Firefox

De manera similar a Google Chrome, Firefox también ofrece múltiples opciones de acceso al inspector de elementos:

  • Haz clic con el botón derecho en cualquier elemento de la página web y luego selecciona Inspeccionar elemento en el menú.
  • Accede al menú de configuración de Firefox. Elige Herramientas, luego selecciona Desarrollo web y finalmente Inspector.

Safari

Safari hace lo mismo, pero antes de que puedas usar el inspector de elementos, deberás acceder al menú de configuración de Safari. En la esquina superior izquierda de la pantalla, selecciona Preferencias y luego marca la casilla que dice Mostrar menú de desarrollo en la barra de menú. Una vez hayas hecho eso, usa las siguientes opciones:

  • Haz clic con el botón derecho en cualquier elemento de la página web y luego selecciona Inspeccionar en el menú.
  • Accede a la barra de menú y haz clic en Desarrollar, luego selecciona Mostrar inspector web en el menú desplegable.

Internet Explorer

Internet Explorer también ofrece herramientas para desarrolladores que permiten la funcionalidad de inspeccionar un elemento:

  • Haz clic con el botón derecho en la página y elige Inspeccionar elemento en el menú emergente.
  • Accede al panel de control haciendo clic en el icono de ajustes en la esquina superior derecha de la ventana del navegador, o presionando Alt + X. Selecciona F12 Herramientas de desarrollador en el menú desplegable.

Atajos de teclado

También puedes saltarte lo anterior y, en su lugar, acceder a inspeccionar el elemento directamente utilizando atajos de teclado. En cualquier página web, utiliza los siguientes comandos de teclado:

  • Mac: ⌘ + Shift + C
  • Windows/Linux: F12 or Ctrl + Shift + C