HTML
Kontynuując opis działania usługi WWW trochę więcej informacji na temat HTML -HyperText Markup Language, czyli hipertekstowego języka znaczników 🙂.
Formalnie dokument HTML jest dokumentem/plikiem tekstowym, czyli możemy przeczytać jego treść i nie są to jakieś dziwne robaczki, jak w przypadku plików binarnych i danych.
Dlatego też wyjaśnię ogólnie jak taki dokument czytać.
Oczywiście bardziej interesujące jest to co na jego podstawie pokaże przeglądarka, ale nie przeglądając jego treść możemy znaleźć wiele ciekawych informacji 
.
Treść dokumentu HTML często jest nazywana kodem, gdyż przeglądarki interpretują jego treść i podejmują odpowiednie działania przygotowując to co widzimy 🙂.
Źródło strony czyli HTML
Większość przeglądarek pozwala zobaczyć kod strony 🙂.
Aby zobaczyć źródło wystarczy po kliknięciu prawym przyciskiem myszy wybrać z menu, które się pojawiło Pokaż źródło – lub podobny komunikat.
Można też użyć odpowiedniej pozycja w Menu przeglądarki.
Spowoduje to pojawienie się nowego okna lub zakładki w której znajduje się treść dokumentu HTML.
Uwaga to nie musi być treść jaką przeglądarka właśnie wyświetla. To jest dokument opisany w Zwracany dokument 🙂.
Wyjaśnienie dlaczego to mogą być różne dokumenty znajdziesz we wpisie Java Script 🙂.
HTML struktura
Dokument ten ma strukturę hierarchiczną 😮.
Każdy element może mieć potomka (dziecko) lub wielu potomków i musi mieć jednego rodzica 🙁.
Rolę Adama i Ewy pełni cały dokument, on nie ma on rodzica 🙂.
Druga ważna informacja to każdy element może mieć przypisane właściwości.
To, że powinien mieć odpowiednią składnię jest oczywiste 😛.
Przeglądarki, jeżeli w kodzie napotkają błąd będą starały się go skorygować, choć efekt tej korekty może być bardzo dziwny 😛.
W HTML spacje, wcięcia i przejście do nowej linii na które zwracamy uwagę czytając tekst nie mają znaczenie, są pomijane.
Jeżeli w tekście kodu HTML chcemy wstawić znak przejścia do nowej linii umieszczamy znacznik <br>, a nie wstawiamy to co w edytorach nazywa się NewLine czyli znak Enter 🙂.
Struktura
Na początek ogólna i prosta struktura dokumentu HTML, gdzie … – 3 kropki to odpowiedni tekst definiujący atrybuty, …. – 4 kropki to element/blok:
<!DOCTYPE html>
<html...>
<head>
....
</head>
<body...>
....
<!-- to jest komentarz pomijany przez przeglądarki
i oczywiście może być kilku-liniowy -->
....
</body>
</html>Dla każdej z przeglądanych stron czytelnik może podejrzeć kod strony i zidentyfikować jej kluczowe elementy.
Kolejnym krokiem jest struktura bloku – czyli te 4 kropki …. – ogólnie przedstawia się to następująco:
<blok0...>
....
<blok1...>
....
</blok1>
...
<blok2...>
....
<blok3...>
....
</blok3>
</blok2>
....
<blok4.../>
....
</blok0>
Ponieważ nie jest moim celem nauka HTML, dlatego nie będę rozpisywał się jakie są możliwe bloki i ich atrybuty, ograniczę się do stwierdzenia, że każdy otwarty blok musi zostać zamknięty czyli zawierać znacznik </..>.
Dodatkowo dopuszczalne są zagnieżdżenia i w ten sposób powstaje hierarchia obiektów, w matematyce zwana drzewem 😮.
Czytanie logiki jest proste element blok0 ma dzieci blok1, blok2 i blok4, w drugą stronę rodzicem blok2 jest blok0, a rodzicem blok3 jest blok2. Dokładnie tak samo jak z nawiasami w operacjach matematycznych – arytmetyce, której uczyliśmy się w szkole podstawowej 🙂.
Podsumowanie
Bardziej dociekliwych i chętnych do zapoznania się z możliwościami HTML odsyłam do szkoleń tematycznych, których w Internecie jest wiele.
To, że przeglądarka pobiera dodatkowe pliki już wspominałem w Interpretacja HTML, ale nie kończy się to na samym pobraniu.
Zależnie od ich typu działania są różne.
W olejnych wpisach ograniczę się do CSS oraz skryptów, bo możliwości budowy różnych rozwiązań opartych na tak prostych mechanizmach są olbrzymie 😉.
Dociekliwych szukających dodatkowych informacji o strukturze dokumentu HTML i odsyłam do HTML Tutorial.