Kurs HTML - HTML - Odsyłacze Strona 1
Odsyłacze
W tym rozdziale dowiesz siÄ™...
Jak stworzyć przejście do innej strony WWW (linki)?
W jaki sposób przenieść u\
ytkownika do jednej z podstron serwisu?
Jak stworzyć formę elektronicznej zakładki na stronie?
W jaki sposób wstawić linki do innych stron w sieci?
Jak wstawić adres e-mail na stronie WWW?
Jak zrobić bezpośredni odsyłacz do pliku na serwerze FTP?
W jaki sposób wstawić na stronie WWW odsyłacz: Gadu-Gadu, Tlen, Jabber, Skype, ICQ, AIM, Yahoo!
Messenger? Jak wstawić status Gadu-Gadu, Tlen, Jabber itp. na stronie WWW?
Jak wstawić na stronie WWW odsyłacz: grupy dyskusyjnej (news), NNTP, newsrc, telnet, SSH, SSL,
JavaScript, Gopher, WAIS?
W jaki sposób wstawić na stronie WWW odnośnik (link, hiperłącze, odsyłacz hipertekstowy) obrazkowy
(graficzny), czyli klikalny przycisk?
Wstęp
Odsyłacze - inaczej hiperłącza, odnośniki hipertekstowe, linki - stanowią całą istotę Internetu. Bez nich byłby on
jedynie wielką siecią do pobierania "suchych" danych, a dokumenty znajdujące się w niej, nie byłyby w \
aden
sposób ze sobą powiązane. Praktycznie na ka\
dej stronie WWW spotyka się odsyłacze. Najczęściej stanowi je
specjalnie wyró\
niony krótki tekst (lub obrazek), po kliknięciu którego, następuje przeniesienie do innej strony.
Przy czym strona taka mo\
e wchodzić w skład tego samego serwisu, ale równie dobrze mo\
e znajdować się na
drugim końcu świata. Przeglądarki internetowe wyświetlają odsyłacze najczęściej w innym kolorze oraz
podkreślają je (mo\
na to oczywiście zmienić - zobacz: Kolor odsyłaczy) - w ten sposób są one lepiej widoczne i
odró\
niają się od zwykłego tekstu.
U\
ytkownika mo\
na odsyłać równie\
do cudzych stron, a nie tylko do własnych i nie jest to w \
aden sposób
łamanie praw autorskich (jeśli nie podpiszemy się jako autorzy takiej strony :-) - przeciwnie - jest to darmowa
reklama dla strony, do której następuje odwołanie. Wa\
ne jest jedynie, aby dokumenty były w jakiś sposób
powiÄ…zane ze sobÄ… tematycznie (chocia\
nie jest to wymóg - mo\
na przecie\
umieścić na własnej stronie linki do
ró\
nych ciekawych miejsc w Internecie, które nie muszą mieć ze sobą związku). To jest właśnie istota hipertekstu -
pozwala on uzyskać system połączeń pomiędzy ró\
nymi dokumentami w sieci.
Odsyłacze są wykorzystywane głównie do dwóch najwa\
niejszych celów:
1. Tworzenie spisu treści serwisu - spis taki jest podobny do tego, który występuje w zwykłych ksią\
kach. Jego
zaletÄ… jest jednak to, \
e nie trzeba ręcznie przeszukiwać całej zawartości w poszukiwaniu określonego
numeru strony, ale wystarczy kliknąć odsyłacz i zostaniemy automatycznie przeniesieni we wskazane
miejsce.
2. Linki do innych ciekawych miejsc w Internecie - zawiera je niemal ka\
dy serwis internetowy. Jeśli
u\
ytkownik będzie chciał przeczytać więcej o danym zagadnieniu, będzie mógł skorzystać z takich
odsyłaczy. W porównaniu z wyszukiwarkami internetowymi, linki mają taką zaletę, \
e autor zwykle starannie
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 2
je wybrał i dlatego zawierają najczęściej rzetelne informacje, których odszukanie w tradycyjny sposób
mogłoby zająć du\
o więcej czasu.
Gdyby nie odsyłacze, cały ten kurs musiałby składać się z jednej ogromnej strony lub z wielu nie powiązanych ze
sobą dokumentów, przez co nawigacja w takim serwisie byłaby niezwykle utrudniona. Aby wejść na dowolną
stronÄ™ (nawet w tym samym serwisie), za ka\
dym razem trzeba by było wpisywać jej adres w przeglądarce.
Do podstrony
(w obrębie tego samego serwisu)
Tak jak ka\
da ksiÄ…\
ka składa się z rozdziałów, tak samo serwisy internetowe składają się zwykle z podstron. Ka\
da
podstrona jest osobnym plikiem HTML i zawiera treść, która dość znacznie ró\
ni się tematycznie od pozostałych.
Taka organizacja ułatwia u\
ytkownikowi nawigację oraz zapobiega niepotrzebnemu wczytywaniu całego serwisu
od razu (co trwałoby prawdopodobnie bardzo długo).

