Cómo ver la fuente de la página web en el iPhone / iPad: 7 Mejores Métodos

Supongamos que usted está visitando un sitio web en el que trabajó y ver algunos fallos. Necesitas ver el código fuente de la página en iPhone o iPad para encontrar el código buggy y arreglarlo. Abres Safari y te vuelves loco para encontrar el botón de ver código fuente HTML en Safari sin resultado. ¿Qué hacer ahora? Es fácil, ¡sólo tienes que leer este artículo!

Todo desarrollador de sitios web, programador, diseñador de software, desarrollador de aplicaciones para App Store, creador de contenidos y webmaster sabe lo crucial que es el código fuente. En este tipo de trabajo, siempre es necesario mirar el código fuente de una página web para rectificar problemas, depurar, diseñar y añadir valor al sitio web.

Mientras que esta tarea es bastante fácil en dispositivos Android y Windows, es igualmente difícil en dispositivos Apple como iPhone, iPad, MacBook e iMac. Aunque, en macOS, la función está disponible pero oculta y puedes encontrarla siguiendo este artículo "Ver código fuente HTML en Safari". Sin embargo, para los dispositivos iOS, es una historia diferente.

Apple hizo absolutamente difícil ver las fuentes de las páginas en iPad/iPhone. No hay ningún nativo, o debería decir, métodos fáciles que usted puede ya sea toque o toque para obtener el código fuente HTML de las páginas web. Pero no te vuelvas loco todavía. En su lugar, lea este artículo hasta el final para encontrar las mejores maneras de aprender cómo ver la fuente de la página en Safari en iPhone o iPad.

Razones por las que debes ver el código fuente de la página en iPhone/iPad

Encuentra a continuación algunas situaciones y razones para ver las fuentes de página en Safari en iPad/iPhone:

• Usted debe ver la fuente de la página de una página web para un dispositivo específico como iPhone o iPad. Si accede a la página web en Mac y ve el código fuente HTML, verá los elementos para la versión de escritorio, no para las versiones de iPhone o iPad.
• Estás de viaje y quieres invertir tu tiempo en mirar los códigos de las páginas web para obtener nuevas ideas o crear un plan de depuración.
• Prefieres hacer desarrollo de páginas web en tu iPad ya que viene con muchas características multitarea como Stage Manager, Split View, etc.

Por lo tanto, siga los métodos que se indican a continuación para estar preparado en caso de que aparezca en cualquier momento la necesidad de ver el código fuente de la página en el iPhone o el iPad.

Los mejores métodos para ver la fuente de la página en iPhone/iPad

A continuación se presentan las formas más populares para ver las fuentes de página en códigos HTML en un iPhone o iPad sin aprovechar ninguna aplicación de terceros. Estos métodos son apropiados para codificadores y usuarios finales preocupados por la privacidad y la seguridad:

1. Obtener el código fuente HTML utilizando la aplicación Shortcuts

Este método sólo funcionará si está ejecutando iOS 12.0 (iPadOS 12.0) y posterior. A continuación, te explicamos cómo crear un acceso directo a la fuente de la página de vista en iPhone o iPad:

• Abre la página Accesos directos app desde la pantalla de inicio o el cajón de aplicaciones.
• Toque la más (+) para crear un nuevo acceso directo vacío.
• En el cuadro de búsqueda, escriba HTML y seleccione Crear HTML a partir de texto enriquecido.
• Una vez más, busque la etiqueta Vista rápida app en el cuadro de búsqueda y añádela al editor de accesos directos.
• Ahora, toca el icono de acceso directo en la parte superior y elige Cambiar nombre.

• Cambie el nombre a Ver código fuente y pulse Listo.
• Toque el botón (i) y active el botón Mostrar en hoja compartida opción.
• Ahora, abra el navegador Safari y visite una página web de su elección.

• Toque la opción Compartir en la aplicación Safari y desplácese hacia abajo hasta encontrar la opción Ver código fuente acceso directo.
• Toque el acceso directo y obtendrá el código fuente HTML en Vista rápida.

