Odsyłacze#

Adresy internetowe#

Każda strona WWW ma swój unikatowy adres URL (Uniform Resource Locator). W odnośnikach adresy definiujemy za pomocą atrybutu href.

URL jest standardem służącym do wskazywania lokalizacji w sieciach komputerowych, tj. miejsce, z którego dany zasób można ściągnąć (adres) i sposób, w jaki można to zrobić (protokół, np. http, ftp, ...). URI (Uniform Resource Identifier) służy tylko do identyfikacji danych - znając URI jakiegoś zasobu, możesz odróżnić go od innego, ale nie musisz koniecznie wiedzieć, gdzie go szukać. URI jest terminem szerszym, stąd każdy URL jest URI, ale nie każdy URI jest URL. W praktyce obydwa terminy używa się zamiennie.

W przypadku połączeń lokalnych, czyli z dokumentu do dokumentu tej samej witryny, nie ma potrzeby wprowadzania całego adresu URL. Wystarczy określić położenie pliku względem dokumentu bieżącego lub względem katalogu głównego (bazowego) witryny. Takie rozwiązanie jest o wiele wygodniejsze w przypadku przenosin serwisu.

Ścieżki dostępu mogą być więc następujące:

W składni URL nigdy nie używa się ścieżek MS Windows/DOS (np. C:\plik\strona.html). W adresach w żadnym wypadku nie należy stosować znaku backslash ("\"). Do oddzielania katalogów służy slash ("/") (pochylony do przodu).

Adresy bezwzględne#

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
<a href="http://host.domena/ścieżka_na_serwerze">Opis odsyłacza</a>

Adres absolutny to po prostu pełny adres URL, wraz z nazwą protokołu. Składa się z części określającej rodzaj zasobu/usługi (scheme), dwukropka i części zależnej od rodzaju zasobu (scheme-specific part).

W przypadku odwoływania się do dokumentu umieszczonego na innym serwerze taka forma jest absolutnie konieczna. Stosowanie w obrębie własnego serwera jest opcjonalne.

Bezwzględne ścieżki dostępu do stron internetowych zawsze muszą rozpoczynać się od protokołu http:// (lub jego szyfrowanej wersji https://).

Znaczenie poszczególnych członów adresu najlepiej wytłumaczyć na prostym przykładzie:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
http:// www.example.com:80   /moje/pliki/plik.html?foo=bar#czescl2
^protocol    ^hostname                ^port    ^pathname                          ^seaarch    ^hash
             ^host (hostname + port)
^href (cały adres)
http://
Pierwszy człon oznacza nazwę protokołu. W tym przypadku HTTP. Poza jego bezpieczną wersją (HTTPS = SSL/TLS) jest jedynym powszechnie używanym dla stron WWW.
www.example.com
Nazwa domeny (komputer macierzysty). Ostatni człon (w tym przypadku .com) jest domeną najwyższego rzędu (TLD - Top Level Domain). Wielkość liter w domenie nie ma znaczenia.

WWW to część domeny. Z technicznego punktu widzenia przedrostek www nie ma specjalnego znaczenia. Działanie domeny z/bez www zależy od konfiguracji serwera DNS.

:80
Port, na którym serwer obsługuje adres. Jeśli wartością jest 80 (domyślny port na wielu serwerach), numer nie jest wyświetlany w przeglądarce ani konieczny przy wprowadzaniu adresu.
/moje/pliki/plik.html
Ścieżka określająca położenie pliku na serwerze. Zazwyczaj wielkość liter w ścieżce ma znaczenie (choć istnieją serwery ignorujące wielkość liter).

Rozszerzenie nazwy pliku (w tym przypadku .html) nie ma żadnego znaczenia z punktu widzenia URI - o typie pliku decyduje wysyłany przez serwer nagłówek HTTP Content-Type.

?foo=bar
Jest to tzw. Query String (zapytanie tekstowe). Jeśli ten sam dokument jest dostępny w kilku wersjach (np. zawierający dane posortowane rosnąco lub malejąco), jego wersja powinna być wybrana w Query String. W praktyce służy do przekazywania parametrów do skryptów.
#czesc2
Fragment (hash). Wskazuje miejsce wewnątrz dokumentu. W przypadku dokumentów (x)HTML wskazuje element o takim ID (lub odsyłacz z atrybutem name). Fragment działa tylko po stronie klienta i nie jest przesyłany do serwera.

Dodatkowo może być jeszcze nazwa użytkownika i hasło umieszczone przed domeną:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
ftp://użytkownik:hasło@example.com

Adresy absolutne najczęściej wykorzystujemy przy wstawianiu odsyłaczy spoza naszej domeny. Przykładem może być dział "Linki", w którym umieszczam co ciekawsze kąski wyłuskane z Internetu.

W powyższym przykładzie nazwy angielskie poszczególnych części adresu pochodzą z języka JavaScript. W innych językach programowania (np. PHP) mogą być nieco inne. Ma to tylko znaczenie przy manipulowaniu lub przetwarzaniu adresu w konkretnym języku programowania.

Adresy względne#

Adresy relatywne to najwygodniejszy sposób określania zależności między zasobami umieszczonymi na tym samym serwerze. Nie ma potrzeby podawania pełnego URL. Wystarczy w odpowiedni sposób określić położenie dokumentu (do którego chcemy się odwołać) względem bieżącego pliku lub względem katalogu głównego witryny.

Tworzenie adresów względnych opiera się na kilku podstawowych konstrukcjach:

/
Oznacza folder główny witryny (adres strony np. http://www.example.com). Zatem wskazywany dokument znajduję się w katalogu głównym dla całej domeny.
/sample1/przykład.html
Wskazywany dokument znajduję się w folderze sample1, który z kolei umieszczony jest w katalogu głównym witryny.
..
Dwie kropki oznaczają przejście do katalogu nadrzędnego.
../sample2/przykład.html
Wskazywany dokument znajduje się w folderze sample2, który z kolei umieszczony jest o jeden poziom wyżej, niż plik, do którego wstawiamy odsyłacz.
przykład.html
Wskazywany dokument znajduje się w tym samym katalogu co plik, do którego wstawiamy odsyłacz.
./przykład.html
To samo co wyżej. Wskazywany dokument znajduje się w tym samym katalogu co plik, do którego wstawiamy odsyłacz.
href=""
Oznacza po prostu wczytanie tego samego pliku, do którego wstawiamy odsyłacz.
//
Jedna z mniej znanych metod względnego adresowania protokołu (zgodna z RFC 1808), która jest obsługiwana przez prawie wszystkie przeglądarki od około 1995 r. Zamiast podawać pełny adres bezwzględny http://www.example.com możemy zastosować adres względny //www.example.com. W przypadku stron, które zawierają wiele zewnętrznych odsyłaczy może to wpłynąć pozytywnie na wielkość strony.

W adresach relatywnych domyślnym folderem bazowym jest adres witryny np. http://www.mojastrona.com. Za pomocą polecenia base możemy ustawić inny adres bazowy np. http://www.mojastrona.com/start/.

Stosowanie powyższych konstrukcji może być problematyczne dla osób początkujących. Dla lepszego zobrazowania zagadnienia, całość wyjaśnię na prostym przykładzie. Powiedzmy, że posiadamy witrynę z następującą strukturą katalogów:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
Adres strony: http://www.kurshtml.pl
Struktura katalogów:

index.html
favicon.ico
style.css

[content]

	[podstawy]
		wstep.html
		przeznaczenie.html
		historia.html
	[/podstawy]

	[elementyhtml]

		wykaz.html
		wlasnosci.html

		[elementyliniowe]

			[prezentacyjne]
				pochylenie.html
				pogrubienie.thml
			[/prezentacyjne]

		[/elementyliniowe]

	[/elementyhtml]

[content]

Odsyłacze wstawiamy do pliku wykaz.html. W poniższych przykładach zaprezentują kilka możliwości.

Przejście do index.html:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
href="/"	<!-- Domyślne wczytanie pliku o standardowej nazwie (index.html) -->
href="/index.html"
href="../../index.html"

Adres bezwzględny: http://www.kurshtml.pl

Przejście do wlasnosci.html:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
href="/content/elementyhtml/wlasnosci.html"
href="./wlasnosci.html"
href="wlasnosci.html"

Adres bezwzględny: http://www.kurshtml.pl/content/elementyhtml/wlasnosci.html

Przejście do pogrubienie.html:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
href="/content/elementyhtml/elementyliniowe/prezentacyjne/pogrubienie.html"
href="elementyliniowe/prezentacyjne/pogrubienie.html"

Adres bezwzględny: http://www.kurshtml.pl/content/elementyhtml/elementyliniowe/prezentacyjne/pogrubienie.html

Przejście do historia.html:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
href="/content/podstawy/historia.html"
href="../podstawy/historia.html"

Adres bezwzględny: http://www.kurshtml.pl/content/podstawy/historia.html

Przejście do wykaz.html:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
href=""
href="wykaz.html"
href="./wykaz.html"
href="/content/elementyhtml/wykaz.html"

Adres bezwzględny: http://www.kurshtml.pl/content/elementyhtml/wykaz.html

Znaki specjalne w URI (URL encode)#

Nadając nazwy plikom najlepiej kierować się następującymi wytycznymi. Uchroni nas to przed wieloma pomyłkami, szczególnie w trakcie odwoływania się do innych zasobów.

Tylko nieliczne znaki są dopuszczalne bezpośrednio w adresach. Wszystkie pozostałe muszą być zakodowane w postaci:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
%XX

gdzie XX to kod szesnastkowy kodowanego bajtu. Bajty mają reprezentować znaki w kodowaniu UTF-8, np. spacja to %20.

Najwygodniej posłużyć się odpowiednim oprogramowaniem dostępnym wprost z przeglądarki internetowej. Ze swojej strony polecam URL Encoder - obsługuje kilka stron kodowych. Więcej szczegółowych informacji na temat zagadnienia umieściłem w dziale "Kodowanie URL".

Znaki specjalne w domenach (IDN)#

Nazwy domen tradycyjnie były ograniczone do znaków alfabetu łacińskiego (a-z), cyfr (0-9) oraz myślników (-).

Sytuacja zmieniła się po wprowadzeniu IDN (Internationalized Domain Name - Międzynarodowa Nazwa Domeny). Jest to rozszerzenie standardu pozwalające używać dowolnych znaków Unicode w domenach jednocześnie zachowując kompatybilność wstecz. Domeny zawierające znaki z poza alfabetu łacińskiego są zapisywane w postaci tzw. punycode.

Przykładowo domena www.żółw.pl jest widziana przez przeglądarki i serwery nie obsługujące IDN jako www.xn--w-uga1v8h.pl. Przeglądarki obsługujące IDN są w stanie ją rozkodować i wyświetlić prawidłowo. Więcej informacji znaleźć można chociażby w serwisie home.pl.

Kodowanie znaków Unicode w domenach jest zupełnie odmienne od kodowania znaków w pozostałej części URI, które używa UTF-8 i urlencode.

Pasek społecznościowy

SPIS TREŚCI AKTUALNEJ STRONY

Odsyłacze (H1) Adresy internetowe (H2) Adresy bezwzględne (H3) Adresy względne (H3) Znaki specjalne w URI (URL encode) (H3) Znaki specjalne w domenach (IDN) (H3)