względna ście\
ka dostępu opis
gdzie jako "względna ście\
ka dostępu" nale\
y podać lokalizację na dysku, gdzie znajduje się podstrona, do której
chcemy się przenieść.
W miejsce wyrazu "opis" wpisujemy krótki tekst, który pojawi się na ekranie i po kliknięciu którego nastąpi
uruchomienie odsyłacza (ście\
ka dostępu pojawia się jedynie na pasku statusu przeglądarki).
Praktycznie ka\
dy serwis internetowy składa się z pewnej ilości podstron, zapisanych w osobnych plikach HTML.
Aby umo\
liwić w nich nawigację, wstawia się właśnie takie polecenia, odnoszące się do wszystkich podstron
serwisu. Jest to pomocne przy tworzeniu spisu treści, chocia\
hiperłącza mogą znajdować się równie\
w zwykłym
tekście, odsyłając u\
ytkownika do miejsca, gdzie dany temat jest szerzej opisany. Odsyłacz taki mo\
e odnosić się
do innej podstrony, ale tylko w obrębie tego samego dysku (ten sam serwis internetowy).
Poniewa\
sposób przełamywania wierszy w przeglądarce nie zale\
y od sposobu wpisania tekstu w edytorze,
czasami mo\
e się zdarzyć, \
e pojedynczy odsyłacz zostanie przedzielony na dwie kolejne linijki. Mo\
e siÄ™ to
wydawać nieestetyczne. Aby tego uniknąć, nale\
y w opisie odsyÅ‚acza zastÄ…pić wszystkie spacje znakami  
[zobacz: Znaki specjalne]. Nie dotyczy to jednak tekstu, w którym znajdują się: "%" (procent) lub "-" (myślnik). W
takim przypadku mo\
na u\
yć blokady przełamania wiersza.
UWAGA!
Bardzo wa\
ne: w nazwach plików lepiej nie u\
ywać:
wielkich liter
znaków, np.: \ / : * ? " < > |
_
spacji (jeśli musisz, w zamian u\
ywaj podkreślnika " ")
ą, ć, ę, ł, ń...
polskich liter ( itd.)
Jeśli nie zastosujesz się do tych zaleceń, mo\
e się okazać, \
e po wprowadzeniu strony do Internetu, pliki takie nie
wczytają się (nawet jeśli na Twoim komputerze wszystko jest w porządku)!
Za pomocą tego typu odsyłacza mo\
na się odnosić do dowolnego pliku znajdującego się na koncie FTP razem ze
stroną. Dzięki temu mo\
na zbudować dział download, tzn. odsyłacze do pobierania plików.
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 3
Przykład:
To jest odsyłacz do strony głównej kursu HTML: Strona główna
Dymek narzędziowy
Dobrym pomysłem mo\
e się równie\
okazać, zastosowanie atrybutu title="..."
. Powoduje on, \
e po
wskazaniu odsyłacza myszką, wyświetli się tekst pomocniczy w "dymku" narzędziowym. Mo\
na tam podać np.
szerszy opis strony, do której ma nastąpić przeniesienie, np. po wpisaniu:
Strona główna
../index.html Do strony głównej
Otrzymamy (wska\
odsyłacz myszką, aby zobaczyć opis):
Strona główna
Pasek statusu (stanu)
Po wskazaniu odsyłacza myszką, w pasku statusu przeglądarki domyślnie pojawia się adres strony, do której ma
nastąpić przeniesienie (atrybut HREF). Mo\
na jednak to zmienić i sprawić, aby pojawił się tam inny napis. Nale\
y
jednak pamiętać, \
e na pasku statusu nie zmieści się zbyt długi tekst.
Do strony głównej
onmouseout="window.status=''; return true">Strona główna
Wska\
poni\
szy odsyłacz myszką i popatrz na pasek stanu przeglądarki:
Strona główna
Nowe okno
Jeśli chcesz, aby po kliknięciu odsyłacza otwarło się nowe okno, wpisz następujący kod (dotyczy to równie\

pozostałych typów odsyłaczy przedstawionych na tej stronie):

target="_blank" adres opis
kliknij tutaj
[Aby określić wygląd nowego okna (rozmiar, poło\
enie, pokazanie/ukrycie pasków menu, narzędzi, statusu itd.),
zobacz: Otwarcie nowego okna].
UWAGA!
Atrybut TARGET nie wchodzi w skład Strict DTD. Natomiast mo\
na go bez przeszkód u\
ywać wykorzystując
Transitional DTD.
IstniejÄ… co najmniej dwie drogi rozwiÄ…zania tego problemu:
1. JavaScript
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 4
Tworzymy plik o dowolnej nazwie z rozszerzeniem *.js- np. target.js
i zapisujemy w nim
następujący kod:
function aTarget(el, name)
{
var wnd = window.open(typeof el == 'string' ? el : el.href, typeof name != 'undefined' ?
name : '',
'menubar=yes,toolbar=yes,location=yes,directories=no,status=yes,scrollbars=yes,resizable=yes');
if (!wnd) return false;
wnd.focus();
return true;
}
Następnie w nagłówku dokumentu (sekcja HEAD) umieszczamy:

