Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

V případě, že to nevíte, webová stránka se skládá z mnoha prvků, které jsou naformátovány tak, aby vypadaly jako jedna jediná entita. Weboví vývojáři musí porozumět každému z těchto prvků, jak jsou rozmístěny na webové stránce, a vidět, jak každý z nich funguje samostatně.

Uživatelé Windows a Mac budou znát možnost „Prozkoumat“ nebo „Zkontrolovat prvek“, která je dostupná po kliknutí pravým tlačítkem na jakoukoli webovou stránku. Tato možnost nabízí způsob, jak zobrazit zdrojový kód webu, zobrazit všechny jeho prvky, řádek kódu za každým z nich a upravit jeho Javascript, HTML, CSS a všechny ostatní mediální soubory, které se na něm nacházejí. Tímto způsobem se nejen dozvíte, jak konkrétní web funguje a funguje, ale můžete na něm provádět úpravy ve svém vlastním prohlížeči, aniž by to ovlivnilo aktuální webovou stránku. 

I když je o možnosti inspect známo, že je to „vývojářský“ nástroj, těží z toho nejen vývojáři. Dokonce i začátečníci a nevývojáři mohou tento nástroj použít k tomu, aby se naučili, jak se vytváří web a jak každý z jeho prvků společně funguje. Pokud se těšíte na používání možnosti inspect element při procházení webu na iPhonu, tento příspěvek by vám měl pomoci najít způsob, jak toho dosáhnout. 

Související: Jak zkontrolovat prvek na Androidu

Můžete zkontrolovat webové prvky přímo v Safari?

Jednoduchá odpověď je ne. Safari na iOS, stejně jako mnoho jiných mobilních prohlížečů, vám nenabízí nativní kontrolní nástroj pro zobrazení vývoje webové stránky. Apple neuvádí důvod, proč taková možnost neexistuje, ale věříme, že to souvisí s tím, jak malé displeje jsou na chytrých telefonech. Menší velikost zobrazení může uživatelům ztížit orientaci v polích, která jsou kontrolována, protože možná budete muset opatrně umístit kurzor, když chcete upravit kód webové stránky nebo jej dokonce najít. 

Dalším důvodem může být nedostatek výpočetního výkonu na chytrých telefonech. Přestože moderní telefony iPhone mají dostatek výkonu ke spouštění graficky náročných her, zobrazit informace o stránce webu může být složité, protože ne všechny weby jsou vytvořeny stejně. Některé webové stránky mohou mít mnoho zdrojů a vrstev, které jsou pečlivě vytvořeny, aby vypadaly bezproblémově, ale načtení stejných zdrojů může při kontrole nějakou dobu trvat. 

Související: Spuštění videa na iPhone [Průvodce]

Inspect Element na iPhone: Jaké další možnosti máte?

I když nemůžete nativně používat nástroj „Inspect Element“ v aplikaci Safari na iOS, stále existují způsoby, jak toto omezení obejít. Níže jsou uvedeny tři způsoby, jak můžete zkontrolovat prvky webových stránek, které navštívíte v Safari na vašem iPhone. 

Metoda #01: Použití Safari na vašem Macu

Pokud kromě iPhonu vlastníte i zařízení s macOS, můžete stále prohlížet webové stránky přímo z aplikace Safari, ale na Macu. Apple vám umožňuje ladit webové stránky ze Safari na iOS, jako byste to dělali na Macu pomocí svých nástrojů „Develop“. Zatímco proces ladění webu je relativně jednoduchý, jeho počáteční nastavení může být zdlouhavější, než byste očekávali. Ale nebojte se, vysvětlíme vám proces nastavení tím nejjednodušším možným způsobem a pomůžeme vám snadno zkontrolovat stránky hned po prvním použití. 

Povolte Web Inspector na iOS

Abyste mohli ladit webové prvky, musíte nejprve povolit Web Inspector pro aplikaci Safari na iOS. Chcete-li to provést, otevřete aplikaci Nastavení a vyberte „Safari“.

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

V Safari přejděte dolů a klepněte na „Pokročilé“. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Na další obrazovce klepněte na přepínač vedle položky „Webový inspektor“, dokud se nerozsvítí zeleně. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Počáteční nastavení na Macu

Jakmile úspěšně povolíte Web Inspector pro Safari na iOS, je nyní čas provést nastavení na vašem Macu. Na Macu otevřete aplikaci Safari, klikněte na možnost „Safari“ na liště nabídek a vyberte „Předvolby“. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

