Odkazy v HTML

Tag <a> - Href - URL - Protokoly - Relativní odkazy - Kořenové adresy - Jiné formáty souborů - Nové okno a cílový rám

Názor kocoura Ajčiho

Tag <a>

Text, který slouží jako odkaz, je obalen párovým tagem <a>:

<a>Text odkazu</a>

Aby to klikalo, musí tam být navíc ještě href:

Href=

Tag <a> má důležitý atribut "href", totiž cíl. Href obsahuje adresu, podle které prohlížeč pozná, na jakou stránku se má přepnout, když se na odkaz klikne.

<a href="http://www.seznam.cz">Seznam</a>

Toto je odkaz na Seznam, hodnotou "href" je adresa "http://www.seznam.cz". Zobrazí se takto: Seznam

Jiný příklad:

Zobrazí se takto:

Jak psát web

Když se odkazuje na cizí stránky, musí se tam dávat to http:// nebo https:// ?

Jo.

URL

Adrese se také říká URL. Znamená to Unique Resource Locator, čili jednoznačné umístění zdroje. Používá se nejenom u odkazů, ale i při vkládání obrázků, CSS souborů, objektů, prostě různých souborů.

Například "http://www.seznam.cz" je URL Seznamu.

Pokud vás nezajímá teorie jeho složení, pokračujte čtení u relativního odkazu.

Složení URL

URL lze symbolicky zapsat takto:

protokol://server.doména.generická-
doména:port/cesta/soubor?dotaz#kotva

Zjednodušeně: protokol://server.doména.generická-doména/cesta/soubor

Příklady:

odkaz	protokol	server	doména	gen. doména	cesta	soubor
http://www.seznam.cz	http:	www	seznam	cz	není	není
http://dusan.pc-slany.cz/internet/default.htm	http:	dusan	pc-slany	cz	internet	default.htm
http://www.jakpsatweb.cz/odkazy_html.htm	http:	www	jakpsatweb	cz	není	odkazy_html.htm

URL se vyplňuje do atributu href tagu a. Symbolicky zapsáno:

<a href="URL">Odkaz</a>

Protokoly

Protokolům se někdy také říká "schémata". Protokolem je míněn způsob, jakým se prohlížeč pokusí dosáhnout cíle odkazu.

HTTP:

Základním protokolem používaným na www stránkách je HTTP. HyperText Transfer Protocol. Málokdy se setkáte s něčím jiným. Většina URL začíná řetězcem "http://". Moderní prohlížeče při ťukání adresy dokonce http:// předřazují automaticky. To ale neznamená, že by se to http:// mohlo vypouštět při zápisu odkazů do html stránek. (Pak by si prohlížeč myslel, že je to relativní adresa.)

FTP:

Protokol pro přenos souborů je FTP -- File Transfer Protocol. Odkazují se jím soubory umístěné na FTP serverech. Pokud se s takovým odkazem prohlížeč potká, pokusí se spustit nějakého FTP klienta (některé prohlížeče jej mají zabudovaný) a předat mu požadavek na stažení souboru. Formát adresy je ftp://uživatel@server/cesta/soubor, například ftp://ftp.pc-slany.cz je odkaz pro anonymní připojení k ftp serveru. (Které je mimochodem zakázáno. Anonymní znamená bez jména uživatele; uživatelský přístup vyžaduje heslo.)

HTTPS:

Protokol pro bezpečné předávání http údajů zašifrovaným připojením. Https stránky se píšou také HTML jazykem a používají stejný typ formátování, skripty a všechno, pouze server s klientem spolu komunikují jiným protokolem.

FILE:

Svůj vlastní disk můžete odkazovat pomocí pseudoprotokolu FILE. Na Internetu je nepoužitelný. Většina prohlížečů si jej domyslí, když vidí v adrese písmenko:/ . Zajímavé je, že za file: jsou tři lomítka -- např. file:///C:/dokumenty/soubor.htm .

MAILTO:

Protokol mailto: se používá na odkazování e-mailových adres. Formát je mailto:elektronická adresa. Např. <a href="mailto:dusan@pc-slany.cz">Napište mi!</a> . Pokud se prohlížeč potká s takovou věcí, spustí poštovní program a předá mu adresu jako parametr. Více v textu o mailových adresách.

A další...

Existují ještě další protokoly (např. Gopher, News), které se ale při psaní webových stránek použijí tak zřídka, že si nejsem zdaleka jistý jejich správnou funkcí.

Zkuste si také zadat do adresy view-source:http://www.jakpsatweb.cz Měl by se zobrazit zdrojový kód zadané stránky. Za view-source: se musí uvádět absolutní adresa (nelze relativní). Funguje to jenom v některých prohlížečích.

Když už jsem u pseudoprotokolů, tak bych měl zmínit about:. Existuje výjimečná hodnota about:blank, která zobrazuje úplně prázdnou stránku. Dříve fungovaly i další hodnoty za about:, používal to hlavně Explorer. V Internet Exploreru si občas lze všimnout divných protokolů, jako třeba search: a podobně. Nic o tom nevím. Další pseudoprotokol je třeba chrome:, kterou používá prohlížeč Chrome k zobrazení svého nastavení.

Pseudoprotokol javascript: se dá použít u odkazů, které mají provést nějakou akci. Je to naprosto nevýhodné na odkazy, ale třeba bookmarklety se tím dělají perfektně.

Relativní odkazy

