HTML/Odkazy

Odkazy jsou jedním ze základních kamenů hypertextu. Celý je na nich založen. Dělají internet internetem. Celý je založený na odkazování (I když původně odkaz nebyl znám). Někdy se používá označení link přejaté z angličtiny.

Pomocí tagu <a> se tvoří.

<a href="http://www.example.org" title="Příklad" target="_blank">Example.org</a>

Jeho strukturu jsme si popsali již v Lekci 1, tudíž ji tu už nebudu znovu popisovat. Zastavíme se pouze u relativní a absolutní adresy.

To je taková adresa, která je vidět v prohlížeči na řádce s adresou. Je to tedy plná adresa. Musí se používat při odkazech na cizí stránky. V použitém příkladu zdrojového kódu ji najdete jako hodnotu u atributy href.

Relativní adresa je pouze část adresy. Ta se vyplatí používat na svých vlastních stránkách. Jednak je kratší a uspoří pár bajtů a navíc je to užitečné pokud stránku přesunete na jinou adresu (doménu).

<a href="druha_stranka.html">Moje druhá stránka</a>

Jak to tedy funguje? Pokud máte stránku s uvedeným odkazem např. na http://www.example.org v adresáři technika, tak odkaz na stránce bude odkazovat na http://www.example.org/technika/druha_stranka.html.

Pokud byste chtěli odkázat o adresář výše, tak byste museli použít toto:

<a href="../druha_stranka.html">Moje druhá stránka</a>

Tudíž dvě tečky s lomítkem (../) způsobí, že odkaz bude odkazovat o adresář výše na http://www.example.org/druha_stranka.html . V adrese by se neměly užívat žádné mezery (ty je potřeba nahradit pomocí %20) a ani žádná diakritika.

Další možností, pokud nepoužijete standardní internetový protokol http://, přes který normálně běží webové stránky, je použití některého z jiných protokolů.

Zabezpečený internetový protokol.

Slouží pro přenos souborů.

Slouží pro zobrazení souborů z disků počítače. Např.: file:///C:/Dokumenty/stranka.htm.

Slouží pro otevření prázdného okna.

Pseudoprotokol pro posílání e-mailů po kliknutí na něj.

<a href="mailto:uzivatel@wiki.org">mail</a>

Po kliknutí na odkaz z uvedeného příkladu se otevře e-mailový klient s oknem editoru nové zprávy pro uzivatel@wiki.org.

Pseudoprotokol sloužící pro vytočení kontaktu ze skype.

Pseudoprotokoly, s kterými se můžete setkat na mobilních telefonech. Slouží k poslání SMS, MMS, volání na uvedené číslo.

Tímto výčet rozhodně nekončí. Existuje ještě daleko více (pseudo)protokolů. Namátkou můžeme jmenovat NNTP, IRC, Telnet nebo například odkazy pro torrenty nebo DC.

Nyní se vrátím k atributu title. Text v něm obsažený se nedá formátovat žádným formátováním používaným v HTML a ani žádným jiným. Pořád to bude text v žluté bublině nad odkazem. Dokonce se nedá v něm ani zalomit řádek.

Teď se vrátím k atributu target. Říká v okně s jakým názvem se otevře nová stránka, což se hodí zejména při práci s rámy. Některá jména oken prohlížeče jsou již rezervované pro určité akce a to platí pro:

_blank

otevře nové okno

_self

otevře stránku ve stejném rámu

_parent

otevře stránku v nadřezeném rámu

_top

otevře stránku v celém okně

Udělá se tak, že se tag img obalí párovým tagem a. Vizte příklad.

<a href="stranka.html"><img alt="alternativní text" src="obrazek.jpg"></a>

Ovšem při takovémto jednoduchém použití (bez CSS) se kolem obrázku udělá modrý rámeček. Tento nežádoucí prvek je možné odstranit i bez CSS stylů jednoduchým doplněním atributu border do tagu img.

<a href="stranka.html"><img alt="alternativní text" src="obrazek.jpg" border="0"></a>

Pomocí odkazů se dají vytvářet i tzv. záložky. To jsou označená místo v textu, na které potom může odkazovat odkaz ve speciálním tvaru, který potom vede na přesně určené místo.

<a href="#zalozka">Záložka</a>
<a name="zalozka">Zazáložkovaný text</a>
Normální text

Pro označení záložky se užívá <a name="jmeno_zalozky">text, který chceme zazáložkovat</a>. V názvech záložky se nesmí vyskytovat opět žádná mezera a ani diakritika.

Na záložky odkazujeme pomocí <a href="#jmeno_zalozky">odkaz na záložku</a>.

Využívá se to např. při rozsáhlém textu, kdy se po jeho přečtení uživatel dostane hodně dolů a k menu by musel rolovat opět dost nahoru. Tak se použije záložka, která uživatele dostane bez problémů nahoru.

Další možností využití je, jako tady na wikipedii, u delších textů - rozčlenění na kapitoly, na které potom odkazují odkazy s adrsou #jmeno_zalozky.

<p id="zalozka">Označený (zazáložkovaný) text odstavce.</p>

Modernějším zápisem je použití identifikátoru id, který může být přiřazen jakémukoliv elementu v HTML.