target.js
*.js
W wyró\
nionym miejscu nale\
y podać lokalizację utworzonego przed momentem pliku . Je\
eli
znajduje się w tym samym katalogu, wystarczy podać jego nazwę wraz z rozszerzeniem.
Ostatecznie linki, które mają się otwierać w nowym oknie, tworzymy następująco:

adres onclick="return !aTarget(this)" opis
Przykład:
www.google.pl w nowym oknie
2. DTD
Wykorzystując modularyzację języka XHTML, mo\
na utworzyć własną wersję DTD, czyli plik zawierający
definicję wszystkich znaczników i atrybutów języka, łączącą w sobie podstawową wersję DTD XHTML oraz
moduł XHTML Target 1.0, w którym zawiera się atrybut target="..."
. Nale\
y utworzyć plik pod
nazwÄ… xhtml11-target1.dtd DTD
i zapisać go na swoim koncie FTP w katalogu (uwaga na wielkość
liter!):
"-//W3C//DTD XHTML 1.1 + XHTML Target 1.0//EN">
PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
%xhtml11.dtd;
PUBLIC "-//W3C//ELEMENTS XHTML Target 1.0//EN"
"http://www.w3.org/TR/xhtml-modularization/DTD/xhtml-target-1.mod">
%xhtml-target.mod;
Pomysł: Dave H
Dokumenty XHTML tworzymy przy u\
yciu następującego szablonu:

PUBLIC "-//W3C//DTD XHTML 1.1 + XHTML Target 1.0//EN"
" /xhtml11-target1.dtd">
URL/DTD

http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 5


Tytuł dokumentu


Tu wpisuje się treść strony


Jako URL/DTD trzeba wpisać pełny adres do katalogu, w którym znajduje się utworzony przed chwilą plik
xhtml11-target1.dtd, np.http://www.example.com/DTD
Nale\
y przy tym zauwa\
yć, \
e mamy tutaj do czynienia z dokumentem XHTML 1.1, a więc nie mo\
na w
nim stosować znaczników i elementów zdeprecjonowanych! Ponadto powinniśmy zadbać o przesyłanie
takiego dokumentu z odpowiednim typem MIME. W rozdziale Typy MIME dokumentów XHTML dowiesz
się więcej na ten temat. Znajdziesz tam równie\
skrypt PHP negocjacji zawartości, dzięki któremu
dokumenty XHTML mogą się wyświetlać poprawnie w ka\
dej przeglÄ…darce (Microsoft Internet Explorer 7.0
nie potrafi wyświetlić dokumentu XHTML z typem MIME application/xhtml+xml!). Dla omawianego tutaj
rozwiązania, wystarczy ustawić w tym skrypcie preferowaną wersję DTD jako XHTML 1.1
i drugÄ…
preferowaną DTD (w przypadku braku pełnej interpretacji XHTML 1.1) -XHTML 1.0 Transitional
,
mime/XHTML 1.1.inc.php
a następnie w pliku " " zapisać:
PUBLIC "-//W3C//DTD XHTML 1.1 + XHTML Target 1.0//EN"
" /xhtml11-target1.dtd">
URL/DTD


Opis instalacji znajdziesz we wskazanym wcześniej rozdziale. Trzeba jednak zdawać sobie sprawę, \
e w
przestarzałych przeglądarkach (np. MSIE 7.0) nie uzyskamy w ten sposób XHTML 1.1 ani
XHTML 1.0 Strict! W takim przypadku skrypt automatycznie dobierze XHTML 1.0 Transitional, poniewa\

tylko w nim domyślnie mo\
na wykorzystywać atrybut target="..."
.
Do etykiety
Etykieta - inaczej zakładka lub kotwica (ang. anchor) - to pewne zaznaczone miejsce na stronie. Jeśli zdefiniujemy
taką zakładkę, będziemy mogli się póz
niej do niej bezpośrednio przenosić. Etykiety są wykorzystywane, gdy w
jednym dokumencie znajduje się więcej wa\
nych miejsc - podrozdziałów, a wstawienie ich do osobnych plików,
byłoby ucią\
liwe, ze względu na ich liczbę.
Tak jak w ksiÄ…\
ce - ka\
dy rozdział składa się z mniejszych podrozdziałów - tak samo na ka\
dej osobnej stronie
HTML definiuje się zakładki. Dzięki takiej konstrukcji, nawigacja w serwisie staje się du\
o Å‚atwiejsza. Po
kliknięciu odsyłacza do etykiety, przeglądarka internetowa przenosi u\
ytkownika bezpośrednio do podrozdziału, a
nie na poczÄ…tek strony, przez co nie jest on zmuszony do samodzielnego odszukania wybranego tematu (co w
przypadku obszernych dokumentów mogłoby długo potrwać). Etykietę mo\
na zdefiniować w dowolnym miejscu
strony - równie\
wewnątrz zwykłego tekstu.
Jeśli chcemy u\
ywać etykietę, najpierw nale\
y ją zdefiniować w wybranym miejscu strony za pomocą polecenia:
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 6

