V tej navodilih ti želim podrobno predstaviti uporabo orodij razvijalca za Safari. Čeprav imajo razvijalčeva orodja v Safari nekaj razlik v primerjavi z orodji v Chrome in Firefox, ostaja osnovno načelo enako. Naučil se boš, kako aktivirati razvijalčeva orodja, kako uporabljati različna področja in funkcionalnosti ter kako izvesti ključne postopke odpravljanja napak. Začnimo neposredno z najpomembnejšimi ugotovitvami.
Najpomembnejše ugotovitve
- Razvijalčeva orodja v Safari niso tako enostavno dostopna kot v drugih brskalnikih, saj jih je treba omogočiti v nastavitvah.
- Uporabniški vmesnik in funkcionalnosti razvijalčevih orodij so podobni drugim brskalnikom, vendar se specifične implementacije razlikujejo.
- Odpravljanje napak na iOS napravah je s Safari možno, če napravo povežeš prek USB kabla.
Korak za korakom
1. Aktiviranje razvijalčevih orodij v Safariju
Za aktiviranje razvijalčevih orodij v Safariju moraš prilagoditi nastavitve Safarija. Zaženi Safari in pojdi v menijsko vrstico. Izberi "Safari" in nato "Nastavitve".
Pojdi na zavihek "Napredno" skrajno desno. Tam najdeš možnost "Pokaži razvojna orodja za spletnega razvijalca". Omogoči to možnost, da aktiviraš razvijalčeva orodja.
2. Dostop do razvijalčevih orodij
Ko so razvijalčeva orodja aktivirana, jih lahko odpreš prek menija "Razvijalec" v menijski vrstici ali s posebnimi bližnjicami na tipkovnici. Neposreden dostop prek tipk F12 ali Alt-Cmd-I ne deluje, vendar lahko na primer z desno miškino tipko klikneš na element in izbereš "Razišči element".
Lahko uporabiš tudi bližnjico Cmd+Option+C, da odpreš konzolo in preklopiš med različnimi pogledi.
3. Navigacija skozi razvijalčeva orodja
Čeprav se uporabniški vmesnik razvijalčevih orodij zdi podoben kot ga poznaš iz drugih brskalnikov, imajo nekaj posebnih odstopanj. Na levi stranski vrstici lahko preklopiš med zavihki "Elementi", "Konzola", "Izvorne datoteke", "Omrežje" in drugimi.
Tukaj lahko izveš več o elementih spletne strani, da prikažeš in urejaš njihove sloge in postavitve. Vsak stil lahko urejaš tako, da preprosto klikneš na ustrezna CSS pravila.
4. Delo s konzolo
Konzola v Safariju ti omogoča izvajanje JavaScript kode in prikazovanje želenih izhodov. Zanimiv vidik je, da se oblikovanje izpisov tukaj razlikuje. Prvi argument se izpiše kot besedilo, vse naslednje argumente pa se prikažejo kot JavaScript objekti.
Če izpišeš dodatne dnevniške zapise, bodi pozoren, da med posameznimi argumenti ni presledkov, temveč so ločeni z črticami. To je lahko pomembno, da se izogneš nesporazumom pri odpravljanju napak.
5. Nastavljanje izvorne kode in prekinitev
V zavihku "Izvorne datoteke" lahko ogledaš originalne datoteke in prevedene datoteke svoje spletne strani. Tu je mogoče tudi nastaviti prekinitve, da se olajša odpravljanje napak. Preprosto klikni na ustrezno vrstico kode.
Ne pozabi uporabljati različnih kontrol za lažje prehajanje s korakom skozi kodo. V Safariju je bližnjica za prehajanje drugačna; namesto tega uporabiš specifične simbole.
6. Izvajanje analiz omrežja
Zavihek "Omrežje" ti zagotavlja celovite informacije o vseh zahtevah, ki jih tvoja stran naredi med svojim nalaganjem. Tukaj vidiš zahtevane in prejete zahteve ter njihove glave in predogledi.
Ena zanimiva funkcija tukaj je razlikovanje med glavi in časi, ki vam omogočajo globlji vpogled v učinkovitost vaše strani.
7. Uporaba meritev zmogljivosti in časovnih načrtov
V zavihku "Časovnice" lahko izvajate obsežne analize zmogljivosti in snemate, da bolje razumete hitrost in postopke na svoji spletni strani.
Ta funkcija deluje podobno kot profil učinkovitosti v drugih brskalnikih, vendar se morda morate privaditi nekaterim razlikam v prikazu in imenovanju.
8. Odpravljanje napak na mobilnih napravah
Ena od posebnih značilnosti orodij za razvijalce Safari je možnost, da razvijate spletne strani na vašem iPhoneu ali iPadu. Napravo priključite prek vmesnika USB in v nastavitvah naprave omogočite ustrezne možnosti odpravljanja napak.
Nato pojdite v meni "Razvijalec" in izberete svojo povezano napravo, da dostopate do odprtih oken in njihovih orodij za razvijalce.
Povzetek
V tej obsežni vadnici ste se naučili, kako aktivirati orodja za razvijalce Safari, kako uporabljati različne funkcije in zavihke ter kako odpravljati napake na mobilnih napravah. Večina funkcij je podobna orodjem v drugih brskalnikih, vendar obstajajo posebne razlike, predvsem pri uporabniškem vmesniku in bližnjicah. Ko se s tem seznanite, boste hitro obvladali odpravljanje napak v Safariju.
Pogosto zastavljena vprašanja
Kako aktiviram orodja za razvijalce v Safariju?Pojdite v nastavitve Safarija v "Napredno" in omogočite možnost "Prikaži razvojne funkcije za spletnega razvijalca".
Kako odprem konzolo v Safariju?Konzolo lahko odprete s tipkama Cmd+Option+C ali tako, da kliknete "Preišči element" v kontekstnem meniju.
Kakšne so razlike v konzoli Safarija v primerjavi z drugimi brskalniki?V Safariju se prvi argument izpiše kot besedilo, vsi naslednji pa kot JavaScript objekti, med izpisi pa ni presledka.
Ali lahko odpravljam napake na svojem iPhoneu s Safarijem?Da, s priključitvijo iPhona prek USB-ja in omogočitvijo možnosti odpravljanja napak lahko odpravljate napake na svojem iPhoneu prek Safarija.
Ali Safari nudi enako analizo učinkovitosti kot Chrome?Da, funkcija Časovnice v Safariju omogoča podobne analize zmogljivosti, vendar se lahko prikaz razlikuje.
