La página web que está leyendo se compone, entre otras cosas, de código fuente. Esa es la información que tu navegador web descarga y traduce en lo que estás leyendo en este momento.
La mayoría de los navegadores web ofrecen la posibilidad de ver el código fuente de una página web sin necesidad de software adicional, independientemente del tipo de dispositivo en el que se encuentre.
Algunos incluso ofrecen funcionalidad y estructura avanzadas, lo que facilita la lectura de HTML y otros códigos de programación en la página.
¿Por qué querría ver el código fuente?
Hay varias razones por las que puede querer ver el código fuente de una página. Si eres un desarrollador web, tal vez te gustaría echar un vistazo debajo de las coberturas al estilo o implementación particular de otro programador. Quizás esté en control de calidad y esté tratando de determinar por qué cierta parte de una página web se está mostrando o se está comportando como está.
También puede ser un principiante que intenta aprender a codificar sus propias páginas y está buscando algunos ejemplos del mundo real. Por supuesto, es posible que no caigas en ninguna de estas categorías y solo quieras ver la fuente por pura curiosidad.
A continuación se enumeran las instrucciones sobre cómo ver el código fuente en el navegador que elija.
Google Chrome
Ejecutándose en: Chrome OS, Linux, macOS, Windows
La versión de escritorio de Chrome ofrece tres métodos diferentes para ver el código fuente de una página, el primero y el más simple utilizando el siguiente método abreviado de teclado: CTRL + U (MANDO + OPCION + U en macOS).
Cuando se presiona, este acceso directo abre una nueva pestaña del navegador que muestra HTML y otro código para la página activa. Esta fuente está codificada por colores y estructurada de una manera que facilita la compartimentación y la búsqueda de lo que está buscando. También puedes llegar ingresando el siguiente texto en la barra de direcciones de Chrome, que se adjunta al lado izquierdo de la URL de la página web, y seleccionando Entrar llave: ver fuente: (es decir, fuente de vista: https: //www.Go-Travels.com).
El tercer método es a través de las herramientas de desarrollo de Chrome, que le permiten profundizar más en el código de la página, así como modificarlo sobre la marcha para propósitos de prueba y desarrollo. La interfaz de las herramientas del desarrollador se puede abrir y cerrar utilizando este método abreviado de teclado: CTRL + MAYÚS + I (COMANDO + OPCION + I en macOS). También puedes lanzarlos siguiendo el siguiente camino.
-
Seleccione el botón del menú principal de Chrome, ubicado en la esquina superior derecha y representado por tres puntos alineados verticalmente.
-
Cuando aparezca el menú desplegable, coloque el cursor del mouse sobre la Más herramientas opción.
-
Cuando aparezca el submenú, seleccione Herramientas de desarrollo.
Androide
Ver el código fuente de una página web en Chrome para Android es tan simple como agregar el siguiente texto al frente de su dirección (o URL) y enviarlo: ver fuente:. Un ejemplo de esto sería fuente-vista: https: //www.Go-Travels.com . HTML y otro código de la página en cuestión se mostrarán instantáneamente en la ventana activa.
iOS
Si bien no hay métodos nativos para ver el código fuente usando Chrome en su iPad, iPhone o iPod touch, el más simple y efectivo es utilizar una solución de terceros, como la aplicación View Source.
Disponible en la App Store por $ 0.99, View Source le pide que ingrese la URL de la página (o que la copie / pegue desde la barra de direcciones de Chrome, que a veces es la ruta más simple) y eso es todo. Además de mostrar HTML y otro código fuente, la aplicación también tiene pestañas que muestran recursos de páginas individuales, el Modelo de objetos de documento (DOM), así como el tamaño de la página, las cookies y otros detalles interesantes.
Microsoft Edge
Ejecutándose en: Windows
El navegador Edge le permite ver, analizar e incluso manipular el código fuente de la página actual a través de su interfaz de herramientas de desarrollo. Para acceder a este útil conjunto de herramientas, puede utilizar uno de estos métodos abreviados de teclado: F12 o CTRL + U. Si prefiere el mouse, haga clic en el botón del menú de Edge (tres puntos ubicados en la esquina superior derecha) y elija F12 Herramientas de desarrollo Opción de la lista.
Después de ejecutar las herramientas dev por primera vez, Edge agrega dos opciones adicionales al menú contextual del navegador (accesible haciendo clic con el botón derecho en cualquier lugar dentro de una página web): Inspeccionar elemento y Ver fuente, este último que abre el Depurador parte de la interfaz de herramientas dev rellenada con código fuente.
Mozilla Firefox
Ejecutándose en: Linux, macOS, Windows
Para ver el código fuente de una página en la versión de escritorio de Firefox, puede presionar CTRL + U (Comando + u en macOS) en su teclado, que abrirá una nueva pestaña que contiene HTML y otro código para la página web activa.
Escribir el siguiente texto en la barra de direcciones de Firefox, directamente a la izquierda de la URL de la página, hará que aparezca la misma fuente en la pestaña actual en su lugar: ver fuente: ( es decir, fuente de vista: https: //www.dotdash.com ).
Otra forma de acceder al código fuente de una página es a través de las herramientas para desarrolladores de Firefox, a las que se puede acceder mediante los siguientes pasos.
-
Seleccione el botón del menú principal, ubicado en la esquina superior derecha de la ventana de su navegador y representado por tres líneas horizontales.
-
Cuando aparezca el menú emergente, haga clic en Desarrollador Icono de "llave".
-
El menú contextual del desarrollador web ahora debería estar visible. Selecciona el Fuente de la página opción.
Firefox también te permite ver el código fuente de una parte particular de una página, lo que facilita el aislamiento de los problemas. Para hacerlo, primero resalte el área que le interesa con su mouse. A continuación, haga clic derecho y elija Ver fuente de selección desde el menú contextual del navegador.
Androide
Ver el código fuente en la versión de Android de Firefox se puede lograr prefijando la URL de la página web con el siguiente texto: ver fuente:. Por ejemplo, para ver la fuente HTML de Dotdash, debe enviar el siguiente texto en la barra de direcciones del navegador: fuente-vista: https: //www.dotdash.com .
iOS
Nuestro método recomendado para ver el código fuente de la página web en su iPad, iPhone o iPod touch es a través de la aplicación View Source, disponible en la App Store por $ 0.99. Si bien no está integrado directamente con Firefox, puede copiar y pegar fácilmente una URL desde el navegador a la aplicación para revelar el código HTML y otros códigos asociados con la página en cuestión.
Apple Safari
Funcionando en iOS y macOS
iOS
Aunque Safari para iOS no incluye la capacidad de ver la fuente de la página de manera predeterminada, el navegador se integra perfectamente con la aplicación View Source, disponible en la App Store por $ 0.99.
Después de instalar esta aplicación de terceros, vuelva al navegador Safari y toque el botón Compartir, ubicado en la parte inferior de la pantalla y representado por un cuadrado y una flecha hacia arriba. La Hoja para compartir de iOS ahora debería estar visible, superponiendo la mitad inferior de la ventana de Safari. Desplázate hacia la derecha y selecciona Ver fuente botón.
Ahora se debe mostrar una representación estructurada, codificada por colores, del código fuente de la página activa, junto con otras pestañas que le permiten ver recursos de página, scripts y más.
Mac OS
Para ver el código fuente de una página en la versión de escritorio de Safari, primero debe habilitar su Desarrollar menú. Los siguientes pasos lo guían a través de la activación de este menú oculto y la visualización de la fuente HTML de una página.
-
Seleccionar Safari En el menú del navegador, ubicado en la parte superior de la pantalla.
-
Cuando aparezca el menú desplegable, seleccione Preferencias opción.
-
Las preferencias de Safari ahora deberían estar visibles. Haga clic en el Avanzado Icono, ubicado en el extremo derecho de la fila superior.
-
Hacia la parte inferior de la sección Avanzada hay una opción etiquetada Mostrar el menú de desarrollo en la barra de menú, acompañado de una casilla vacía. Seleccione esta casilla una vez para colocar una marca de verificación en ella y cierre la ventana de Preferencias haciendo clic en la 'x' roja que se encuentra en la esquina superior izquierda.
-
Selecciona el Desarrollar Menú, ubicado en la parte superior de la pantalla.
-
Cuando aparezca el menú desplegable, seleccione Mostrar fuente de página. También puedes usar el siguiente método abreviado de teclado: MANDO + OPCION + U.
Ópera
Ejecutándose en: Linux, macOS, Windows
Para ver el código fuente de la página web activa en el navegador Opera, use el siguiente método abreviado de teclado: CTRL + U (MANDO + OPCION + U en macOS). Si prefieres cargar la fuente en la pestaña actual, escribe el siguiente texto a la izquierda de la URL de la página dentro de la barra de direcciones y presiona Introduzca: fuente-vista: ( es decir, fuente de vista: https: //www.Go-Travels.com ).
La versión de escritorio de Opera también le permite ver la fuente HTML, CSS y otros elementos mediante el uso de sus herramientas integradas para desarrolladores. Para iniciar esta interfaz, que de forma predeterminada aparecerá en el lado derecho de la ventana principal del navegador, presione el siguiente método abreviado de teclado: CTRL + MAYÚS + I (COMANDO + OPCION + I en macOS).
El conjunto de herramientas para desarrolladores de Opera también es accesible siguiendo los siguientes pasos.
-
Seleccione el logotipo de Opera, ubicado en la esquina superior izquierda de la ventana de su navegador.
-
Cuando aparezca el menú desplegable, coloque el cursor del mouse sobre la Más herramientas opción.
-
Haga clic en Mostrar menú de desarrollador.
-
Seleccione el logo de Opera de nuevo.
-
Cuando aparezca el menú desplegable, desplace el cursor sobre Desarrollador.
-
Cuando aparezca el submenú, seleccione Herramientas de desarrollo.
Vivaldi
Hay varias formas de ver la fuente de la página dentro del navegador Vivaldi. El más simple es a través de la CTRL + U método abreviado de teclado, que presenta el código de la página activa en una nueva pestaña.
También puede agregar el siguiente texto al frente de la URL de la página, que muestra el código fuente en la pestaña actual: ver fuente:. Un ejemplo de esto sería fuente-vista: http: //www.dotdash.com .
Otro método es a través de las herramientas integradas de desarrollo del navegador, accesibles presionando la tecla CTRL + MAYÚS + I combinación o a través de la Herramientas de desarrollo Opción en el navegador. Herramientas menú - encontrado seleccionando el V Logo en la esquina superior izquierda. El uso de las herramientas de desarrollo permite un análisis mucho más profundo de la fuente de la página.
