Ako skontrolovať prvok na iPhone: Všetko, čo potrebujete vedieť

V prípade, že to neviete, webová stránka sa skladá z množstva prvkov, ktoré sú naformátované tak, aby vyzerali ako jedna entita. Weboví vývojári musia pochopiť každý z týchto prvkov, ako sú rozmiestnené na webovej stránke a vidieť, ako každý z nich funguje samostatne.

Používatelia Windows a Mac budú oboznámení s možnosťou „Skontrolovať“ alebo „Skontrolovať prvok“, ktorá je dostupná po kliknutí pravým tlačidlom myši na ľubovoľnú webovú stránku. Táto možnosť ponúka spôsob, ako zobraziť zdrojový kód webovej lokality, zobraziť všetky jej prvky, riadok kódu za každým z nich a upraviť jej Javascript, HTML, CSS a všetky ostatné mediálne súbory, ktoré sa na nej nachádzajú. Týmto spôsobom sa nielen dozviete, ako konkrétna webová stránka funguje a funguje, ale môžete na nej vykonávať úpravy vo svojom vlastnom prehliadači bez toho, aby to ovplyvnilo aktuálnu webovú stránku. 

Aj keď je o možnosti kontroly známe, že je to nástroj „vývojár“, nie sú to len vývojári, ktorí z nej profitujú. Dokonca aj začiatočníci a nevývojári môžu pomocou tohto nástroja zistiť, ako sa vytvára webová stránka a ako každý z jej prvkov spoločne funguje. Ak sa tešíte na používanie možnosti kontroly prvku pri prehliadaní webu na iPhone, tento príspevok by vám mal pomôcť nájsť spôsob, ako to urobiť. 

Súvisiace články: Ako skontrolovať prvok v systéme Android

Môžete kontrolovať webové prvky priamo v Safari?

Jednoduchá odpoveď je nie. Safari v systéme iOS, podobne ako mnoho iných mobilných prehliadačov, vám neponúka natívny nástroj kontroly na prezeranie vývoja webovej stránky. Apple neuvádza dôvod, prečo takáto možnosť neexistuje, ale veríme, že to súvisí s tým, aké malé sú displeje na smartfónoch. Menšia veľkosť displeja môže používateľom sťažiť navigáciu okolo polí, ktoré sú kontrolované, pretože možno budete musieť opatrne umiestniť kurzor, keď chcete upraviť kód webovej stránky alebo ho dokonca nájsť. 

Ďalším dôvodom môže byť nedostatok výpočtového výkonu na smartfónoch. Hoci moderné telefóny iPhone majú dostatočný výkon na spustenie graficky náročných hier, zobraziť informácie o stránke webovej stránky môže byť zložité, pretože nie všetky webové stránky sú vytvorené rovnako. Niektoré webové stránky môžu mať veľa zdrojov a vrstiev, ktoré sú starostlivo vytvorené, aby vyzerali bezproblémovo, no pri kontrole môže načítanie rovnakých zdrojov nejaký čas trvať. 

Súvisiace: Spustiť video na iPhone [Sprievodca]

Kontrola prvku na iPhone: Aké ďalšie možnosti máte?

Aj keď nemôžete natívne používať nástroj „Inspect Element“ v aplikácii Safari v systéme iOS, stále existujú spôsoby, ako toto obmedzenie obísť. Nižšie sú uvedené tri spôsoby, ako môžete skontrolovať prvky webových stránok, ktoré navštívite v Safari na vašom iPhone. 

Metóda #01: Používanie Safari na vašom Macu

Ak okrem iPhonu vlastníte aj zariadenie s macOS, webové stránky môžete stále kontrolovať priamo z aplikácie Safari, ale na Macu. Apple vám umožňuje ladiť webové stránky zo Safari v systéme iOS, ako by ste to robili na Macu pomocou nástrojov „Develop“. Aj keď je proces ladenia stránky relatívne jednoduchý, jej počiatočné nastavenie môže byť zdĺhavejšie, než by ste očakávali. Ale nebojte sa, vysvetlíme vám proces nastavenia tým najjednoduchším možným spôsobom a pomôžeme vám s ľahkosťou skontrolovať stránky po prvom raze. 

Povoľte Web Inspector v systéme iOS

