Suponga que está visitando un sitio web en el que trabajó y ve algunos problemas técnicos. Debe ver la fuente de la página en iPhone o iPad para encontrar el código de error y corregirlo. Abre Safari y se vuelve loco para encontrar el botón de vista de código fuente HTML en Safari sin éxito. ¿Qué haces ahora? ¡Es fácil, solo lea este artículo!
Todo desarrollador de sitios web, programador, diseñador de software, desarrollador de aplicaciones de App Store, creador de contenido y webmaster sabe lo crucial que es el código fuente. En esta parte del trabajo, siempre debe mirar el código fuente de una página web para corregir problemas, depurar, diseñar y agregar valor al sitio web.
Si bien esta tarea es bastante fácil en dispositivos Android y Windows , es igualmente difícil en dispositivos Apple como iPhone, iPad, MacBook e iMac. Sin embargo, en macOS, la función está disponible pero oculta y puede encontrarla siguiendo este artículo”Ver código fuente HTML en Safari”. Sin embargo, para 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 método nativo, o debería decir, fácil que pueda tocar o tocar para obtener el código fuente HTML de las páginas web. Pero no te vuelvas demasiado loco todavía. En su lugar, lea este artículo hasta el final para encontrar las mejores maneras de aprender a ver el código fuente de la página en Safari en iPhone o iPad.
Razones por las que debe ver el código fuente de la página en iPhone/iPad
Encuentre a continuación algunas situaciones y razones para ver las fuentes de la página en Safari en iPad/iPhone:
Debe ver la fuente de la página de una página web para un dispositivo específico como iPhone o iPad. Si accede al sitio web en Mac y ve el código fuente HTML, verá los elementos de la versión de escritorio, no las versiones de iPhone o iPad. Estás de viaje y quieres invertir tu tiempo en buscar códigos de páginas web para obtener nuevas ideas o crear un plan de depuración. Prefiere desarrollar sitios web en su iPad, ya que viene con muchas funciones multitarea como Stage Manager, Split View, etc.
Por lo tanto, siga los métodos a continuación para estar preparado en caso de que necesite ver la fuente de la página en iPhone o iPad momento.
Los mejores métodos para ver el origen de la página en iPhone/iPad
A continuación, se muestran las formas populares de ver los orígenes de la página en códigos HTML en un iPhone o iPad sin utilizar ninguna aplicación de terceros.. Estos métodos son apropiados para codificadores y usuarios finales preocupados por la privacidad y la seguridad:
1. Obtenga el código fuente HTML mediante la aplicación de accesos directos
Este método solo funcionará si está ejecutando iOS 12.0 (iPadOS 12.0) y versiones posteriores. Aquí se explica cómo crear un acceso directo a la fuente de la página de visualización en iPhone o iPad:
Abra la aplicación Accesos directos desde la pantalla de inicio o el cajón de aplicaciones. Toca el icono más (+) para crear un nuevo acceso directo vacío. En el cuadro de búsqueda, escriba HTML y elija Crear HTML a partir de texto enriquecido. De nuevo, busque la aplicación Vista rápida en el cuadro de búsqueda y agréguela al editor de accesos directos. Ahora, toca el icono de acceso directo en la parte superior y elige Cambiar nombre. Acceso directo para ver el código fuente en las páginas web Cámbiele el nombre a Ver código fuente y toque Listo. Toca el botón (i) y activa la opción Mostrar en hoja compartida. Ahora, abra el navegador Safari y visite una página web de su elección. Ver acceso directo del código fuente en la hoja para compartir en Safari Toque el botón Compartir en la aplicación Safari y desplácese hacia abajo para encontrar el acceso directo Ver código fuente. Toque el acceso directo y obtendrá el código fuente HTML en Quick Look.
2. Ver el código fuente de la página mediante un script de marcador
En este método, creará un marcador y la URL será un script de fuente de visualización. Cuando navega por cualquier página web y necesita ver la fuente de la página en Safari, simplemente toque el marcador. Obtendrá un código fuente HTML para la página. Así es como se hace:
Visite un sitio web aleatorio y márquelo como favorito en su navegador Safari para iPad o iPhone. Toca el menú Safari en la esquina superior izquierda y ve a Marcadores. Toca Favoritos para encontrar el marcador que acabas de agregar. Toque prolongadamente el marcador y luego seleccione Editar en el menú contextual. Cómo editar el título y la dirección del marcador Borre el título del marcador existente y cámbiele el nombre a código fuente HTML o cualquier otra cosa solo para recordar el marcador. Toca el campo Dirección y borra 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))})(); Toca Listo en el teclado para guardar los cambios que has hecho hasta ahora. Ahora, vaya a la página web para la que necesita inspeccionar el código fuente.
Cómo ver la fuente de la página en Safari usando un script de marcadores Ve al menú Marcadores y toca el marcador código fuente HTML que acabas de creado. Debería ver el código HTML de la página que está visitando en una nueva pestaña de Safari.
Lea también: Cómo administrar marcadores en Safari en iOS y Mac
3. Ver el código fuente de la página con macOS Tethering
La aplicación Safari en iPhone y iPad viene con una herramienta Web Inspector integrada. Desafortunadamente, la función no funciona directamente en dispositivos iPhone o iPad. Debe conectar los dispositivos a una MacBook o iMac. Luego, puede usar los controles en Mac Safari para visualizar el código fuente HTML. El proceso funciona en dos fases, como se describe 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, abre la aplicación Configuración. Ve a Configuración de Safari. Desplácese hacia abajo hasta la parte inferior de la ventana Configuración de Safari para encontrar el menú Avanzado. Tócalo. Cómo obtener Web Inspector en Safari iPad Active el Web Inspector tocando el botón de alternar.
Ver código fuente de la página en Mac Safari
Ve a tu Mac y sigue estos pasos:
Conecta el iPhone o iPad con una MacBook o iMac usando el cable USB. Si el dispositivo no se ha autenticado antes, Mac le pedirá que lo autentique con el ID de Apple. Ahora abra la aplicación Safari en Mac y visite cualquier sitio web. En la barra de herramientas de Mac, haga clic en Desarrollar. Busque su 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 muestra 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 Mac Safari.
Si está de acuerdo con las aplicaciones y herramientas de terceros, también puede consultar estos métodos adicionales para ver los códigos fuente HTML de las páginas web:
4. Extensión Safari: Web Inspector
Puede instalar la extensión Web Inspector para el navegador Apple Safari en iPad y iPhone. Luego, llame a la extensión cuando navegue por una página web para ver su código fuente HTML. Estos son los pasos que debe seguir:
Abra la aplicación Configuración y vaya a la sección Configuración de Safari. Desplázate hacia abajo hasta que encuentres la opción Extensiones. Tócalo. Ve a Más extensiones en la configuración de Safari Dentro de Extensiones, toca Más extensiones. Aparecerá la página de la tienda de aplicaciones para las extensiones de Safari. Toca el cuadro Buscar y escribe Web Inspector y toca Buscar en el teclado. Busque e instale la aplicación Web Inspector. Vuelve a ir a Configuración > Safari > Extensiones > y toca Web Inspector. Use el botón de alternar para activar esta extensión para Safari. Abre Safari y visita cualquier sitio web.
Activa Web Inspector desde el menú Extensiones de Safari Toca el ícono Extensiones en la esquina derecha de la barra de direcciones. Selecciona la extensión Web Inspector. Elija la opción Permitir por un día en la ventana emergente que aparece. De nuevo, toque el ícono Extensiones y luego toque Web Inspector. El código fuente HTML debería aparecer en la parte inferior de la página web que está viendo. Aprenda a ver el código fuente de la página en iPhone o iPad usando Web Inspector. Puede cambiar entre pestañas como DOM, Elementos, Consola, Red y Recursos. Para volver a la vista normal, simplemente toque la extensión Web Inspector en la sección Extensiones de Safari.
5. Aplicación para iOS: Ver código fuente
Puede obtenerla de forma gratuita en la App Store. En el cuadro de búsqueda, escriba Ver código fuente y toque Buscar. Verás múltiples resultados en la App Store. Instale el que dice Ver código fuente. El proveedor de la aplicación es Roman Tomjak.
Abra la aplicación desde la pantalla de inicio o el cajón de aplicaciones. Luego, escriba la URL del sitio web en su barra de direcciones para revelar el código fuente HTML.
Cómo utilizar la aplicación View Source
La herramienta ofrece una vista del código fuente del tamaño de un iPhone. Sin embargo, puede cambiar la orientación o hacer zoom usando los botones correspondientes en la esquina inferior derecha de la pantalla.
6. Ver el código fuente de forma gratuita con Google Web Cache
Puede realizar el siguiente truco genial 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. Tomar cursor antes del código HTTPS Tome el cursor de escritura al comienzo de la dirección como se muestra en la imagen de arriba. Type Cache antes de HTTPS código Ahora, escribe el siguiente código antes de https:// cache: Presiona el botón Ir en el teclado de iOS.
Cómo ver la fuente de la página en Safari usando Google Web Cache En la parte superior de la página, debe ver la opción Ver fuente. Tócalo. Ahora obtienes el código fuente de la página web que acabas de visitar.
Lea también: Cómo importar sus marcadores, contraseñas y más
7. Ver código fuente en aplicaciones web
Hay muchos sitios web que le permiten revelar los códigos fuente subyacentes de sitios web y páginas web de forma gratuita o por una pequeña tarifa. De todas esas aplicaciones web, elegí el visor de código fuente de CodeBeautify. Así es como funciona:
Cómo ver el código fuente en las aplicaciones web En el cuadro Ingresar URL, escriba o copie y pegue la URL de la página web para la que desea revelar la fuente HTML código. Toque el botón Ver para ver la fuente de la página en el navegador Safari de iPhone/iPad.
Conclusión
Entonces, ahora conoce todos los trucos para ver la fuente de la página en dispositivos iPhone y iPad. Descubrió algunos métodos nativos y no nativos en este artículo. Simplemente puede apegarse a los trucos nativos en iPad o iPhone para ver el código fuente HTML de las páginas web o usar aplicaciones que facilitan mucho la tarea.
Déjame saber qué método te gustó dejando un comentario. abajo. Además, comparta el artículo en las redes sociales y WhatsApp para ayudar a sus amigos que están aprendiendo desarrollo de sitios web y codificación de aplicaciones.
A continuación, Cómo aprender Swift en Mac y iPad.