Odsyłacze

Strony internetowe mają postać hipertekstu ("tekst w tekście"). Charakterystycznym i nieodzownym elementem są w nich odsyłacze (inaczej: linki, hiperłącza, łącza hipertekstowe, odnośniki).  Bez odsyłaczy nie istniałyby powiązania między dokumentami.

Odsyłacz jest wskazaniem innego miejsca. Kliknięcie na nim przenosi użytkownika do miejsca docelowego. Może nim być inne  miejsce na tej samej stronie, inna strona w ramach tego samego lub innego dokumentu.  Powišzane ze sobš informacje mogą być się w miejscach oddalonych od siebie nawet o wiele kilometrów. Hipertekstowe odsyłacze można porównać ze spisem treści czy odsyłaczami w książce. Elektroniczne odsyłacze są jednak znacznie wygodniejsze w obsłudze.

Konstrukcja i rodzaje odsyłaczy

Odsyłacz możemy umieścić na stronie stosując konstrukcję:

<A HREF="miejsce">Tekst informujący</A>

A - kotwica - ang. anchor.

Możemy wyróżnić kilka rodzajów odsyłaczy (ze względu na miejsce odsyłania):

Przykład:

<A HREF="http://www.wodip.opole.pl">Moja ulubiona strona</A>.

Przykłady:

Odsyłacz do pliku tekstowego TXT
<A HREF="wierszyk.txt">Mój wierszyk z notatnika</A>

Odsyłacz do pliku graficznego JPG
<A HREF="zdjecie.jpg">Moje zdjęcie</A>

Odsyłacz do pliku dźwiękowego
<A HREF="../Media/Passport.mid">Moja muzyka</A>

Odsyłacz do dokumentu PDF:

<A HREF="liceum/technologia_inf_pod.pdf">Technologia informacyjna - program nauczania</A>

        Aby utworzyć taki odsyłacz, należy najpierw oznaczyć miejsce docelowe tzw. etykietą:

        <A NAME="nazwa_etykiety"> </A>,

        a później zrobić odsyłacz do tego miejsca:

        <A HREF="#nazwa_etykiety">Tekst informujący</A>

<A HREF=mailto:identyfikator@adres>Tekst informujący</A>

Przykład:

<A HREF=mailto:mmysior@wodip.opole.pl.pl>Napisz do mnie</A>

        Odsyłacz do usługi FTP:

        <A HREF=ftp://ftp.adres>Tekst informujący</A>

        Odsyłacz do usługi NEWS:

        <A HREF=news:pl.comp.www></A>

 

Przykładowa strona:

<HTML>
    <HEAD>
        <TITLE>Moja strona</TITLE>
    </HEAD>
    <BODY BGCOLOR="yellow">
        <H1 ALIGN="center">Moja strona WWW</H1>
        <P>To jest moja pierwsza strona WWW. Czytam kolejne lekcje "e-nauki" i poznaję znaczniki
            <FONT FACE="Arial CE" SIZE="+1"
            COLOR="Red"><B>HTML</B></FONT>. Uczę się tworzenia stron WWW.</P>
        <H3>E-nauka obejmuje 11 tematów:</H3>
        <OL TYPE=I>
            <LI><A HREF="#alg">Algorytmika i programowanie</A></LI>
            <LI><A HREF="#anim">Animacje komputerowe</A></LI>
            <LI>Edukacja regionalna</LI>
            <LI>Grafika komputerowa</LI>
            <LI>Metoda projektu w nauczaniu</LI>
            <LI>Moja szkoła w Unii Europejskiej</LI>
            <LI>Multimedia w szkole</LI>
            <LI>Ocenianie w szkole</LI>
            <LI>Oprogramowanie alternatywne</LI>
            <LI>Projektowanie witryn www</LI>
            <LI>Szkolny portal internetowy</LI>
        </OL>
        <HR WIDTH=80% SIZE=5 COLOR="blue">
        <P ALIGN="center"><IMG SRC="WYKRZ.GIF"></P>
        <MARQUEE BEHAVIOR=SCROLL BGCOLOR="pink">WODIiP Opole </MARQUEE>
        <HR>
        <A NAME="alg">Algorytmika i programowanie </A>
        <P>Język Visual Basic for Applications może być językiem tzw. pierwszego kontaktu z
            programowaniem. Przemawia za tym szereg argumentów.</P>
        <HR>
        <A NAME="anim">Animacje komputerowe </A>
        <P>Wykorzystanie programu SWiSH w tworzeniu animacji komputerowych w technice Flash</P>
        <HR WIDTH=80% SIZE=5 COLOR="blue">
        <P><A HREF="http://www.wodip.opole.pl">Moja ulubiona strona</A></P>
        <HR>
        <A HREF=ftp://ftp.wodip.opole.pl>Pliki do pobrania</A>
        <HR>
        <A HREF=mailto:mmysior@wodip.opole.pl.pl>Napisz do mnie</A>
    </BODY>
</HTML>

Zadanie

Uzupełnij własną stronę z poprzedniego rozdziału o kilka odnośników:

Pracuj z notatnikiem (nie używaj edytorów HTML). Znaczniki pisz dużymi literami.