2. Ver la fuente de la página utilizando un script de marcador

En este método, crearás un marcador y la URL será un script de ver fuente. Cuando navegues por cualquier página web y necesites ver la fuente de la página en Safari, simplemente toca el marcador. Obtendrás el código fuente HTML de la página. Así es como se hace:

• Visita una página web al azar y márcala como favorita en tu navegador Safari para iPad o iPhone.
• Pulse el botón menú Safari en la esquina superior izquierda y vaya a Favoritos.
• Toque Favoritos para buscar el marcador que acabas de añadir.
• Mantenga pulsado el marcador y, a continuación, seleccione Editar en el menú contextual.

• Borre el título del marcador existente y cámbiele el nombre a Código fuente HTML o cualquier otra cosa para recordar el marcador.
• Pulse el botón Dirección y borre la URL existente.
• Copie y pegue el siguiente código como URL (creador del código: Rob Flaherty):

javascript:(function()var a=window.open('about:blank').document;a.write('');a.close();var b=a.body.appendChild(a.createElement('pre'));b.style.overflow='auto';b.style.whiteSpace="pre-wrap";b.appendChild(a.createTextNode(document.documentElement.innerHTML)))();

• Pulse Hecho en el teclado para guardar los cambios realizados hasta el momento.
• Ahora, vaya a la página web para la que necesita inspeccionar el código fuente.

• Vaya a la página Marcadores y toque el botón Código fuente HTML que acaba de crear.
• Deberías ver el código HTML de la página que estás visitando en una nueva pestaña de Safari.

Lee también: Cómo gestionar los favoritos en Safari en iOS y Mac

3. Cómo ver la fuente de la página usando macOS Tethering

La aplicación Safari en iPhone y iPad viene con una herramienta incorporada de Inspector Web. Por desgracia, esta función no funciona directamente en los dispositivos iPhone o iPad. Tienes que conectar los dispositivos a un MacBook o iMac. A continuación, puedes utilizar los controles del Safari del Mac para visualizar el código fuente HTML. El proceso funciona en dos fases, como se indica a continuación:

Activar Web Inspector

Siga estos pasos para activar la funcionalidad Web Inspector en Safari para iPad y iPhone:

• En su iPhone o iPad, abra el menú Ajustes aplicación.
• Ir a Ajustes de Safari.
• Desplácese hasta la parte inferior de la ventana Ajustes de Safari para encontrar la opción Avanzado Avanzado. Pulse sobre él.

• Activar el Inspector Web pulsando el botón de alternancia.

Ver el código fuente de la página en Mac Safari

Ve a tu Mac y sigue estos pasos:

• Conecte el iPhone o iPad con un MacBook o iMac mediante el cable USB.
• Si el dispositivo no se ha autenticado antes, el Mac le pedirá que lo autentique mediante el ID de Apple.
• Ahora abra la aplicación Safari en el Mac y visite cualquier sitio web.
• En la barra de herramientas del Mac, haga clic en Desarrollar.
• Busca tu iPad o iPhone en el menú contextual que se abre.
• Haga clic en su iPad o iPhone para abrir una nueva ventana en su Mac que muestre la pantalla de Safari de estos dispositivos.
• Ahora, abra el sitio web de destino en su iPhone o iPad y vea el código fuente en el navegador Safari del Mac.

Si estás de acuerdo con las aplicaciones y herramientas de terceros, entonces es posible que también quieras echar un vistazo a estos métodos adicionales para ver los códigos fuente HTML de las páginas web:

4. Extensión de Safari - Web Inspector

Puede instalar la extensión Web Inspector para el navegador Safari de Apple en iPad y iPhone. A continuación, llame a la extensión al navegar por una página web para ver su código fuente HTML. Estos son los pasos que debe probar:

