Come visualizzare il codice sorgente della pagina Web su iPhone e iPad

Anche se le app iOS non sono ancora le macchine di sviluppo, in genere troverai un iPhone o un iPad in un toolkit di web designer / sviluppatore. Anche se sei uno sviluppatore / editore o solo qualcuno che vuole visualizzare il codice sorgente di una pagina o visualizzare tutte le risorse distribuite su di esso, di solito lo fai dal computer.

Ora iOS 8 ha reso molto più semplice la visualizzazione di sorgenti, risorse e risorse DOM di una pagina. E grazie alle fantastiche app di terze parti con supporto delle estensioni, puoi farlo direttamente in Safari (Chrome non è supportato perché le estensioni possono accedere a DOM solo in Safari).

Parliamo delle due app che ti aiuteranno a visualizzare e salvare il codice sorgente per qualsiasi sito Web quando sei in viaggio.

Visualizza l'estensione di origine per Safari

Visualizza sorgente ($ 0, 99) è un'app semplice e potente con estensione Safari. Costa $ 0, 99, ma include molte funzionalità.

Una volta installata l'app, vai su Safari, tocca il pulsante Condividi, scorri verso destra nella riga in basso e tocca Altro. Da qui attiva / disattiva Visualizza sorgente. Ciò consentirà l'estensione.

Altro su estensioni iOS 8: le estensioni iOS 8 stanno rapidamente diventando uno strumento potente. Dai un'occhiata a come funzionano, le migliori estensioni di condivisione e come un'estensione può aiutarti a trasformare Safari in un downloader completo.

Ora vai alla pagina, tocca il pulsante Condividi e scegli Visualizza sorgente. Vedrai il codice sorgente della pagina in tutto il suo splendore. Tocca il pulsante Condividi per visualizzare il foglio di condivisione nativo. Da qui puoi inviare il codice a un'app per le note o inviarlo via email.

Sotto vedrai quattro pulsanti: Risorse, DOM, Script e Informazioni.

Le risorse elencano tutte le immagini sulla pagina. È possibile toccare un collegamento per vedere un'anteprima e salvare l'immagine.

Il pulsante DOM mostrerà un modello ad albero con una struttura gerarchica dei documenti HTML, XML e SVG. Puoi toccare qualsiasi elemento per espanderlo.

Il pulsante Script consente di scrivere e iniettare Javascript in qualsiasi pagina (localmente). Il pannello Informazioni mostra le informazioni sulla pagina.

Srcfari

Srcfari ($ 0, 99) è un'alternativa a Visualizza sorgente. Mentre l'app ti mostrerà il codice sorgente e le risorse come immagini, fogli di stile CSS e script in esecuzione sulla pagina, dovrai farlo dall'app stessa. Non esiste un'estensione Safari per Srcfari.

Detto questo, usare Srcfari non è affatto una brutta esperienza. L'app ha una bella tipografia e fa un lavoro molto migliore nel suddividere le risorse per script, CSS e immagini rispetto all'app View Source. Una lamentela che ho con Srcfari è che ha abilitato il wrapping del testo per i fogli di stile CSS ma non quando stai visualizzando l'intera fonte (cosa che fa l'app Visualizza sorgente). Ciò significa che ci sarà una buona dose di panning e zoom, almeno su iPhone.

A parte questo, Srcfari è la solita vicenda. Puoi copiare il codice sorgente negli appunti o inviarlo via email a qualcuno. Puoi anche salvare le immagini usando l'app.

Conclusione

Safari è probabilmente già il tuo browser preferito su iOS (principalmente perché iOS non ti consente di selezionare Chrome come predefinito). Se devi visualizzare il codice sorgente abbastanza spesso, l'app $ 0, 99 Visualizza sorgente con la sua estensione Safari varrà il prezzo.

Di solito usi il tuo iPhone o iPad per risolvere i problemi dei siti Web? O per vedere cosa c'è che non va in loro? Fateci sapere nei commenti qui sotto.