nazwa_etykiety
Następnie mo\
emy się do niej odwoływać, zarówno z tej samej jak i z innej strony, za pomocą zwykłych odsyłaczy:

(ście\
ka do strony)#nazwa_etykiety opis odsyłacza
Istnieją dwa rodzaje odsyłaczy do etykiet:
1. Etykieta zdefiniowana na tej samej stronie

nazwa_etykiety opis odsyłacza
(...)

nazwa_etykiety (opis etykiety)
lub

nazwa_etykiety (opis etykiety)
(...)

nazwa_etykiety opis odsyłacza
2. Etykieta zdefiniowana na innej stronie

ście\
ka dostępu lub adres internetowy nazwa_etykiety opis odsyłacza
UWAGA! Na podanej stronie musi zostać zdefiniowana etykieta - polecenie:
(opis etykiety)
We wszystkich przypadkach...oznacza etykietę, do której nastąpi
przeniesienie, po kliknięciu odsyłacza....
Polecenie powoduje przejście do innego miejsca (etykiety) na tej samej lub innej stronie. Zasady wpisywania
ście\
ki dostępu są takie same jak w przypadku odsyłacza do podstrony. Nale\
y jedynie pamiętać, \
e nazwa etykiety
w poleceniu odsyłacza: oraz w definicji etykiety: musi być bezwzględnie
#
taka sama (włączając w to wielkość liter), jedynie w odsyłaczu nazwę nale\
y poprzedzić znakiem (krzy\
yk)!
Mo\
na równie\
zauwa\
yć, \
e kolejność wpisywania odsyłacza oraz etykiety
na stronie jest dowolna, tzn. etykieta mo\
e znajdować się wcześniej ni\
odsyłacz do niej (powodując np.
przeniesienie na samą górę strony). Dodatkowo opis etykiety nie jest konieczny (ale konieczny jest opis odsyłacza,
bo w przypadku gdy go nie podamy, odsyłacz nie pojawi się na ekranie).
Na stronach WWW bardzo często umieszcza się etykiety bez opisu (ale nale\
y pamiętać o zamknięciu znacznika)
. Chocia\
zakładka taka nie jest widoczna na ekranie, to znajduje się w kodzie z
ródłowym strony i mo\
na siÄ™ do
niej odnosić.
id=" "
EtykietÄ™ mo\
na równie\
utworzyć, stosując atrybut identyfikator . Ró\
nica polega na tym, \
e atrybut
ID mo\
na u\
yć w stosunku do prawie wszystkich znaczników (oprócz: BASE, HEAD, HTML, META, SCRIPT,
STYLE, TITLE).
UWAGA! Bardzo wa\
ne: w nazwach etykiet lepiej nie u\
ywać:
wielkich liter
znaków, np.: \ / : * ? " < > |
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 7
_
spacji (jeśli musisz, w zamian u\
ywaj podkreślnika " ")
ą, ć, ę, ł, ń...
polskich liter ( itd.)
Dodatkowo nale\
y bezwzględnie pamiętać, \
e na tej samej stronie nie mogą się znajdować dwie identyczne
etykiety! Mo\
na natomiast umieścić takie same etykiety na ró\
nych stronach.
Przykład:
Odsyłacz pierwszego rodzaju (do etykiety "#do_adresu_internetowego" na tej stronie):
Do adresu internetowego
Odsyłacz drugiego rodzaju (do etykiety "#paragraf" na stronie "tekst.html" - spójrz na pasek stanu przeglądarki po
wskazaniu odsyłacza myszką):
Paragraf
Do adresu internetowego
(w obrębie całego Internetu)

adres strony opis
W miejsce "adres strony" nale\
y podać pełny adres internetowy strony, do której chcemy się przenieść (np.:
www.onet.pl).
Adres strony internetowej zawsze musi rozpoczynać się od http://
Odsyłacz taki jest przydatny, jeśli chcemy umieścić w swoim serwisie tzw. linki do dowolnych stron w obrębie
całego Internetu. Jeśli surfując w sieci, trafimy na jakąś ciekawą stronę, mo\
emy skopiować jej adres (z paska
adresu przeglądarki) i umieścić w odsyłaczu. Dzięki temu wszyscy u\
ytkownicy odwiedzający naszą witrynę, będą
mogli przenieść się bezpośrednio do wskazanej strony, bez potrzeby wpisywania jej adresu.
Przykład:
Odsyłacz do portalu internetowego onet.pl
Odsyłacz pocztowy
(e-mail)