V okně, které se objeví, vyberte kartu 'Pokročilé' shora a zaškrtněte políčko 'Zobrazit nabídku Develop in menu bar'. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Nyní byste měli vidět možnost 'Vývoj', která se objeví na liště nabídek v horní části. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Nyní pomocí kabelu USB dodaného s iPhonem vytvořte spojení mezi iPhone a Mac. Když se váš iPhone připojí k Macu, můžete kliknout na 'Develop' na liště nabídek a zjistit, zda se váš iPhone objeví v seznamu zařízení. Pokud ano, klikněte na název zařízení z tohoto seznamu. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Abyste se ujistili, že můžete prohlížet webové stránky bezdrátově, aniž byste potřebovali kabel USB, jako jste to udělali právě teď, klikněte po otevření nabídky iPhone na možnost „Připojit přes síť“. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Nyní můžete svůj iPhone odpojit od Macu a stále budete moci prohlížet webové stránky, aniž byste mezi nimi připojovali kabel. 

Prohlédněte si webové stránky z iOS na Macu

Nyní, když jste povolili 'Připojit přes síť' v nabídce 'Vývoj', můžete prohlížet webové stránky ze Safari na iOS přímo na vašem Macu. Jen se musíte ujistit, že iPhone i Mac jsou připojeny ke stejné bezdrátové síti, abyste mohli bezdrátově ladit webové stránky. 

Za tímto účelem otevřete na svém iPhone aplikaci Safari a přejděte na webovou stránku, kterou chcete zkontrolovat. 

S odemčeným iPhonem a otevřenou vybranou webovou stránkou přejděte na Mac a otevřete tam aplikaci Safari. Zde klikněte na 'Develop' na liště nabídek a přejděte na 'iPhone'. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Když umístíte kurzor na svůj „iPhone“, měli byste vidět seznam webových stránek, které jsou otevřené na iOS. V tomto seznamu klikněte na webovou stránku, kterou chcete zkontrolovat. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Na Macu se načte nové okno se všemi informacemi, které lze z vybrané webové stránky zkontrolovat. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Kdykoli během kontroly budete moci zjistit, na kterou část stránky ukazuje řádek kódu, když na svém iPhonu vyhledáte modrou oblast.

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Tato modrá oblast označuje, že kód, na který na Macu umístíte kurzor, tvoří zvýrazněný prvek pro tuto konkrétní webovou stránku. Pohybem mezi různými řádky kódu se toto modré zvýraznění přesune přes různé části stránky na vašem iPhone v reálném čase. 

Související: Jak zachovat efekty ve FaceTime

Metoda #02: Použití zkratek v systému iOS 

Pokud nevlastníte Mac nebo chcete nahlédnout na web přímo ze svého iPhonu, pak vás potěší, že k tomu slouží aplikace Zkratky pro iOS. Aplikace Zkratky pro iOS nabízí spoustu předem připravených výběrů, které vám umožní zobrazit zdrojový kód stránky, upravit webovou stránku, získat obrázky z webu a vyhledat starší verze webové stránky z aplikace Safari. Bohužel neexistuje jediný zástupce, který by na iOS nabízel plnohodnotné ladění webu, takže pro každý z těchto účelů budete muset přidat zástupce. 

Našli jsme následující zkratky, které můžete použít k ladění na webech přímo z iOS. Tyto jsou:

Zobrazit zdroj – Tato zkratka vám umožňuje zobrazit zdrojový kód webové stránky ve formátu základní kosti. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Upravit webovou stránku – Tato zkratka vám umožňuje lokálně upravit obsah webové stránky, abyste mohli otestovat nový design nebo formát a jak může vypadat na vašem iPhone. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Získat obrázky ze stránky – Primárním důvodem ke kontrole stránky může být prohlédnutí obrázků nebo uložení těch, které jsou jinak neinteraktivní. Tato zkratka zachytí všechny obrázky z určité webové stránky a poté je společně zobrazí náhled. Jak ukazuje snímek obrazovky níže, můžete si prohlédnout každý jeden z 24 obrázků, které jsou hostovány na vybrané webové stránce. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Wayback Machine – Tato zkratka vás zavede na Wayback Machine webové stránky, kde můžete vidět její předchozí verze, které zůstávají uložené v internetovém archivu. 

V závislosti na tom, jak chcete prohlížet webové stránky v systému iOS, můžete do svého iPhone přidat kteroukoli z těchto zkratek buď kliknutím na příslušné odkazy výše, nebo jejich vyhledáním v části Zkratky > Galerie. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Ve výsledcích vyhledávání klepněte na zkratku, kterou chcete přidat do iPhone. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Když se otevře obrazovka náhledu, klepněte na možnost „Přidat widget“ ve spodní části. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Všechny zkratky se zobrazí na obrazovce Moje zkratky > Všechny zkratky a budou také přístupné na listu Sdílení Safari.  

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Chcete-li zkontrolovat webovou stránku, otevřete ji v prohlížeči Safari a klepněte na tlačítko „Sdílet“ ve spodní části. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

