Cómo ver el código fuente HTML de una página web

Todos los navegadores de Internet permiten a los usuarios ver el código fuente HTML de cualquiera de las páginas web que visitan. Las siguientes secciones contienen información sobre las múltiples formas de ver el código fuente en cada uno de los principales navegadores. Para continuar, elija una entrada de la lista a continuación y siga las instrucciones para esa sección.

Al ver el código fuente de una página web, es importante que tenga en cuenta que la información y el código no procesado por el servidor no aparecerán. Por ejemplo, casi todos los motores de búsqueda de Internet procesan información en un servidor y luego muestran los resultados en una página web. En otras palabras, puede ver el código que conforma la página de resultados, pero no puede ver el código fuente del motor de búsqueda.

Esta regla se aplica a todos los scripts del lado del servidor, SSI y código de programación. Por lo tanto, las funciones, como los motores de búsqueda, los foros, las encuestas, el chat, etc., no mostrarán su código. Copiar la información del código fuente puede causar errores o dirigirlo a la página desde la que copió la información.

Usuarios de Microsoft Edge

Para ver el código fuente de una página web en Microsoft Edge, siga los pasos a continuación.

  1. Presione Ctrl + U o F12 en el teclado de su computadora.
  2. Seleccione la pestaña Elementos en la parte superior de la ventana derecha.

O

O

  1. Abra Microsoft Edge y navegue a la página web de su elección.
  2. Haga clic en el Más

    Icono en la esquina superior derecha de la pantalla.
  3. Seleccione Herramientas de desarrollador en el menú desplegable que aparece.
  4. Seleccione la pestaña Elementos en la parte superior de la ventana derecha.

Consejo: en Microsoft Edge, la herramienta DOM también proporciona interacción con el código fuente y la configuración de CSS, permitiendo a los usuarios ver cómo los cambios en el código afectan a la página web de inmediato.

Usuarios de Microsoft Internet Explorer

Para ver el código fuente de una página web en Microsoft Internet Explorer, siga los pasos a continuación.

  1. Presione Ctrl + U o F12 en el teclado de su computadora.
  2. Haga clic en la pestaña Depurador en la parte superior del nuevo menú.

O

O

  1. Abra Internet Explorer y navegue a la página web de su elección.
  2. Presiona la tecla Alt para que aparezca la barra de menú del navegador.
  3. Seleccione Ver y luego Fuente en el menú desplegable que aparece.
  4. Haga clic en la pestaña Depurador en la parte superior del nuevo menú.

Consejo: con las últimas versiones de Internet Explorer, al presionar la tecla F12 aparece la herramienta DOM. Esta herramienta proporciona mucha más interacción con el código fuente y la configuración de CSS, permitiendo a los usuarios ver cómo los cambios en el código afectan a la página web de inmediato.

Mozilla Firefox y usuarios de Netscape

Para ver el código fuente de una página web en Mozilla Firefox, siga los pasos a continuación.

  1. Presiona Ctrl + U en el teclado de tu computadora.

O

O

  1. Abra Mozilla Firefox y navegue a la página web de su elección.
  2. Presiona la tecla Alt para que aparezca la barra de menú del navegador.
  3. Seleccione Herramientas, Desarrollador web y luego Fuente de página .

Consejo: con las últimas versiones de Firefox, al presionar la tecla F12 o Ctrl + Shift + I aparece la herramienta de desarrollo interactiva. Esta herramienta proporciona mucha más interacción con el código fuente y la configuración de CSS, permitiendo a los usuarios ver cómo los cambios en el código afectan a la página web de inmediato.

Ver una sección del código fuente de la página.

  1. Resalte la parte de una página web para la que desea ver el código fuente.
  2. Haga clic con el botón derecho en esa sección resaltada y luego haga clic en Ver fuente de selección .

Sugerencia: use el complemento Firebug no solo para ver el código fuente de una página, sino para cambiar y ver esos cambios en vivo a través del navegador.

Usuarios de Google Chrome

Para ver el código fuente de una página web en Google Chrome, siga los pasos a continuación.

  1. Presiona Ctrl + U en el teclado de tu computadora.

O

O

  1. Abre Chrome y navega por la página web de tu elección.
  2. Haga clic en Personalizar y controlar Google Chrome

    icono en la parte superior derecha de la ventana del navegador.
  3. En el menú desplegable que aparece, seleccione Más herramientas y luego Herramientas del desarrollador .
  4. Haga clic en la pestaña Elementos en la parte superior de la nueva sección que aparece.

Consejo: con las últimas versiones de Chrome, al presionar la tecla F12 o Ctrl + Shift + I también aparece la herramienta de desarrollo interactiva. Esta herramienta proporciona mucha más interacción con el código fuente y la configuración de CSS, permitiendo a los usuarios ver cómo los cambios en el código afectan a la página web de inmediato.

Usuarios de Apple Safari

Para ver el código fuente de una página web en Apple Safari, siga los pasos a continuación.

  1. Presiona Comando + Opción + U en tu teclado.

O

O

  1. Abra el navegador Safari y navegue a la página web de su elección.
  2. Seleccione el menú Desarrollar .
  3. Elija la opción Mostrar fuente de la página .

Usuarios de opera

Para ver el código fuente de una página web en Opera, siga los pasos a continuación.

  1. Presiona Ctrl + U en tu teclado.

O

O

  1. Abra Opera y navegue a la página web de su elección.
  2. Haga clic en el botón Menú

    en la esquina superior izquierda de la ventana del navegador.
  3. En el submenú del desarrollador, elija la fuente de la página .

Sugerencia: si no ve el submenú Desarrollador, seleccione Más herramientasMostrar menú desarrollador . Luego, haga clic en el botón de menú

otra vez. Ahora debería ver el submenú del desarrollador en la lista.

Consejo: con las últimas versiones de Opera, al presionar la combinación de teclas Ctrl + Shift + I aparece la herramienta de desarrollo interactiva. Esta herramienta proporciona mucha más interacción con el código fuente y la configuración de CSS, permitiendo a los usuarios ver cómo los cambios en el código afectan a la página web de inmediato.

Teléfono android ejecutando chrome

  1. Abra el navegador de Internet Google Chrome en su teléfono.
  2. Abra la página web cuyo código fuente desea ver.
  3. Toque una vez en la barra de direcciones y luego mueva el cursor al frente de la URL.
  4. Escriba view-source: y presione Entrar o Ir .

Consejo: por ejemplo, para ver el código de nuestra página de inicio, debe escribir view-source: //www.computerhope.com

Cómo cerrar la página de código fuente o herramienta

Una vez que haya terminado de ver el código fuente en una página web, es posible que desee salir o cerrarlo. Cerrar el código fuente depende del método que haya utilizado para abrirlo.

  • Si ha usado el método Ctrl + U (excepto Edge) o el método de clic derecho, cierre la nueva pestaña que se abrió en la parte superior de la ventana del navegador.
  • Si ha usado el método de desarrollador (presionando F12 o Ctrl + Shift + I), haga clic en

    en la esquina superior derecha de la ventana de herramientas .