adres e-mail opis
gdzie jako "adres e-mail" nale\
y podać adres poczty elektronicznej osoby, do której ma zostać wysłany list (np.:
[e-mail]).
Dzięki temu odsyłaczowi, u\
ytkownicy oglądający Twoją stronę, będą mogli wysłać list e-mail pod adres podany w
poleceniu. Po kliknięciu takiego odnośnika, list nie zostanie wysłany natychmiastowo, lecz nastąpi otwarcie
domyślnego programu pocztowego u\
ytkownika (np. Outlook Express), w którym będzie on mógł wpisać treść
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 8
listu, a potem go wysłać do wskazanego adresata, którego e-mail pojawi się automatycznie. Jeśli podasz swój
własny adres, będziesz w stałym kontakcie z u\
ytkownikami odwiedzającymi Twój serwis.
Przykład:
Tutaj mo\
esz wysłać list do mnie (tylko proszę, jeśli nie masz nic konkretnego do napisania, nie przysyłaj mi
pustych listów :-)
Wyślij list do autora kursu HTML
Pamiętaj, \
e podanie swojego adresu na stronie WWW, mo\
e spowodować, \
e zaczną do Ciebie przychodzić
niechciane wiadomości - reklamówki (tzw. spam). Dobrym pomysłem mo\
e być zało\
enie sobie darmowego konta
pocztowego w dowolnym portalu internetowym i podanie adresu takiego konta na swojej stronie - darmowe konto
zawsze mo\
na zmienić. Zakładając stronę WWW na darmowym serwerze, często dostajemy równie\
konto e-mail.
Wtedy mo\
na z niego skorzystać.
Ochrona adresu e-mail
Aby zabezpieczyć się przed tzw. \
niwiarkami (ang. harvesters) - czyli specjalnymi programami, które
automatycznie gromadzÄ… adresy e-mail, umieszczone na stronach WWW - mo\
na posłu\
yć się skryptem. Zamiast
typowego odsyłacza pocztowego, umieść na stronie:

Przy czym wyró\
nione wartości oznaczają:
jan_kowalski
Pierwszy człon adresu, znajdujący się przed znakiem@([e-mail])
example.com
Drugi człon adresu, znajdujący się po znaku@([e-mail])
?subject=Temat listu&body=Napisz co%9C:%0A
Dodatkowe parametry (patrz poni\
ej). Zwróć szczególną uwagę, \
e parametry rozpoczynajÄ… siÄ™ od pytajnika
Wyślij do mnie list
Opis odsyłacza, który pojawi się na ekranie
Dwie ostatnie wartości nie są wymagane, tzn. mo\
na ich nie podawać.
Wadą stosowania skryptu zamiast zwykłego odsyłacza pocztowego jest to, \
e jeśli przeglądarka u\
ytkownika nie
obsługuje skryptów JavaScript, nie zobaczy on \
adnego odnośnika i nie będzie się mógł z Tobą skontaktować. Na
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 9
szczęście znacząca większość u\
ywanych dzisiaj przeglÄ…darek internetowych, bez trudu sobie z tym radzi, dlatego
ryzyko błędu nie jest takie du\
e.
Uwaga! Jeśli zdecydujesz się na wykorzystanie skryptu, musi on zastąpić wszystkie zwykłe odsyłacze pocztowe,
na wszystkich stronach serwisu. Pozostawienie chocia\
jednego z nich sprawi, \
e sposób ten straci sens i nie spełni
swojego zadana!
Dodatkowe parametry odsyłacza pocztowego
Mo\
liwe jest tak\
e podanie odsyłacza pocztowego na inne sposoby:
1. List e-mail będzie miał podany przez nas tytuł

adres e-mail tytuł listu opis
2. Kopia listu będzie wysłana do podanej osoby
adres e-mail adres e-mail gdzie wysłać kopię opis
a>
3. Ukryta kopia (\
aden inny odbiorca listu nie zobaczy adresu podanego w bcc)

kopiÄ™ opis
4. W treści listu pojawi się podany tekst

adres e-mail tu wpisz tekst opis
5. List zostanie wysłany do kilku podanych adresatów

mail opis
6. Połączenie powy\
szych elementów

wpisz treść listu opis
& "
UWAGA! Jeśli w powy\
szych parametrach występują znaki: (ampersand - angielskie "and"), (cudzysłów), %
(procent) albo chcemy wstawić znak nowej linii (u\
ycie Enter nic nie da), nale\
y zamiast nich wpisać
%26 %22 %25 %0A
odpowiednio: , , oraz .
Dodatkowo (dotyczy to przede wszystkim systemu Windows) jeśli w dokumencie została u\
yta strona kodowa
iso-8859-2
, zamiast polskich liter mogą pojawić się zupełnie nieprzewidziane znaki. Na dodatek istnieją
widoczne ró\
nice kodowania znaków np. między Windows 98 a Windows XP i praktycznie nie da się dobrać jednej
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 10
działającej metody zapisu tych liter. Dlatego na dzień dzisiejszy najlepszym rozwiązaniem jest nie u\
ywanie
polskich znaków w odsyłaczach pocztowych.
Odsyłacz FTP

ftp.adres opis
Protokół FTP (File Transfer Protocol - Protokół Transmisji Plików) słu\
y do pobierania i wysyłania plików z/do
specjalnych serwerów. Mo\
liwe jest zabezpieczenie połączenia hasłem dostępu lub udostępnienie plików
wszystkim u\
ytkownikom - tzw. logowanie anonymous (adres e-mail jako nazwa u\
ytkownika).
Aby zrealizować na stronie dział "download" - tzn. mo\
liwość pobierania plików przez czytelników - nale\
y siÄ™
posłu\
yć odsyłaczem do podstrony.
Przykład:
ftp://sunsite.icm.edu.pl/pub/
Z podaniem u\
ytkownika (login)

