MacOS: Activarea Web Inspector în Safari

Dacă doriți să vizualizați codul sursă al unei pagini web în Apple Safari pentru macOS Sierra, va trebui să activați instrumentul Safari Web Inspector folosind următoarele metode.

Dezvoltatorii de browsere web, cum ar fi Apple, Google etc., oferă un instrument gata de utilizare pentru a vizualiza codurile de bază. Dezvoltatorii folosesc acest lucru în principal pentru a depana și vizualiza modificările efectuate pe un site web live fără a deranja codul real de pe server. Cu toate acestea, acest instrument a devenit acum popular în rândul creatorilor de conținut și utilizatorilor internautici familiarizați cu tehnologia care doresc să editeze un site web live în scopuri personale sau profesionale. Dacă sunteți unul dintre aceștia, citiți articolul până la sfârșit pentru a ști totul despre Safari Web Inspector și cum să inspectați un element.

Conținut

• 1 Ce Este Safari Web Inspector?
• 2 Cum să Activezi Safari Web Inspector în Safari 10 și Versiuni Superioare
• 3 Cum să Folosești Safari Web Inspector pe macOS
• 4 Cum să Deschizi Safari Web Inspector în Versiuni Vechi de macOS
  • 4.1 Safari Web Inspector: Cuvinte Finale

Ce Este Safari Web Inspector?

Web Inspector este parte a pachetului de instrumente de dezvoltare oferit de Apple dezvoltatorilor de site-uri web și aplicații din întreaga lume. Instrumentul este disponibil atât pentru dispozitivele macOS, cât și pentru cele iOS. Dezvoltatorii pot modifica, optimiza și depana site-uri web cu ușurință pentru a obține performanță maximă pentru proprietățile lor online.

Instrumentul Web Inspector din Safari aduce cele mai multe resurse ale site-ului sub o interfață unificată. De asemenea, instrumentul separă resursele și parametrii acestora în tab-uri dedicate astfel încât să nu fiți copleșiți de atât de multe coduri și opțiuni. Web Inspector vă oferă, de asemenea, o vedere a Cronologiei memoriei site-ului, astfel încât să puteți depana ușor memoria. Mai mult, fiind dezvoltator, puteți ajusta și optimiza mai mult de 150 de proprietăți CSS populare de care aveți nevoie în dezvoltarea unui site web funcțional.

Pe instrumentul Web Inspector, aveți următoarele tab-uri pentru resursele site-ului:

• Elemente
• Consolă
• Surse
• Rețea
• Cronologie
• Stocare
• Grafice
• Straturi
• Audit

Cum să Activezi Safari Web Inspector în Safari 10 și Versiuni Superioare

Implicit, Apple Mac dezactivează Web Inspector în Safari. Aceasta este pentru a preveni aglomerarea inutilă a interfeței utilizatorului (UI) a browserului web. Cu toate acestea, dacă sunteți un dezvoltator, creator de conținut sau utilizator expert de Mac, poate doriți să activați această funcție urmând acești pași:

• Deschideți aplicația Safari pe MacBook sau iMac.
• Asigurați-vă că ați dat clic pe browser pentru a obține pictograma Safari pe bara de instrumente Mac.

• Faceți clic pe Safari în colțul din stânga sus și selectați Preferințe.
• Alternativ, puteți folosi combinația de taste Command + , pentru a arăta meniul Preferințe.
• În meniul Preferințe, trebuie să fiți pe tab-ul General.

• Navigați la tab-ul Avansat.
• Imediat sub opțiunea Proxies, ar trebui să vedeți caseta de selectare pentru Arată meniul De dezvoltare în bara de meniu. Bifați caseta.

• A now, meniul De dezvoltare Safari va apărea pe bara de instrumente Mac.

Așa puteți activa funcția Web Inspector pe browserul vostru Safari de pe Mac. Pașii sunt similari pentru cea mai recentă ediție macOS Ventura, precum și pentru cele anterioare precum Monterey, Big Sur, Catalina etc., până la Jaguar.

Citiți și: Html 4.01

Până acum, ați învățat cum să obțineți funcția Web Inspector pe aplicația Mac Safari. În următoarele părți, aflați cum să o utilizați pe Safari pentru site-uri web live:

Cum să Folosești Safari Web Inspector pe macOS

Găsiți mai jos pașii pentru a apela instrumentul Web Inspector pentru dezvoltarea web, crearea de conținut sau alte scopuri. În acest articol, voi arăta pașii folosind sistemul de operare macOS Monterey. Cu toate acestea, pașii sunt destul de similari de la macOS Jaguar la Venture.

• Deschideți Safari și vizitați orice site web pe care doriți să-l inspectați.
• Există două moduri de a inspecta codurile HTML/CSS de bază ale unui site web sau de a face modificări folosind instrumentul de dezvoltare Apple Web Inspector. Acestea sunt:
  • Dezvoltare > Arată Web Inspector.
  • Click dreapta > Inspectează Elementul.
• Pentru a folosi prima opțiune, mergeți la bara de instrumente Mac pentru browserul Safari și faceți clic pe meniul Dezvoltare.

• În meniul contextual care apare, faceți clic pe Arată Web Inspector. Combinarea de taste pentru această acțiune este Option + Command + I.

• Aceasta va deschide instrumentul Web Inspector în jumătatea de jos a browserului web. Codurile pe care le vedeți sunt pentru întregul URL sau pagina web la care ați avut acces.
• Dacă doriți să vizualizați codul de bază pentru un element specific de pe pagina web fără a deschide codul pentru întreaga pagină web, selectați elementul pe care doriți să-l inspectați.

• Click dreapta și selectați Inspectează Elementul din meniul contextual care se deschide.
• Web Inspector din Safari se va deschide.

• Dar de data aceasta, Safari vă va duce direct la codul HTML sau CSS de bază al elementului pe care îl analizați.
• În acest instrument, obțineți codurile HTML și CSS ale elementului de pe pagina web pe care o inspectați.

Citiți și: Technipages Explică CSS

Cum să Deschizi Safari Web Inspector în Versiuni Vechi de macOS

Presupunând că aveți un Mac mai vechi decât Jaguar și trebuie să folosiți instrumentul Web Inspector. Dacă nu găsiți pașii de mai sus pe acel Mac, puteți executa un cod simplu pentru a activa Web Inspector. Iată cum se face:

• Deschideți Aplicații și mergeți la folderul Utilitare.
• În cadrul Utilitarului, ar trebui să găsiți Terminal. Este promptul de comandă pentru computerele macOS.
• Acum, lansați terminalul și tastați următoarea comandă simplă:

defaults write com.apple.Safari WebKitDeveloperExtras -bool true

• Apăsați Return pentru a executa comanda.
• Acum puteți deschide o pagină web în Safari și faceți clic dreapta sau țineți apăsat butonul mouse-ului oriunde pe pagină până când apare meniul contextual.
• Acolo, faceți clic pe opțiunea Inspectează Elementul pentru a vizualiza codurile CSS și HTML de bază ale site-ului.

Safari Web Inspector: Cuvinte Finale

Așadar, acestea sunt metodele de activare a Web Inspector în Safari fără efort. Puteți urma pașii singuri și începeți dezvoltarea sau crearea de conținut în câteva minute. Ați învățat metodele de activare a Inspect Element în Safari atât pentru edițiile noi, cât și pentru cele vechi de macOS. Dacă am ratat vreo metodă de a obține și utiliza Web Inspector, nu ezitați să-mi spuneți lăsând un comentariu mai jos.

Următor, cele mai bune aplicații de programare pentru iPad.