V dnešním díle našeho miniseriálu o programování webových stránek se naučíme vytvářet hypertextové odkazy, které naše stránky propojí dohromady.

Nejprve si ukážeme, jak takový odkaz vypadá:

<a href=“http://www.fantomasmag.net>www.fantomasmag.net</a>

No a na webové stránce se zobrazí takto:
www.fantomasmag.net

Nyní si probereme značku <a… , která odkaz tvoří, trochu podrobněji. Nejprve si ukážeme, které atributy můžeme při vytváření odkazu použít.

href

Tak nejdůležitějším atributem je href, do kterého zapíšeme, na kterou stránku odkaz míří. V případě, že zapíšeme href=“http://www.fantomasmag.net, dostaneme se po klepnutí na odkaz na stránky tohoto magazínu. Pozor! Nezapomeňte do adresy v href zapsat u takovýchto odkazů, které míří mimo vaše stránky i protokol http:// a u všech odkazů NEZAPOMÍNEJTE na uvozovky!

Protokoly

Ono tajemné http:// je vlastně protokol, který je jedním z nejpoužívanějších protokolů na Internetu a znamená HyperText Transfer Protokol. Většina internetových adres začíná právě slůvkem http:// jako např: http://www.fantomasmag.net. Vitšinou název tohoto protokolu nemusíte do prohlížeče vůbec zadávat, jelikož většina prohlížečů jej doplňuje automaticky po zadání adresy bez http://.

Mimo protokolu http:// existují i protokoly jiné, ovšem už méně používané. Z těch používanijších je to protokol ftp:// a mailto:. Jen stručně si povíme, k čemu tyto protokoly slouží.

O protokolu ftp:// jste již jistě slyšeli. To ftp znamená File Transfer Protokol a jak je již z názvu patrné, slouží k přenosu souborů prostřednictvím Internetu. No a protokol mailto: pro změnu slouží pro odkazování na e-mailovou adresu. Pokud kupříkladu zapíšete <a href=“mailto:redakce@fantomasmag.net>Napište nám</a> a v prohlížeči na takovýto odkaz kliknete, spustí se vám e-mailový klient z oknem pro zápis nové poštovní zprávy, kde v poli příjemce bude vložená adresa, která je uvedena v odkazu, v tomto případě redakce@fantomasmag.net.

Absolutní a relativní odkazy

Odkazy se rozdělují do dvou skupin. Jsou to odkazy absolutní a odkazy relativní. Absolutní odkaz vždy začíná protokolem, relativní nikoliv. Absolutní odkazy se většinou používají k odkazování na stránky, které jsou umístěny mimo váš web, viz výše uvedené příklady. Naproti tomu relativní odkazy se používají především k odkazování na stránky, jež jsou součást vašeho webu. Pro lepší pochopení této problematiky uvedu příklad. Pokud budete mít ve složce www soubory index.htm, první.htm a druha.htm budete se na ně odkazovat pomocí relativních odkazů například takto:

<a href=“druha.htm“>Odkaz na druhou stránku</a>
<a href=“index.htm“>Odkaz na hlavní stránku</a>

Pokud budete mít vaše stránky se více složkách, můžete použít takovýto odkaz:

<a href=“slozka/stranka.htm“>Stránka v jiné složce</a>

A pokud se budete chtít dostat z vnořené složky, tzn. o úroveň víš, použijete tento odkaz:

<a href=“../slozka/stranka.htm“>Stránka o úroveň víš</a>

Obrázkové odkazy

Možná jste na některých stránkách viděli odkazy, které byly tvořeny obrázky. Ale jak takovýto odkaz udělat? Vezměte si jakýkoliv obrázek a ten obklopíte odkazem.

<a href=“odkaz.htm><img src=“obrazek.gif“></a>

Pokud si necháte tento odkaz zobrazit na tvých stránkách tak po kliknutí na obrázek, který se vám zobrazí, přejdete na stránku, která je zapsaná v href.

Nejdůležitijší atributy značky <a>

• HREF=“stranka.htm“ – stránka uvedená v href se načte po kliknutí na odkaz (viz víše)
• TITLE=“Popisek odkazu“ – Tento popisek se zobrazí, pokud myší najedete na odkaz a chvilku počkáte
• NAME=“jméno“ – jméno stránky nebo záložky. Používá se většinou v souvislosti se skripty nebo rámy, ale také pro odkazovaní na určité místo dokumentu.
• TARGET=“cíl“ – určuje, ve kterém rámu se otevře stránka uvedená v odkazu. Nejpoužívanější je asi „_blank“ – určující zobrazení stránky v novém okně.

A to je o odkazech zatím vše. Pokud byste měli jakýkoliv dotaz, nestyďte se zeptat na naší e-mailové adrese.