Nabízím kvalitní řešení, které vám padne.


Webové kotvy - metoda A - atribut name

Jelikož jsem se v poslední době setkal s několika případy, kdy jsem musel vytvářet odkazy na konkrétní část stránky, rozhodl jsem se že o tom i něco napíšu. A když jsem zjistil, že zas tak málo informací o tom nebude, rozhodl jsem se založit nový cyklus Jak na odkazy.

Odkazy nám dokáží ukazovat nejenom na soubory, ale i na specifické části stránky. Takovým odkazům se říká kotvy a my si je teď ukážeme na třech různých metodách.

Pro dobrý příklad budeme ve všech třech metodách odkazovat vždy na hlavní nadpis dané metody.

Metoda A: atribut name

<a href="#metoda-a" title="Kotva na metodu A">Shlédněte metodu A</a>
...
<h3><a name="metoda-a">Metoda A: atribut name</a></h3>

Výsledek: Shlědněte metodu A

Jak vidíte kotvu zabalujeme značkou <a> s atributem name , který obsahuje název kotvy důležitý pro následné odkazování.

K odkazování na kotvu se využívá obyčejného hypertextového odkazu, který v atributu href musí obsahovat značku "#" a za ní hned název odkazované kotvy. Před odkazem na kotvu se může nacházet i jméno souboru, kde se kotva nachází. Například takto:

<a href="index.php#kontakt" title="Odkaz na kontakt">Kontakt</a>

Jak jste si asi všimli, u odkazů používám ještě jeden atribut, a to title . Ten způsobí, že při zastavení kurzoru myši nad odkazem se nám zobrazí obdelníková nápověda většinou s informacemi kam odkaz směruje. Více o tomto atributu si však povíme až někdy příště.

Pozor na styly prvku <a>

U této metody si musíme hlídat nastavení globální stylizace pro prvek <a> . Styl vašeho nadpisu se může změnit, protože značka <a> obkopuje text nadpisu. Problému se můžete vyvarovat používáním pseudotřídy : link u prvků <a> , která zaručí stylizovaní pouze pro odkazy, které obsahují atribut href . Více o tomto fíglu v některém z dalších článků.

Znaky v name

Výhoda této metody je, že může využívat v názvech svých kotev objekty typu znak. Například objekt &#382; představuje znak "ž" a &aacute; představuje "á":

<a href="#&#382;&aacute;by" title="Kotva na odstavec o výskytu žab">Výskyt žab</a>
...
<h3><a name="&#382;&aacute;by">Výskyt žab v Evropě</a></h3>

Docela strašidelný, ale funguje to...

Kompatibilita

Atribut name není podle W3C doporučen používat v XHTML 1.0, takže pravděpodobně nebude v budoucnosti vůbec podporován. Proto asi budou problémy s dopřednou kompatibilitou.

Shrnutí

Jediná nevýhoda této metody je doporučení nepoužívat atribut name v XHTML 1.0, takže bychom měli uvážit dopřednou kompatibilitu.

Nebojte se však, ještě nás čekají dvě metody, které nám určitě nabídnou něco trošku jiného. A na konci si každý vybere svou nejoblíbenější...:-)

4.8.2005