Pokud adresa odkazu (URL) nezačíná protokolem, prohlížeč ví, že se jedná o "relativní odkaz". Myšlenka relativních odkazů využívá faktu, že většina odkazů míří na stejný server nebo dokonce do stejného adresáře (složky). Proto se do relativní adresy píše zpravidla jenom jméno souboru -- prohlížeč ví, že ho má hledat ve stejném adresáři.

Jinými slovy, prohlížeč si před relativní odkaz přidá URL předchozí stránky bez jména souboru.

Je-li odkazovaný soubor v jiném blízkém adresáři (složce), tak se do relativní adresy před jméno souboru přidá cesta. Zápis nadřazeného adresáře se dělá standardně dvěma tečkami.

Příklad

Mám 3 stránky na serveru www.xyz.cz. V tabulce uvádím jejich absolutní adresy (s protokolem http://) a vzájemné relativní adresy.

absolutní adresa	relativní adresa z:
absolutní adresa	index.html	slozka/1.html	slozka/2.html
http://www.xyz.cz/index.html	index.html	../index.html	../index.html
http://www.xyz.cz/slozka/1.html	slozka/1.html	1.html	1.html
http://www.xyz.cz/slozka/2.html	slozka/2.html	2.html	2.html

Pokud vám tato tabulka přijde nepřehledná, napište mi prosím, já ji předělám.

Zápis relativní adresy se dělá normálně. Třeba ze stránky 1.html na stránku 2.html:

<a href="2.html">Druhá stránka</a>

Kořenové adresy

Něco mezi absolutními a relativními adresami jsou adresy beroucí za základ kořen dokumentů zvaný též root (čti [růt]:-). Takové adresy začínají lomítkem. Například adresa

href="/kontakt.html"

míří na soubor kontakt.html, který leží na témže serveru, jako stránka, která odkaz obsahuje, ale v rootu. Kdyby stránka ležela kdekoliv na serveru www.xyz.cz, tak odkaz "/kontakt.html" bude mířit na soubor www.xyz.cz/kontakt.html. Kdyby ale stránka s odkazem ležela třeba na serveru www.seznam.cz, tak naprosto stejně zapsaný odkaz "/kontakt.html" povede nyní na soubor www.seznam.cz/kontakt.html.

Adresa s lomítkem na začátku tedy není ani odkazem relativním (protože nezáleží, ze které stránky na serveru vede) ani odkazem absolutním (protože posílá dotaz vždy na tentýž server).

Pokud vám teorie kořenových adres připadá zbytečná, pusťte to z hlavy. Já jsem myslím kořenovou adresu použil v životě jen dvakrát, takže se to skoro k ničemu. Ale je dobré vědět, že to existuje.

Jiné formáty souborů

Soubory typu htm a html se otevírají normálně v prohlížeči. Stejně tak serverově generované stránky .asp, .php (php3, phtml), .shtml, .jsp.

Ke každému dalšímu typu souborů (chápe se to podle přípony) má prohlížeč určený program, jimž se otevírá. Ve Windows se to nastavení přebírá z asociací operačního systému. Tak například textový soubor se otevírá v Notepadu.

Když nasměrujete odkaz na soubor (do href normálně napíšete URL na soubor.xxx), tak se ten asociovaný program spustí. Před tím se uživatele obvykle zeptá, zda se má otevřít z aktuálního umístění, nebo uložit na disk (z bezpečnostních důvodů). Existují druhy souborů, u kterých se prohlížeč neptá -- třeba obrázky nebo prostý text.

Například odkaz na stažení zip archivu se do HTML napíše třeba takto: <a href="archiv.zip">Stažení archivu</a>.

Velmi často se takto přímo odkazují obrázky typu jpg. Například toto je odkaz na soubor fotografie.jpg, která leží v adresáři fotky: <a href="fotky/fotografie.jpg">

Stažení souboru

U některých souborů se objevuje dialog "otevřít nebo uložit", případně se rovnou zařadí do fronty ke stažení. Jestli se to objeví nebo ne závisí plně na nastavení asociací a prohlížeče v počítači uživatele.

Pokud chcete, aby se uživateli objevila výzva "otevřít nebo uložit" nebo aby se soubor začal rovnou stahovat, existuje na to relativně nový atribut download.

<a href="soubory/navod.pdf" download="Návod.pdf">Stáhněte si návod v pdf</a>

Přítomnost atributu download vyvolá stahování souboru, který je uvedený v hodnotě href. Hodnotou je hezké jméno souboru, pod kterým se má soubor v uživatelově počítači uložit. Funguje to ve všech prohlížečích kromě Internet Exploreru až do verze 11, ale těch už je naštěstí málo (Edge to už umí).

Nová karta a cílový rám

V odkazu se dá určit, v jakém rámu nebo kartě se otevře. K tomu slouží atribut target. Když napíšu třeba

<a href="http://www.seznam.cz" target="_blank">Seznam</a>,

otevře se po kliknutí Seznam v nové kartě (v novém tabu, oušku, okně, záložce - terminologie je neustálená). Slovo "_blank" je pevně dané a znamená prázdnou novou kartu prohlížeče. Jako hodnota target se může použít jakékoliv jiné jméno (name) rámu, pokud používáte rámy (což nedoporučuji). Více o nových oknech.

Nové okno bez lišt a bez nabídky

Musí se použít javascript. Např.

<a href="http://www.seznam.cz" onclick="window.open('http://www.seznam.cz','ramecek','width=600,height=500,toolbar=0'); return false">Seznam do nového okénka</a>

Vysvětlení příkladu a další možnosti příkazu window.open() najdete v učebnici javascriptu.

Více o nových oknech.

Reklama

www.webhosting-c4.cz, extra rychlý SSD webhosting s doménou v ceně