• Abra el navegador Configuración y vaya a la sección Ajustes de Safari sección.
• Desplácese hacia abajo hasta encontrar la sección Extensiones . Pulse sobre ella.

• Dentro de Extensiones, toque Más extensiones.
• Aparecerá la página de la App Store para las Extensiones de Safari.
• Toque el icono Buscar y escriba Inspector Web y pulse Buscar en el teclado.
• Busque e instale la aplicación Web Inspector.
• De nuevo vaya a Configuración > Safari > Extensiones > y pulse Inspector web.
• Utilice el botón de alternancia para activar esta extensión para Safari.
• Abra Safari y visite cualquier sitio web.

• Toque el botón Extensiones en la esquina derecha de la barra de direcciones.
• Seleccione el icono Inspector Web extensión.
• Elija la extensión Permitir un día en la ventana emergente que aparece.
• De nuevo, toque la opción Extensiones icono y luego toque Inspector Web.
• El código fuente HTML debería aparecer desde la parte inferior de la página web que estás viendo.

• Puedes cambiar entre las pestañas como DOM, Elementos, Consola, Red y Recursos.
• Para volver a la vista normal, basta con tocar la extensión Web Inspector en la sección Extensiones de Safari.

5. Aplicación iOS - Ver fuente

Puedes conseguirla gratis en la App Store. En el cuadro de búsqueda, escribe View Source y toca Buscar. Verás varios resultados en App Store. Instala el que dice View Source. El proveedor de la app es Roman Tomjak.

Abre la aplicación desde la pantalla de inicio o el cajón de aplicaciones. A continuación, escriba la URL del sitio web en la barra de direcciones para ver el código fuente HTML.

La herramienta ofrece una vista del código fuente del tamaño de un iPhone. Sin embargo, puedes cambiar la orientación o hacer zoom utilizando los botones correspondientes situados en la esquina inferior derecha de la pantalla.

6. Ver el código fuente de forma gratuita usando Google Web Cache

Puede realizar el siguiente truco aseado y fresco en los sitios web visitados para ver su código fuente subyacente en Safari o Chrome:

• Visite la página web para la que necesita encontrar el código fuente HTML.
• Toque la dirección en la barra de direcciones de Safari o Chrome.

• Lleve el cursor de escritura al principio de la dirección como se muestra en la imagen anterior.

• Ahora, escriba el siguiente código antes de https://

cache:

• Pulsa el botón Ir en el teclado de iOS.

• En la parte superior de la página debe aparecer el icono Ver fuente . Pulse sobre ella.
• Ahora obtendrá el código fuente de la página web que acaba de visitar.

Lee también: Cómo importar tus marcadores, contraseñas y mucho más

7. Ver el código fuente en las aplicaciones web

Hay muchos sitios web que te permiten revelar los códigos fuente subyacentes de sitios y páginas web de forma gratuita o por una pequeña cuota. De todas esas aplicaciones web, elegí el Visor de Código Fuente de CodeBeautify. Así es como funciona:

• En iPhone o iPad, ve a este enlace: Visor de código fuente utilizando el navegador Safari.

• En el Introducir URL escriba o copie y pegue la URL de la página web cuyo código fuente HTML desea revelar.
• Pulse el botón Ver para ver la fuente de la página en el navegador Safari del iPhone/iPad.

Conclusión

Por lo tanto, ahora usted sabe todos los trucos para ver la fuente de la página en los dispositivos iPhone y iPad. Usted descubrió algunos métodos nativos y no nativos en este artículo. Puedes simplemente ceñirte a los trucos nativos en iPad o iPhone para ver el código fuente HTML de las páginas web o utilizar aplicaciones que facilitan mucho la tarea.

Déjame saber qué método te ha gustado dejando un comentario a continuación. Además, no compartir el artículo en las redes sociales y WhatsApp para ayudar a sus amigos que están aprendiendo el desarrollo de sitios web y la codificación de aplicaciones.

A continuación, Cómo aprender Swift en Mac y iPad.

Preguntas y Respuestas