Internet dnes používá téměř každý. Lidé na internetu hledají mnoho informací. Může to být cokoli. Například popis nějaké služby nebo stránky restaurace, kde si můžete objednat jídlo, nebo jen zpravodajské stránky, kde se dozvíte nejnovější zprávy.
V každém z těchto případů si lidé vybírají ty webové stránky, které jsou nejatraktivnější z hlediska pohodlí a krásy. Aby byly vaše stránky úspěšné a začaly dobře fungovat, musí být stylové a funkční. Důležité také je, aby nebyla nepřehledná a rychle se načítala.
To vše závisí na tom, jak je web navržen a jaké technologie jsou na něm použity. Obecně se má za to, že programování je obtížné. Jakmile však pochopíte základy, můžete pochopit, jak váš web funguje a jak ho můžete změnit.
Moderní prohlížeče mají funkci kontroly prvků, která umožňuje rychlé zobrazení kódu webu. Tato funkce je k dispozici také v systému Mac.
Proč byste se měli naučit používat funkci Inspect Element
Jedná se o základní funkci při vývoji webových stránek. S její pomocí vývojáři kontrolují výkonnost webových stránek. Slouží k ladění a testování stránek na internetu. Mezi dalšími způsoby využití této funkce lze rozlišit 4 směry:
- Vývojáři tuto funkci používají k vývoji webových stránek, jejich testování a provádění změn.
- Designéři si pomocí něj mohou zkontrolovat, jak vypadají jejich rozvržení, nebo převzít rozvržení z jiného webu.
- Marketéři ji mohou použít ke změně textu online nebo ke kontrole služby Google Analytics.
- Agenti podpory se mohou připojit k inspektoru prvků, aby mohli vývojářům předat správné informace o chybách nahlášených uživateli webu.
Můžeme také říci, že pokud jste majitelem firmy, bylo by užitečné se s touto funkcí seznámit, abyste pochopili, jak vaše webové stránky fungují a jaké budoucí úkoly lze vývojářům zadat.
Jak kontrolovat prvek v počítači Mac v různých prohlížečích
Ve skutečnosti není těžké aktivovat funkci Inspect Element. Můžete to udělat doslova několika kliknutími v kterémkoli z prohlížečů. Chcete-li to provést, musíte:
Safari
Zpočátku se může zdát, že tato funkce funguje v Safari hůře než v jiných prohlížečích. Ve skutečnosti je její aktivace snadná. Potřebujete k tomu:
- Spusťte Safari.
- Přejděte do nabídky Předvolby (⌘ + ,).
- Klikněte na kartu Upřesnit.
- Zaškrtněte políčko „Zobrazit nabídku Vyvolat na panelu nabídek“.
- Pak budete mít přístup k nástrojům pro vývojáře v nabídce
- Dále potřebujete funkci Zobrazit zdroj stránky (Option + ⌘ + U).
- A kliknutím na položku Prvky zobrazíte kód webu.
Když pak na prvek najedete kurzorem, bude zvýrazněn. Pokud chcete otevřít možnost Safari Inspect Element (Prohlížet prvek) v určité části stránky, můžete na ni kliknout pravým tlačítkem myši a vybrat možnost Inspect Element (Prohlížet prvek).
Firefox
Fungují stejně, ale mají již zapnutý prvek Inspect.
Klávesová zkratka pro kontrolu prvku ve Firefoxu je Option + ⌘ + I a můžete také kliknout pravým tlačítkem myši na libovolný prvek a zkontrolovat jej.
Chrome
Tuto funkci najdete v nabídce Zobrazit ➙ Vývojář na panelu nabídek nebo pomocí klávesové zkratky Option + ⌘ + I. Stejným způsobem můžete kontrolu položek použít i v prohlížeči Chrome, a to jednoduše kliknutím pravým tlačítkem myši na libovolnou část webové stránky.
Jak provádět změny na webu pomocí prvku Inspect
Pomocí této funkce můžete na webu provádět rychlé změny. K tomu je třeba povolit možnosti Inspect Element a doslova upravit libovolnou část HTML nebo CSS.
Stejné kroky je třeba zopakovat ve všech prohlížečích. Chcete-li provést změny na úvodní stránce, musíte:
- Klikněte pravým tlačítkem myši na požadovaný prvek a klikněte na možnost Inspect Element.
- Poté dvakrát klikněte na text v kódu a zpřístupněte jej k úpravám.
- Nyní můžete provádět úpravy kódu.
- Po provedení všech úprav stiskněte klávesu Enter.
Obrázek nebo animaci můžete změnit na libovolné webové stránce – stačí nahradit adresu URL starého obrázku adresou URL nového obrázku nebo GIFu.
Můžete také provádět změny v CSS, například měnit barvy nebo velikosti písma.