V zobrazeném listu Sdílení přejděte dolů a najděte zkratky, které jste přidali do svého iPhone. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Výběr 'Upravit webovou stránku' vám ​​přímo umožní upravovat části webové stránky. Když vyberete kteroukoli z dalších tří možností, budete dotázáni, zda chcete, aby zástupce přistupoval na webovou stránku. Zde klepněte na „Povolit jednou“. 

Jak zkontrolovat prvek na iPhone: Vše, co potřebujete vědět

Související: Jak přidat WidgetSmith na domovskou obrazovku

Metoda #03: Použití aplikací třetích stran

Pokud nejste spokojeni s výše uvedenými výsledky, budete muset prozkoumat aplikace třetích stran, abyste mohli zkontrolovat prvky webové stránky. Podobně jako v Safari nenajdete způsob, jak zkontrolovat webovou stránku v nejpopulárnějších webových prohlížečích (Chrome, Firefox, Brave atd.). Místo toho se budete muset spolehnout na aplikaci, která byla vytvořena k provedení tohoto konkrétního úkolu, a takové aplikace může být těžké najít.

Zatímco jednoduché vyhledávání v App Store vám přinese několik výsledků pro kontrolu webových prvků, nenajdete tolik aplikací, které jsou dostupné zdarma a jsou vysoce hodnoceny. Na základě zpětné vazby od uživatelů vám doporučujeme nainstalovat aplikace Inspect Browser nebo Gear Browser  z App Store, které umožňují kontrolu a úpravy prvků v JavaScriptu, CSS a HTML. 

To je vše, co potřebujete vědět o kontrole prvků na iPhonu. 

PŘÍBUZNÝ


Uzamčená složka Fotek Google: Podrobný průvodce nastavením, přidáním fotek, přesunem fotek a dalšími

Uzamčená složka Fotek Google: Podrobný průvodce nastavením, přidáním fotek, přesunem fotek a dalšími

Uzamčená složka Fotek Google: Podrobný průvodce nastavením, přidáním fotek, přesunem fotek a dalšími.

Jak rychle vytvořit anketu na Skype

Jak rychle vytvořit anketu na Skype

Rychle vytvořte Skype anketu, abyste ukončili jakoukoli diskusi. Podívejte se, jak snadné je vytváření anket na Skype.

Oprava Discord nemůže přistupovat k fotoaparátu

Oprava Discord nemůže přistupovat k fotoaparátu

Pokud Discord nemá přístup k vaší kameře, zde naleznete efektivní řešení, jak problém rychle vyřešit.

Jak vybarvit v Procreate

Jak vybarvit v Procreate

Naučte se, jak vybarvit v Procreate s jednoduchým průvodcem, který obsahuje tipy, triky a techniky pro efektivní digitální umění.

Co jsou soubory AAE a jak je otevřít nebo převést

Co jsou soubory AAE a jak je otevřít nebo převést

Pokud jste někdy obdrželi e-mail s přílohou souboru AAE, abyste zjistili, že váš počítač neví, co s ním dělat, nejste sami. Se soubory AAE může být obtížné pracovat, ale tato příručka vám pomůže pochopit, co to je a jak je otevřít.

5 nejčastějších problémů PS4 spolu s jejich rychlými opravami

5 nejčastějších problémů PS4 spolu s jejich rychlými opravami

Objevte 5 nejčastějších problémů PS4 a jejich efektivní řešení, která zlepší váš herní zážitek na PlayStationu.

Jak zrychlit stahování PS4

Jak zrychlit stahování PS4

Zlepšete rychlost stahování na PlayStation 4 s našimi efektivními tipy a triky, které vám pomohou optimalizovat vaše připojení a užít si hry bez zbytečných prodlev.

Jak zabránit Facebooku v oznamování mých narozenin

Jak zabránit Facebooku v oznamování mých narozenin

Naučte se, jak skrýt své narozeniny na Facebooku a zabránit tak jeho oznámením ostatním uživatelům.

Jak funguje Snap Score: Naučte se tajemství Snapchat Score

Jak funguje Snap Score: Naučte se tajemství Snapchat Score

Snap skóre vám pomůže dosáhnout vyšší pozice a získat popularitu ve vesmíru Snapchat. Chcete se dozvědět, jak funguje snap score? Přečtěte si to hned!

Jaké streamovací služby můžete použít na Nintendo Switch?

Jaké streamovací služby můžete použít na Nintendo Switch?

Hledáte streamovací služby pro Nintendo Switch? Zjistěte, jaké aplikace můžete použít pro sledování oblíbených pořadů a filmů na této herní konzoli.