u\
[e-mail] opis
Je\
eli do zalogowania wymagane jest hasło, aplikacja FTP poprosi o jego wprowadzanie.
Z podaniem u\
ytkownika (login) i hasła

u\
ytkownik hasł[e-mail] opis
UWAGA!
To jest BARDZO wa\
ne - przeczytaj dokładnie!
Podanie hasła jest równoznacze z oddaniem pełnego dostępu (do odczytu i zapisu - w tym kasowania plików)
ka\
demu u\
ytkownikowi, który kliknie na podany link! Dlatego tego typu odnośników nie powinno się
stosować. Zwłaszcza nie stosuj ich podając adres konta FTP, na którym znajduje się Twoja strona WWW!
Komunikatory internetowe
Gadu-Gadu

numer opis
Status u\
ytkownika

numer styl
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 11
gdzie jako styl nale\
y podać liczbę1. Je\
eli podamy2, zamiast obrazka zostanie zwrócona liczba
odzwierciedlajÄ…ca status u\
ytkownika:1- "niedostępny",2- "dostępny",3- "zaraz wracam".
Tlen

u\
ytkownik opis
Status u\
ytkownika

u\
ytkownik styl
gdzie jako styl nale\
y podać liczbę1,2lub3.
Jabber

u\
ytkownik@serwer opis
Status u\
ytkownika

serwer typ ikony
type
html- (domyślnie) identyfikator, obrazek statusu i opis statusu
text- status i opis statusu
image- obrazek statusu
ikony
Zestaw ikon:gabber,stellar,dudes,icq,licq,phpbb,invision,frickenhuge
Aby status wyświetlał się poprawnie, nale\
y w swoim komunikatorze dodać do kontaktów u\
ytkownika edgar@
jabber.netflint.net po czym go autoryzować.
Je\
eli podany powy\
ej sposób odczytu statusu nie działa poprawnie, mo\
esz skorzystać z bota Elmer. Pamiętaj, aby
dokładnie wykonać wszystkie instrukcje podane na wymienionej stronie, inaczej wskaz
nik statusu nie będzie
działał!
Skype

u\
ytkownik opis

u\
ytkownik akcja opis
akcja
call- rozmowa głosowa
chat- rozmowa tekstowa
add- dodaj do kontaktów
userinfo- profil u\
ytkownika
voicemail- poczta głosowa
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 12
sendfile- wyślij plik
Status u\
ytkownika

ikony u\
ytkownik
gdzie jako ikony nale\
y podać zestaw ikon:smallicon,mediumicon,smallclassic,bigclassic,
balloon.
Aby status wyświetlał się poprawnie, nale\
y w ustawieniach komunikatora zaznaczyć opcję:
Narzędzia/Opcje/Prywatność/Pozwól na wyświetlanie mojego statusu.
ICQ

numer opis
Status u\
ytkownika
numer obrazek
alt="ICQ" />
gdzie jako obrazek nale\
y podać liczbę od1do25.
AIM

u\
ytkownik wiadomość opis
Status u\
ytkownika

Yahoo! Messenger

u\
ytkownik opis
Status u\
ytkownika

gdzie jako typ nale\
y podać liczbę0,1lub2.
Inne
Odsyłacz do grup dyskusyjnych
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 13
1. Serwer domyślny:

nazwa grupy opis
2. Wskazany serwer:

serwer opis
3. Wskazana grupa na podanym serwerze:

serwer nazwa grupy opis
Grupy dyskusyjne to usługa obsługiwana przez programy pocztowe, pozwalająca wypowiedzieć się na jakiś temat
na forum oraz przeczytać wypowiedzi innych. Od zwykłego chatu ró\
ni siÄ™ tym, \
e dyskusja nie odbywa siÄ™ czasie
rzeczywistym, tzn. nie mo\
na oczekiwać natychmiastowej odpowiedzi na zadane pytanie.
Przykład:
news:pl.comp.www (serwer domyślny)
news://news.fuw.edu.pl/ (podany serwer)
news://news.fuw.edu.pl/pl.comp.www (wskazana grupa dyskusyjna)
Odsyłacz NNTP

adres opis
NNTP (Network News Tranport Protocol - Sieciowy Protokół Transportu Wiadomości) to protokół, na którym
opierajÄ… siÄ™ grupy dyskusyjne. Mo\
liwe jest podanie odwołania do wybranej grupy bezpośrednio poprzez protokół
NNTP.
Odsyłacz newsrc

adres opis
Plik .newsrc
zawiera informacje na temat grupy dyskusyjnej: czy została przez u\
ytkownika zasubskrybowana
oraz które artykuły zostały przeczytane. Dzięki temu mo\
na u\
ywać kilku programów odczytujących grupy
dyskusyjne bez konieczności ponownego subskrybowania i powtórnego czytania tych samych artykułów.
Odsyłacz telnet

adres opis