Aby ste mohli ladiť webové prvky, musíte najprv povoliť Web Inspector pre aplikáciu Safari v systéme iOS. Ak to chcete urobiť, otvorte aplikáciu Nastavenia a vyberte „Safari“.

Vo vnútri Safari prejdite nadol a klepnite na „Rozšírené“. 

Na ďalšej obrazovke klepnite na prepínač vedľa položky „Web Inspector“, kým sa nezmení na zeleno. 

Počiatočné nastavenie na Macu

Po úspešnom povolení nástroja Web Inspector pre Safari v systéme iOS je teraz čas vykonať nastavenie na vašom Macu. Na Macu otvorte aplikáciu Safari, kliknite na možnosť „Safari“ na paneli s ponukami a vyberte „Predvoľby“. 

V zobrazenom okne vyberte kartu „Rozšírené“ zhora a začiarknite políčko „Zobraziť ponuku Vývoj v paneli s ponukami“. 

Teraz by ste mali vidieť možnosť „Rozvinúť“ na paneli s ponukami v hornej časti. 

Teraz pomocou kábla USB, ktorý bol dodaný s vaším iPhone, vytvorte spojenie medzi iPhone a Mac. Keď sa váš iPhone pripojí k počítaču Mac, môžete kliknúť na „Rozvinúť“ na paneli s ponukami a zistiť, či sa váš iPhone zobrazuje v zozname zariadení. Ak áno, kliknite na názov zariadenia v tomto zozname. 

Aby ste sa uistili, že môžete prehliadať webové stránky bezdrôtovo bez potreby kábla USB, ako ste to urobili teraz, kliknite na možnosť „Pripojiť cez sieť“, keď sa otvorí ponuka iPhone. 

Teraz môžete svoj iPhone odpojiť od Macu a stále budete môcť kontrolovať webové stránky bez toho, aby ste medzi nimi pripojili kábel. 

Skontrolujte webové stránky z iOS na Macu

Teraz, keď ste povolili 'Connect via Network' v ponuke 'Develop', môžete kontrolovať webové stránky zo Safari na iOS priamo na vašom Macu. Musíte sa len uistiť, že iPhone aj Mac sú pripojené k rovnakej bezdrôtovej sieti, aby ste mohli bezdrôtovo ladiť webové stránky. 

Na tento účel otvorte na svojom iPhone aplikáciu Safari a prejdite na webovú stránku, ktorú chcete skontrolovať. 

Keď je váš iPhone odomknutý a vybratá webová stránka je otvorená, prejdite na Mac a otvorte tam aplikáciu Safari. Tu kliknite na 'Develop' z panela s ponukami a prejdite na 'iPhone'. 

Keď umiestnite kurzor myši na svoj „iPhone“, mali by ste vidieť zoznam webových stránok, ktoré sú otvorené v systéme iOS. V tomto zozname kliknite na webovú stránku, ktorú chcete skontrolovať. 

Na Macu sa načíta nové okno so všetkými informáciami, ktoré je možné skontrolovať z vybranej webovej stránky. 

Kedykoľvek počas kontroly budete môcť vidieť, na ktorú časť stránky ukazuje riadok kódu tak, že na svojom iPhone vyhľadáte modrú oblasť.

Táto modrá oblasť označuje, že kód, na ktorý na Macu umiestnite kurzor, tvorí zvýraznený prvok pre túto konkrétnu webovú stránku. Pohyb medzi rôznymi riadkami kódu presunie toto modré zvýraznenie cez rôzne časti stránky na vašom iPhone v reálnom čase. 

Súvisiace: Ako zachovať efekty vo FaceTime

Metóda #02: Používanie skratiek v systéme iOS 

Ak nevlastníte Mac alebo chcete nahliadnuť na webovú stránku priamo z vášho iPhone, potom vás poteší, že na to slúži aplikácia Skratky pre iOS. Aplikácia Skratky v systéme iOS ponúka množstvo vopred pripravených výberov, ktoré vám umožňujú zobraziť zdrojový kód stránky, upraviť webovú stránku, získať obrázky z webovej lokality a vyhľadať staršie verzie webovej stránky v aplikácii Safari. Bohužiaľ, neexistuje žiadna skratka, ktorá by ponúkala plnohodnotné ladenie webu v systéme iOS, takže budete musieť pridať skratku pre každý z týchto účelov. 

