Určování cest jsou ústředním prvkem ve webovém vývoji. Umožňují ti správně odkazovat a začleňovat různé zdroje, jako jsou HTML dokumenty, CSS soubory nebo obrázky. V tomto tutoriálu se dozvíš základní rozdíly mezi relativními a absolutními určeními cest a jak je efektivně používat ve svých projektech.
Nejdůležitější poznatky
- Absolutní určení cest vždy začíná lomítkem a odkazuje na kořen serveru.
- Relativní určení cest vychází z aktuální polohy v souborovém systému a umožňuje odkazy v rámci projektu.
- Pochopení těchto konceptů je klíčové pro vytváření funkčních webových stránek.
Po krokové instrukce
1. Pochopení základů určení cest
Než se ponoříš do detailů určení cest, je důležité pochopit obecný koncept. Na webu existují dva typy určení cest: relativní a absolutní. Obě jsou nezbytné pro různé případy použití, ať už při odkazování na dokumenty nebo při zařazování médií.

2. Nastavení místního vývojového prostředí
Abychom mohli cesty efektivně testovat, můžeš vytvořit jednoduchý HTML soubor. Webový server není nutný, ale můžeš ho použít, abys strukturu lépe zobrazil. Například můžeš vytvořit soubor s názvem fade.html na svém desktopu. Dvojitým kliknutím na soubor ho otevřeš ve svém prohlížeči.

3. Rozdíl mezi místními a externími cestami
U místních cest, jako je localhost, se jedná o tvůj vlastní počítač, na kterém server běží. Můžeš také použít doménu jako www.example.com. Nejdůležitější je pochopit, že localhost odkazuje na tvůj vlastní počítač, zatímco domény odkazují na externí servery.
4. Používání absolutních určení cest
Absolutní určení cest jsou obzvlášť užitečná, když chceš přistupovat k prostředku z kořene serveru. Vždy začínají lomítkem (/) a udávají úplnou cestu. To znamená, že absolutní určení cesty jako /HTML-Basics/7-fadangaben/fade.html ukazuje, že tento soubor se nachází ve složce HTML-Basics.
5. Pochopení relativních určení cest
Relativní určení cest se vždy vztahují na aktuální polohu ve složce. Tento typ určení je užitečný, když chceš navigovat v rámci projektu. Například můžeš jednoduše použít název souboru, když se soubor nachází ve stejné složce.
6. Použití tečky-tečky pro vyšší složky
Kromě toho můžeš pomocí.. (tečka-tečka) navigovat o úroveň výše. To je často používaný trik ve webovém vývoji, jak rychle přecházet mezi složkami. Když jsi ve složce 7-fadangaben a chceš otevřít soubor z nadřazené složky, použiješ../ následované názvem souboru.
7. Kombinace relativních a absolutních cest
Občas potřebuješ kombinaci obou typů cest. Například může být rozumné navigovat v rámci subfolderů ve svém projektu, zatímco pro externí odkazy odkazuješ absolutně. Tak zůstává struktura jasná a tvé odkazy vždy spolehlivě fungují.
8. Propojení konceptů
Se základními znalostmi na paměti můžeš vytvářet jasné a funkční odkazy ve svých HTML dokumentech. Pochopení, jak formulovat realistická a smysluplná určení cest, pozitivně ovlivní vývoj tvých webových stránek.

Shrnutí – Základy určení cest v HTML, CSS a JavaScriptu
Určení cest jsou nezbytná pro práci na webových projektech. Znalosti o absolutních a relativních určeních cest jsou klíčové pro efektivní odkazování a využívání zdrojů. Ať už vkládáš obrázky nebo vytváříš externí odkazy – jasná struktura v tvé hierarchii souborů usnadňuje práci a zvyšuje efektivitu.
Často kladené otázky
Jak začnu s absolutními určeními cest?Absolutní určení cest vždy začínají lomítkem (/) a vedou od kořene serveru k souboru.
Jaký je rozdíl mezi relativními a absolutními určeními cest?Relativní určení cest se vztahují na aktuální polohu, zatímco absolutní určení cest udávají přesnou polohu v souborovém systému.
Kdy bych měl použít tečku-tečku?Tečka-tečka (..) se používá k navigaci o jednu úroveň výše v adresáři.
Mohou být obě typy cest použity ve stejném projektu?Ano, často má smysl používat jak relativní, tak absolutní cesty pro různé účely.
Jak testuji svá určení cest?Můžeš vytvořit jednoduché HTML soubory lokálně a testovat cesty přes prohlížeč, abys zajistil, že všechno je správně propojeno.