u\
ytkownik@adres opis
Telnet to usługa, dzięki której mo\
emy połączyć się z innym komputerem i nim sterować (znając komendy Unix'a)
- wymagane jest posiadanie konta. Z uwagi na brak szyfrowania transmisji jest wypierany przez SSH.
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 14
Odsyłacz SSH

adres opis

u\
ytkownik@adres opis
Odpowiednik telnetu z szyfrowanÄ… transmisjÄ….
Bezpieczne połączenie SSL

adres opis
Protokół SSL (Secure Sockets Layer - Bezpieczna Warstwa Gniazdek) został opracowany przez firmę Netscape
Communications Corporation. Jest u\
ywany do przesyłana poufnych danych. Teoretyczne za jego pomocą mo\
na
nawiązać połączenie ze zwykłą stroną HTML - analogicznie jak w przypadku odsyłacza do adresu internetowego.
Jednak aby to zrealizować, serwer musi obsługiwać tego typu połączenia, a dodatkowo posiadać własny certyfikat,
dzięki któremu u\
ytkownik mo\
e być pewny, \
e łączy się ze stroną, której \
ądał, a całą transmisja będzie
szyfrowana. Poniewa\
dane są szyfrowane, więc nawet jeśli osoba niepowołana przechwyci je po drodze podczas
przesyłania, nie będzie potrafiła ich odczytać. Nie nale\
y jednak łączyć się w ten sposób z ka\
dym dokumentem
poniewa\
szyfrowanie zabiera trochę czasu i strona wczytuje się wolniej. Protokół SSL jest powszechnie stosowany
przez sklepy i banki internetowe.
Niestety nie wszystkie serwery obsługują połączenie SSL. Równie\
starsze przeglÄ…darki internetowe mogÄ… go nie
interpretować (jest obsługiwane przez Internet Explorer oraz Netscape Navigator od wersji 3).
Odsyłacz do skryptu

polecenia opis
Odsyłacz ten, po kliknięciu, spowoduje wykonanie podanych poleceń języka JavaScript.
Po wskazaniu takiego odsyłacza myszką, na pasku stanu przeglądarki mogą pojawić się nieestetyczne napisy. Jeśli
nie chcesz, aby u\
ytkownik widział taką treść, mo\
esz zmienić wpis na pasku statusu, poprzez dodanie atrybutów:
onmouseover="..." onmouseout="..."
oraz .
Przykład:
javascript:alert('To jest okno ostrze\
enia')
Odsyłacz WAIS

adres opis
WAIS (Wide Area Information Server - Rozproszony Serwer Informacji) to system wyszukiwania tekstów na
zdalnych komputerach z architekturÄ… typu klient-serwer. Z powodu prymitywnego interfejsu oraz bankructwa firmy
będącej twórcą tego protokołu (Thinking Machines z Cambridge), obecnie WAIS jest bardzo rzadko stosowany.
Odsyłacz Gopher
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 15

adres opis
Pozwala na dostęp do informacji w Kampusowych Rozległych Systemach Informacyjnych (CWIS - Campus-Wide
Information System). Integruje w sobie protokoły takie jak: FTP, telnet czy WAIS. Z uwagi na ograniczoną
multimedialność oraz mało elastyczną i niewygodną strukturę obecnie Gopher jest bardzo rzadko stosowany.
Odsyłacz obrazkowy
Do tej pory przedstawione zostały jedynie odsyłacze tekstowe, tzn. na ekranie był wyświetlany pewien krótki tekst
(opis odsyłacza), po kliknięciu którego, następowało przeniesienie do wskazanego adresu. A
atwo zauwa\
yć, \
e to
nie wszystkie mo\
liwości, jakie dają odsyłacze. Na większości stron internetowych mo\
na spotkać "aktywne"
obrazki, symulujące przyciski. Po kliknięciu, zachowują się one jak zwykły odsyłacz (w istocie są one odsyłaczami)
. Wprowadzenie takich przycisków na stronę jest prostsze ni\
myślisz - wystarczy pamiętać, \
e wewnÄ…trz znacznika
odsyłacza (pomiędzy
a ) mo\
na umieszczać nie tylko tekst, ale równie\
inne znaczniki
- m.in. odpowiadajÄ…ce za zmianÄ™ wyglÄ…du tekstu (pogrubienie, pochylenie itd.), czy te\
wstawienie obrazka. Wa\
ne
jest jedynie, aby nie wstawiać tam elementów wyświetlanych w bloku, poniewa\
jest to niedozwolone!
Podstawowy odsyłacz obrazkowy

alternatywny
gdzie jako "ście\
ka dostępu" nale\
y podać lokalizację na dysku, gdzie znajduje się \
Ä…dany obrazek.
Zasady wpisywania adresu są analogiczne jak w przypadku odsyłaczy do: podstrony, etykiety,
adresu internetowego, poczty e-mail czy dowolnych innych odsyłaczy (w zale\
ności od wybranego typu odsyłacza).
Odsyłacz ten zostanie uruchomiony, gdy klikniemy myszką obrazek, do którego podajemy ście\
kę dostępu. Dzięki
niemu mo\
emy stworzyć np. efektowne przyciski odsyłaczowe w menu strony.
Obrazki przycisków najlepiej zapisywać w formacie GIF, większe zdjęcia - JPG. Jeśli nie masz zacięcia
artystycznego, nie musisz samodzielnie rysować wszystkich grafik. W Internecie na pewno znajdziesz wiele stron,
gdzie mo\
esz darmowo pobrać gotowe przyciski.
Tekst alternatywny (atrybut alt="..."
dla znacznika ) mo\
e pojawić się w "dymku" narzędziowym
po wskazaniu obrazka myszkÄ… (Microsoft Intetnet Explorer). Jest to jednak przede wszystkim informacja dla
przeglądarek tekstowych, które nie wyświetlają grafiki. Dzięki temu równie\
w takich przeglÄ…darkach mo\
liwe
będzie u\
ywanie odsyłacza obrazkowego, chocia\
grafika nie zostanie wyświetlona.
Je\
eli nie podasz tekstu alternatywnego (atrybut alt="..."
dla znacznika ) dla obrazka w
odsyłaczu, u\
ytkownicy z przeglądarkami tekstowymi albo z wyłączonym wyświetlaniem obrazów mogą mieć
utrudnioną lub wręcz uniemo\
liwionÄ… nawigacjÄ™ w takim menu!
Przykład:
Kliknij na tym przycisku:
Aby usunąć obramowanie wokół obrazka, nale\
y wpisać:
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 16

... ... tekst alternatywny
border="0"
Przykład:
Atrybut BORDER jest zdeprecjonowany przez specyfikację HTML 4.01 - zaleca się stosowanie stylów.
Rozszerzony odsyłacz obrazkowy (mapa odsyłaczy)

nazwa_mapy

nazwa_mapy
Dowolny tekst, byleby był on taki sam w pierwszej i w drugiej linii, a dodatkowo w pierwszym wierszu musi
być poprzedzony znakiem krzy\
yka (#). Na jednej stronie nie mogą się znajdować dwie mapy o takiej samej
nazwie!
(...)
Dalsze polecenia typu:alt="tekst alternatywny" />, które stworzą następne aktywne pola na obrazku.
kształt
Kształt obszaru w mapie odsyłaczy:
"rect" - pole ograniczone prostokÄ…tem
"poly" - pole ograniczone wielokÄ…tem nieregularnym
"circle" - koło
współrzędne
1. "xp,yp, xk,yk" - w przypadku prostokÄ…ta (rect):
xp- współrzędna pozioma lewego-górnego wierzchołka prostokąta
yp- współrzędna pionowa lewego-górnego wierzchołka
xk- współrzędna pozioma prawego-dolnego wierzchołka prostokąta
yk- współrzędna pionowa prawego-dolnego wierzchołka
2. "x1,y1, x2,y2, x3,y3..." - w przypadku wielokÄ…ta (poly):
"xn,yn- współrzędne poziome i pionowe kolejnych wierzchołków wielokąta
3. "x,y, r" - w przypadku koła (circle):
"x,y" - współrzędne środka
"r" - długość promienia
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46
Kurs HTML - HTML - Odsyłacze Strona 17
We wszystkich przypadkach współrzędne są liczone od lewego górnego wierzchołka obrazka, który stanowi
punkt zerowy układu współrzędnych.
Po wywołaniu tej komendy, zostanie wczytany obrazek o podanej ście\
ce dostępu. Następnie będzie on podzielony
na kilka pól (w sposób niewidoczny), z których ka\
de będzie przyporządkowane oddzielnemu odsyłaczowi. Dzięki
temu na tylko jednym rysunku mo\
emy umiejscowić więcej ni\
jeden odnośnik.
Wiele edytorów (X)HTML posiada wbudowany generator mapy odsyłaczy, dzięki któremu mo\
na w prosty i
szybki sposób określić współrzędnie poszczególnych obszarów, wskazując kolejne punkty myszką na
wyświetlonym obrazku.
UWAGA! Wielu u\
ytkowników Internetu wyłącza wyświetlanie grafiki na stronach, aby przyspieszyć
wczytywanie. W takim przypadku praktycznie nie będą oni mogli przenieść się do miejsc wskazanych na
obrazkowej mapie odsyłaczy.
Z tego powodu warto równie\
umieścić gdzieś zwykłe odsyłacze hipertekstowe, prowadzące do tych samych
dokumentów. Mo\
na tak\
e zastosować odnośnik do strony alternatywnej - dla przeglądarek które nie wyświetlają
grafiki. Ponadto tekst alternatywny jest informacją dla przeglądarek tekstowych, które nie wyświetlają grafiki.
Przykład:
Aby usunąć obramowanie wokół obrazka, nale\
y podać atrybut border="0"
dla znacznika .
Przykład:
Quiz
Sprawdz
swojÄ… wiedzÄ™, nabytÄ… w tym rozdziale, rozwiÄ…zujÄ…c testowy QUIZ.
http://www.kurshtml.boo.pl/html/odsylacze.print.html 2008-02-07 18:45:46