Našli sme nasledujúce skratky, ktoré môžete použiť na vykonanie ladenia na webových stránkach priamo zo systému iOS. Toto sú:

Zobraziť zdrojový kód – Táto skratka vám umožňuje zobraziť zdrojový kód webovej stránky vo formáte základných kostí. 

Upraviť webovú stránku – Táto skratka vám umožňuje upraviť obsah webovej stránky lokálne, aby ste mohli otestovať nový dizajn alebo formát a ako môže vyzerať na vašom iPhone. 

Získať obrázky zo stránky – Hlavným dôvodom na kontrolu stránky môže byť prezeranie obrázkov alebo uloženie tých obrázkov, ktoré sú inak neinteraktívne. Táto skratka zachytí všetky obrázky z určitej webovej stránky a potom ich spoločne zobrazí. Ako ukazuje snímka obrazovky nižšie, môžete si pozrieť každý jeden z 24 obrázkov, ktoré sú hosťované na vybranej webovej stránke. 

Wayback Machine – Táto skratka vás zavedie na Wayback Machine webovej stránky, kde si môžete pozrieť predchádzajúce verzie, ktoré zostávajú uložené v internetovom archíve. 

V závislosti od toho, ako chcete kontrolovať webové stránky v systéme iOS, môžete do svojho iPhone pridať ktorúkoľvek z týchto skratiek kliknutím na príslušné odkazy vyššie alebo ich vyhľadaním v časti Skratky > Galéria. 

Vo výsledkoch vyhľadávania klepnite na skratku, ktorú chcete pridať do iPhone. 

Keď sa otvorí obrazovka s ukážkou, klepnite na možnosť „Pridať miniaplikáciu“ v spodnej časti. 

Všetky skratky sa zobrazia na obrazovke Moje skratky > Všetky skratky a budú dostupné aj na hárku zdieľania Safari.  

Ak chcete skontrolovať webovú stránku, otvorte ju v prehliadači Safari a klepnite na tlačidlo „Zdieľať“ v dolnej časti. 

V zobrazenom hárku Zdieľať prejdite nadol a nájdite skratky, ktoré ste pridali do svojho iPhone. 

Výber 'Upraviť webovú stránku' vám ​​umožní priamo upravovať časti webovej stránky. Keď vyberiete ktorúkoľvek z ďalších troch možností, zobrazí sa výzva, či chcete, aby skratka pristupovala na webovú stránku. Tu klepnite na „Povoliť raz“. 

Súvisiace: Ako pridať WidgetSmith na domovskú obrazovku

Metóda #03: Používanie aplikácií tretích strán

Ak nie ste spokojní s vyššie uvedenými výsledkami, budete musieť preskúmať aplikácie tretích strán, aby ste mohli kontrolovať prvky webovej stránky. Podobne ako v Safari nenájdete spôsob, ako skontrolovať webovú stránku v najpopulárnejších webových prehliadačoch (Chrome, Firefox, Brave atď.). Namiesto toho sa budete musieť spoľahnúť na aplikáciu, ktorá bola vytvorená na vykonanie tejto konkrétnej úlohy, a takéto aplikácie môže byť ťažké nájsť.

Zatiaľ čo jednoduché vyhľadávanie v App Store vám prinesie niekoľko výsledkov na kontrolu webových prvkov, nenájdete toľko aplikácií, ktoré sú dostupné zadarmo a sú vysoko hodnotené. Na základe spätnej väzby od používateľov vám odporúčame nainštalovať aplikácie Inspect Browser alebo Gear Browser  z App Store, ktoré poskytujú kontrolu a úpravu prvkov v JavaScripte, CSS a HTML. 

To je všetko, čo potrebujete vedieť o kontrole prvkov na iPhone. 

SÚVISIACE

• Ako prilepiť na iPhone bez držania
• Ako zanechať skupinový text na iMessage a čo sa stane
• Ako nájsť Airtags, ktoré vás sledujú
• 30 nezvyčajných trikov pre iOS 15, ktoré by ste mali vedieť
• Ako nastaviť náhodnú tapetu bez opakovania na iPhone