Cum să vizualizați codul sursă al paginii web pe iPhone și iPad

Chiar dacă aplicațiile iOS nu sunt chiar așa mașini de dezvoltare totuși, veți găsi, în general, un iPhone sau un iPad în setul de instrumente al unui designer/dezvoltator web. Deși, dacă ești un dezvoltator/editor sau doar cineva care dorește să vizualizeze codul sursă al unei pagini sau să vizualizeze toate activele implementate pe aceasta, de obicei o faci de pe computer.

Acum, iOS 8 a făcut mult mai ușor să vizualizați sursa, materialele și resursele DOM ale unei pagini. Și, mulțumită aplicațiilor terțe cu suport pentru extensii, o puteți face chiar în Safari (Chrome nu este acceptat deoarece extensiile pot accesa DOM numai în Safari).

Să vorbim despre cele două aplicații care vă vor ajuta să vizualizați și să salvați codul sursă pentru orice site web atunci când sunteți pe drum.

Vedeți extensia sursă pentru Safari

Vizualizare sursă (0,99 USD) este o aplicație simplă și puternică cu o extensie Safari. Costă 0,99 USD, dar vine cu o mulțime de funcții.

Odată ce aplicația este instalată, accesați Safari, atingeți

Acțiune butonul, glisați spre dreapta pe rândul de jos și atingeți Mai mult. De aici comutați Vizualizare sursă. Aceasta va activa extensia.

Mai multe despre extensiile iOS 8: Extensiile iOS 8 devin rapid un Unealtă puternică. Aruncăm o privire la cum funcționează, cel cele mai bune extensii de partajare, și cum o extensie vă poate ajuta să transformați Safari într-un program de descărcare complet.

Acum, accesați pagina, atingeți Acțiune butonul și alegeți Vizualizare sursă. Veți vedea codul sursă al paginii în toată gloria sa. Apasă pe Acțiune butonul pentru a afișa foaia de distribuire nativă. De aici puteți trimite codul la o aplicație de note sau îl puteți trimite prin e-mail.

Mai jos veți vedea patru butoane – Active, DOM, Script și Informații.

Activele listează toate imaginile de pe pagină. Puteți atinge un link pentru a vedea o previzualizare și pentru a salva imaginea.

The DOM butonul vă va afișa un model de arbore cu o structură ierarhică a documentelor HTML, XML și SVG. Puteți atinge orice element pentru a-l extinde.

The Scenariul butonul vă permite să scrieți și să injectați Javascript în orice pagină (local). The Info panoul afișează informații despre pagină.

Srcfari

Srcfari (0,99 USD) este o alternativă la View Source. În timp ce aplicația vă va arăta codul sursă și elemente precum imagini, foi de stil CSS și scripturi care rulează pe pagină, va trebui să faceți acest lucru din aplicație în sine. Nu există o extensie Safari pentru Srcfari.

Acestea fiind spuse, utilizarea Srcfari nu este deloc o experiență rea. Aplicația are o tipografie frumoasă și face o treabă mult mai bună la descompunerea activelor în funcție de scripturi, CSS și imagini decât aplicația View Source. O problemă pe care o am cu Srcfari este că a activat împachetarea textului pentru foile de stil CSS, dar nu atunci când vizualizați întreaga sursă (ceea ce face aplicația View Source). Aceasta înseamnă că vor fi implicate o cantitate destul de mare de panoramare și zoom, cel puțin pe iPhone.

În afară de asta, Srcfari este afacerea obișnuită. Puteți copia codul sursă în clipboard sau îl puteți trimite prin e-mail cuiva. De asemenea, puteți salva imagini folosind aplicația.

Concluzie

Safari este probabil deja browserul preferat pe iOS (mai ales pentru că iOS nu vă permite să selectați Chrome ca implicit). Dacă trebuie să vizualizați codul sursă destul de des, aplicația View Source de 0,99 USD cu extensia sa Safari va merita prețul.

Utilizați de obicei iPhone-ul sau iPad-ul pentru a depana site-urile web? Sau să vezi ce e în neregulă cu ei? Spune-ne în comentariile de mai jos.