NAZARII BOICHUK

Co to jest HTML?

WARSZAWA 2013

LXXVIII LICEUM OGÓLNOKSZTAŁCĄCE IM.MARII PAWLIKOWSKEJ-JASNORZEWSKEJ

-1-

Opis wstępny

HTML pozwala opisać strukturę informacji zawartych wewnątrz strony internetowej, nadając znaczenie poszczególnym fragmentom tekstu – formując hiperłącza, akapity, nagłówki, listy – oraz osadza w tekście dokumentu obiekty plikowe np. multimediabądź elementy baz danych np. interaktywne formularze danych.

HTML umożliwia określenie wyglądu dokumentu w przeglądarce internetowej. Do szczegółowego opisu formatowania akapitów, nagłówków, użytych czcionek i kolorów, zalecane jest wykorzystywanie kaskadowych arkuszy stylów.

W składni HTML wykorzystuje się pary znaczników umieszczone w nawiasach ostrokątnych, np. <title> i </title> lub <h1> i </h1>.

HTML pozwala również na osadzanie ciągów instrukcji języków skryptowych, umieszczonych pomiędzy znacznikami <script> i </script>

Należy nadmienić, że HTML, będąc językiem znaczników, nie jest zaliczany do języków programowania – w jego składni nie przewidziano wyrażeń obliczeniowych, warunkowych czy iteracyjnych.

Ważną cechą HTML-u, która przyczyniła się do popularności systemu WWW oraz Internetu, jest niezależność od systemu operacyjnego i wykorzystywanego sprzętu komputerowego.

Historia

PoczątkiW 1980 fizyk Tim Berners-Lee, pracujący dla ośrodka naukowo-badawczego CERN, stworzył prototyp hipertekstowego systemu informacyjnego – ENQUIRE. System wykorzystywano do organizowania i udostępniania dokumentów związanych z badaniami naukowymi. Rewolucyjność pomysłu polegała na tym, że użytkownik, posługując się odnośnikami, mógł z jednej lokalizacji przeglądać dokumenty fizycznie znajdujące się w innych miejscach na świecie.

W 1989 Berners-Lee i inżynier oprogramowania CERN Robert Cailliau przedstawili równolegle dwie propozycje hipertekstowych systemów informacyjnych opartych na sieci Internet. Oba projekty cechowała podobna funkcjonalność. Rok później opracowali wspólną propozycję zaakceptowaną przez CERN – projekt WorldWideWeb (W3)

Pierwsza specyfikacjaPierwsza, publicznie dostępna, specyfikacja języka HTML, nazwana HTML Tags (pol. Znaczniki HTML), została zamieszczona w Internecie przez Bernersa-Lee w 1991. Zawiera 22 znaczniki, tworzące początkowy, prosty szkielet HTML-a. Trzynaście z tych elementów istnieje do tej pory w specyfikacji HTML 4[.

HTML został napisany w oparciu o język SGML, jednak nie posiadał formalnej definicji w SGML-u. Sytuacja zmieniła się w połowie 1993, kiedy organizacja IETF opublikowała pierwszą propozycję specyfikacji języka HTML autorstwa Bernersa-Lee i Dana Connolly – Hypertext Markup Language (HTML) Internet-Draft (pol. szkic) – zawierającą opis gramatyki w postaci SGML Document Type Definition (pol. definicja typu dokumentu). Opierając się na tym dokumencie twórcy przeglądarek eksperymentowali z HTML-em modyfikując atrybuty istniejących już znaczników oraz dodając całkowicie nowe. Szkic wygasł sześć miesięcy później, ale był znany z obsługiwania specyficznych dla przeglądarki NCSA Mosaic znaczników, służących do wstawiania obrazków. Fakt ten odzwierciedlał filozofię IETF bazowania przyszłych standardów na prototypach, które odniosły sukces[. Podobnie Dave Raggett pod koniec 1993 w swoim szkicu HTML+ (Hypertext Markup Format) sugerował standaryzację już zaimplementowanych znaczników np. związanych z tworzeniem tabel i formularzy

-2-

Po wygaśnięciu szkiców HTML i HTML+ na początku 1994 organizacja IETF wydzieliła HTML Working Group, która w 1995 stworzyła HTML 2.0 – pierwszą oficjalną specyfikację języka HTML, traktowaną jakostandard i podstawę przyszłych implementacji kolejnych wersji HTML-a. Specyfikacja HTML 2.0, opublikowana w 1996 jako Request for Comments, zawierała pomysły zarówno ze szkicu HTML jak i

HTML+]. "HTML 1.0" nigdy nie istniał. Oznaczenie 2.0 zostało nadane w celu odróżnienia nowej specyfikacji od wcześniejszych szkiców[.

Dalszy rozwój HTML-a pod pieczą IETF przeciągał się ze względu na konflikt interesów. Od 1996 specyfikacje HTML rozwijane były z udziałem komercyjnych producentów oprogramowania przez organizację World Wide Web Consortium (W3C). W 2000 HTML stał się międzynarodowym standardem (ISO/IEC 15445:2000). Ostatnia specyfikacja języka HTML to opublikowana w 1999 przez W3C – HTML 4.01. Jej błędy zostały poprawione przez erratę opublikowaną w 2001.

Historia wersjiWersje HTML-a

lipiec, 1993: Hypertext Markup Language, szkic opublikowany przez IETF [10] .

listopad, 1995: opublikowany przez IETF jako Request for Comments:

RFC 1866 , uzupełniony przez RFC 1867 (upload plików za pomocą formularza) tego samego miesiąca, RFC 1942  (tabele) maj 1996, RFC 1980  (mapy odsyłaczy po stronie klienta) sierpień 1996, RFC 2070  (internacjonalizacja) styczeń 1997;

Ostatecznie, wszystkie elementy zostały uznane za przestarzałe/historyczne przez RFC 2854 w czerwcu 2000 r.

Standard HTML 3.0 został przedstawiony IETF przez Dave’a Raggeta i W3C w kwietniu 1995 r. Zawierał znaczną część funkcjonalności HTML+ Raggetta np. obsługa tabel, oblewanie tekstem obiektów, wyświetlanie skomplikowanych wyrażeń matematycznych. Pomimo faktu kompatybilności z HTML 2.0, był zbyt złożony (jak na owe czasy), aby go zaimplementować. Producenci przeglądarek optowali tylko za częścią nowego standardu, ale zaimplementowali inne znaczniki, które chętnie widzieliby w specyfikacji. Z uwagi na brak obsługi ze strony przeglądarek prace nad wersją 3.0 zostały przerwane.

HTML 3.1 nigdy nie został oficjalnie zaproponowany. Światło dzienne ujrzała za to kolejna wersja HTML 3.2 (nazwa kodowa: Wilbur), w której zrezygnowano z wielu rozwiązań zastosowanych w HTML 3.0 na rzecz nowych znaczników i atrybutów wykorzystywanych już przez przeglądarki Netscape i Mosaic [13] .

14 stycznia 1997: HTML 3.2, opublikowany jako rekomendacja W3C[14].

IETF także nie miała szansy zatwierdzić HTML 3.2. Pracująca nad tą wersją grupa HTML Working Group została zamknięta we wrześniu 1996 r.[15]. Ostatecznie wersja 3.2 została opublikowana jako pierwsza rekomendacja W3C w 1997 r. Obsługa wyrażeń matematycznych zapoczątkowana w HTML 3.0 po kilku latach doczekała się własnego standardu – MathML.

18 grudnia 1997: HTML 4.0, opublikowany jako rekomendacja W3C. Zaoferowany w trzech typach[16]:

Strict, w którym używanie elementów uznanych za przestarzałe jest zabronione. Transitional, w którym używanie elementów uznanych za przestarzałe jest dopuszczalne. Frameset, w którym dopuszczone są głównie elementy związane z ramkami.

HTML 4.0 (początkowa nazwa kodowa „Cougar”) również zawierał wiele elementów specyficznych dla przeglądarek, lecz jednocześnie starał się uporządkować standard poprzez oznaczenie części znaczników jako przestarzałe, zalecając wycofanie ich z powszechnego użycia.

-3-

Fakt spowodowany był próbą oddzielenia warstwy logicznej struktury dokumentu od warstwy jego prezentacji, wykorzystując dołączane kaskadowe arkusze stylów (CSS). HTML 4.0 okazał się jedynie częściowym sukcesem w dziedzinie standaryzacji, gdyż wsparcie dla CSS w większości przeglądarek było przez wiele lat niepełne. Niekompatybilność przeglądarek ze standardem staje się jednak z czasem coraz mniejsza. Drobne korekty specyfikacji HTML 4.0 zostały opublikowane bez zmiany numeru wersji standardu, jednak kolejne poprawki przyczyniły się do powstania HTML 4.01.

24 kwietnia 1998: HTML 4.0 z drobnymi poprawkami został powtórnie opublikowany bez zmiany wersji.

24 grudnia 1999: HTML 4.01, opublikowany jako rekomendacja W3C. Oferuje te same typy, które oferował HTML 4.0[. Ostatnia errata została wydana 12 maja 2001 r.[

HTML 4.01 oraz ISO/IEC 15445:2000 są najnowszymi i najbardziej aktualnymi wersjami standardu HTML.

15 maja 2000: HTML ISO/IEC 15445:2000 "ISO HTML", opublikowany na bazie HTML 4.01 Strict, jako międzynarodowy standard ISO/IEC.

22 stycznia 2008: HTML 5, opublikowany przez W3C jako szkic („Working Draft”).

Wersje XHTML-a

XHTML jest oddzielnym, nowym językiem skonstruowanym na bazie HTML 4.01 przy użyciu XML 1.0. Jest dalej rozwijany:

XHTML 1.0, opublikowany 26 stycznia 2000 jako rekomendacja W3C; w późniejszym czasie skorygowany i opublikowany ponownie 1 sierpnia 2002. Oferuje trzy typy z HTML-a 4.0 oraz 4.01. Przystosowany do standardu XML, czego skutkiem są dodatkowe drobne restrykcje w języku[21].

XHTML 1.1, opublikowany 31 maja 2001 jako rekomendacja W3C. Bazuje na XHTML 1.0 Strict, zawiera jednak pewne korekty. Może być dostosowywany poprzez użycie modułów opisanych w Modularyzacji XHTML, opublikowanej 10 kwietnia 2001 jako rekomendacja W3C[22].

XHTML 2.0 przez dłuższy czas figurujący jako szkic a obecnie całkowicie porzucony. XHTML 2.0 nie był kompatybilny z XHTML 1.x, dlatego też można go było scharakteryzować jako nowy język powstały z inspiracji XHTML-em a nie traktować go jako uaktualnienie XHTML-a 1.x[23].

XHTML 5, który jest aktualizacją XHTML-a 1.x, jest zdefiniowany wraz z HTML-em 5 w szkicu HTML 5[24].

WspółczesnośćPodsumowując, HTML 4.01 uporządkował różne niekompatybilne implementacje tego języka w jedną, spójną specyfikację bazującą formalnie na SGML-u. XHTML 1.0 przeniósł tę specyfikację na nowy grunt – standard XML. Kolejna wersja, XHTML 1.1, korzysta z modularnej natury XML-a, dzieląc specyfikację na wiele segmentów.

XHTML 2.0 jest powrotem do korzeni pod względem idei semantycznego kodu, w przeciwieństwie do 1.0 wnosi wiele radykalnych zmian i zrywa z kompatybilnością wsteczną. Jednak ta droga rozwoju została ostatecznie uznana za nietrafioną i rozwój XHTML 2.0 został zarzucony na rzecz HTML 5, nad rozwojem którego trwają obecnie intensywne prace. HTML 5 jest pierwszą wersją, która nie jest zgodna z SGML[25].

Komponenty języka HTML

Język HTML składa się z kilku kluczowych komponentów:

znaczników (i ich atrybutów), typów danych,

-4-

odwołań w postaci encji, deklaracji typu dokumentu.Znaczniki (tagi)

Osobny artykuł: tag (znacznik).

Znaczniki stanowią podstawowy komponent języka HTML. Charakteryzują je dwie cechy: atrybuty i zawartość. Każdy atrybut i zawartość musi spełniać określone wymagania, aby dokument został poprawnie zwalidowany pod kątem zgodności ze standardem. Znacznik zwykle rozpoczyna się znacznikiem otwierającym (np. <nazwa-znacznika>), a kończy znacznikiem zamykającym (np. </nazwa-znacznika>). Atrybuty elementu są zawarte w znaczniku otwierającym (po nazwie znacznika), natomiast zawartość umieszczana jest pomiędzy znacznikiem otwierającym i zamykającym. (np. <nazwa-znacznika atrybut="wartość">zawartość</nazwa-znacznika>). Niektóre elementy, np. <br>, <hr> nie posiadają zawartości, a także znacznika zamykającego.

W nomenklaturze polskiej, dotyczącej języka HTML, słowa element używa się do określenia grupy:

znacznik otwierający, atrybuty, zawartość, znacznik zamykający.

Słowami znacznik określa się znacznik otwierający (wraz z zamykającym) w znaczeniu elementu składni języka HTML, np. "Do wyszczególnienia paragrafów wykorzystuje się znacznik <p>". Niektórzy słowa element używają zamiennie ze słowamiznacznik lub tag.

Niektóre elementy nie wymagają znaczników końcowych (np. <p> odpowiadający za nowy akapit) lub ich nie mają (<img> wstawiający obrazek lub <br> łamiący linię).

Poniżej przedstawione są różne typy znaczników języka HTML.

Strukturalne – opisują logiczną strukturę tekstu, np. <h2>Golf</h2> nadaje znaczenie wyrazowi "Golf" i traktuje go jako nagłówek drugiego stopnia. Podczas renderowania (wyświetlania) zostanie on zaprezentowany w sposób wyróżniony (np. większą i pogrubioną czcionką). Znaczniki strukturalne nie definiują sposobu wyświetlania elementu, jednak większość przeglądarek posiada wbudowane style, których używa, gdy do dokumentu nie jest dołączony żaden kaskadowy arkusz stylów CSS.

Prezentacyjne – opisują wygląd poszczególnych elementów, np. <b>lama</b> powoduje, że "lama" zostanie wyświetlona pogrubioną czcionką. Nie daje jednak żadnych wskazówek urządzeniom nie potrafiącym wyświetlić pogrubionego tekstu (takim jak syntezatory mowy, czytający daną stronę na głos). W przypadku <b>pogrubienia</b> oraz <i>pochylenia</i> istnieją równoważne znaczniki, mające podobną lub taką samą formę wizualną, ale posiadające naturę semantyczną. Są to odpowiednio<strong>silne wzmocnienie znaczenia</strong> oraz <em>wzmocnienie znaczenia</em>. W tym przypadku łatwiej określić zachowanie syntezatora mowy podczas interpretacji takich znaczników np. poprzez mocniejsze zaakcentowanie danego wyrażenia. Znaczniki semantyczne nie są jednak stuprocentowymi odpowiednikami znaczników prezentacyjnych. Istnieją sytuacje, gdy tylko wizualnie chcemy wyróżnić daną część tekstu. Nie jest pożądane, aby syntezator mowy wzmacniał znaczenie np. tytułu książki w trakcie czytania strony, podczas gdy wizualnie warto byłoby taki tytuł wyróżnić czcionką pochyłą dla poprawienia czytelności tekstu. Większość znaczników prezentacyjnych w specyfikacji HTML 4.0 oznaczono jako przestarzałe na rzeczkaskadowych arkuszy stylów CSS

-5-

Hipertekstowe – zawierają linki do innych dokumentów lub innych części tego samego dokumentu.

HTML aż do wersji XHTML

1.1 wymaga do utworzenia hiperłącza elementu o nazwie anchor (pol. kotwica), zapisywanego w postaci: <a>Wikipedia</a>. Oprócz tego atrybut href musi zwierać poprawny adres URL. Następujący kod HTML <a href="http://pl.wikipedia.org/">Wikipedia</a> wyświetli ciąg znaków "Wikipedia" jako hiperłącze.

AtrybutyWiększość atrybutów elementów składa się z par nazwa-wartość, rozdzielonych znakiem "=", zawartych w znaczniku otwierającym elementu, po jego nazwie. Wartość może być zawarta w pojedynczych lub podwójnych cudzysłowach. Przy niektórych wartościach cudzysłowy mogą być pominięte (tylko w specyfikacji HTML, nie XHTML), jednak nie jest to zalecane, a wręcz praktyka taka uznana jest na niebezpieczną[26]. W przeciwieństwie do atrybutów w postaci par nazwa-wartość istnieją atrybuty mające wpływ na element poprzez samo ich zawarcie w znaczniku otwierającym[27] (np. ismap atrybut dla znacznika img[28]).

Znaczna część elementów może posiadać standardowe dla znaczników atrybuty: id, class, style, title, a także atrybuty związane z językiem lang i dir.

Atrybut id nadaje elementowi unikatowy identyfikator. Może on zostać użyty przez arkusze stylów do sprecyzowania wyglądu tego elementu lub przez skrypty np. do zmiany jego zawartości. Atrybut class służy do sklasyfikowania elementów dla celów prezentacyjnych. Dokument HTML lub zbiór takich dokumentów może używać klasy class="stopka", sugerując, że powinny być one wyświetlone na dole strony w postaci stopki. Elementy posiadające taką klasę mogą otrzymać styl, dzięki któremu zamiast wyświetlać się w miejscu występowania w kodzie HTML, będą zaprezentowane na dole strony w postaci stopki.

Autor może użyć znacznika style, aby nadać styl konkretnemu elementowi w kodzie HTML. Dobrą praktyką jest jednak nadanie elementowi unikatowego identyfikatora id, odnosząc się prezentacji tego znacznika w arkuszu stylów. Czasem jest to jednak nieporęczne podczas szybkiego testowania wyglądu elementów. Atrybutu title używa się w celu dodania do elementu informacji tekstowej. W wielu przypadkach zawartość atrybutu title wyświetlana jest w postaci podpowiedzi (tooltip), pojawiającej się na ekranie po najechaniu myszą na dany element. Wykorzystanie tych atrybutów może ułatwić znacznik span, należący do grupy znaczników typu inline.

<spanid="ZadaneId"class="DanaKlasa"style="color:blue;"title="Hypertext Markup Language">HTML</span>

Powyższy kod wyświetli niebieski napis HTML (najechanie wskaźnikiem myszy na skrót HTML powinno w większości przeglądarek wyświetlić podpowiedź z rozwinięciem skrótu).

Encje i referencje znakowe[edytuj | edytuj kod]

Począwszy od wersji 4.0, HTML definiuje listę 252 encji oraz 1114050 symboli znakowych, pozwalających na zapisanie określonych znaków za pomocą specjalnych stałych. Niektóre znaki można również zapisać dosłownie. Znak wprowadzony dosłownie i jego odpowiednik w postaci określonej stałej uznawane są za równoważne i są identycznie renderowane.

Zdolność alternatywnego zapisu znaków specjalnych "<" i "&" (zapisywanych odpowiednio jako &lt; i &amp;), umożliwia ich interpretację jako zwykłych znaków, zamiast traktowania ich jako istotnych elementów składni języka. Przykładowo, dosłownie zapisany znak "<"

-6-

wskazuje na początek znacznika otwierającego, a "&" wskazuje na rozpoczęcie ciągu

znaków, mającego być zinterpretowanym jako encja lub symbol (referencja znakowa). Zapisanie tego znaku jako "&amp;" lub "&#x26;" lub "&#38;" pozwala na użycie "&" w wartości elementu lub wartości atrybutu. Znak podwójnego cudzysłowu, ", użyty w wartości atrybutu, także musi zostać zapisany jako "&quot;" lub "&#x22;" lub "&#34;", gdyż wartość atrybutu sama jest opatrzona z obu stron właśnie takimi cudzysłowami (wprowadzonymi do kodu dosłownie). Ponieważ autorzy stron często zapominają o używaniu stałych, przeglądarki stały się pod tym względem bardzo tolerancyjne, traktując znaki wprowadzone dosłownie jako kod, tylko w przypadkach, gdy dalszy ciąg kodu wskazuje na użycie tych znaków jako elementów składni języka.

Alternatywnego zapisu znaków (zwanego także ucieczką, ang. escaping) używa się do wprowadzania symboli, których nie da się łatwo wpisać dosłownie z klawiatury. Np. symbol "é", wykorzystywany standardowo tylko w klawiaturach zachodnioeuropejskich, może być zapisany jako encja &eacute; lub jako referencja znakowa &#233; lub &#xE9;. Znaki zawarte w referencjach (czyli "&", ";", litery w słowie "eacute" itd.) są dostępne na wszystkich klawiaturach i we wszystkichkodowaniach znaków, podczas, gdy znak "é" – nie.

Typy danychHTML definiuje kilka typów danych, wprowadzanych jako wartości elementów lub atrybutów. Są to m.in. skrypty (script data), dane arkuszy stylów (stylesheet data), identyfikatory, nazwy, adresy URI, liczby, jednostki miary długości, języki, deskryptory mediów, kolory, kodowania znaków, data i czas, itp.

Deklaracja typu dokumentuAby uaktywnić definicję typu dokumentu (DTD) do celów poprawnej walidacji utworzonej strony, a także w celu uniknięcia działania przeglądarek w trybie quirks, dokument powinien rozpoczynać się deklaracją typu dokumentu (nieformalnie DOCTYPE). DTD, do którego odwołuje się sekcja DOCTYPE, zawiera gramatykę i zasady wykorzystywania znaczników w dokumencie podporządkowanemu określonemu DTD. Większość graficznych przeglądarek korzysta z sekcji DOCTYPE, a także innych dodatkowych informacji, warunkując tryb renderowania danej strony.

Przykład:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"

www.w3.org/TR/html4/strict.dtd">

Powyższa deklaracja odwołuje się do wersji Strict DTD specyfikacji HTML 4.01, która nie posiada znaczników prezentacyjnych, takich jak <font>, wykorzystując w tym celu kaskadowe arkusze stylów oraz znaczniki <span> i <div>. Walidatory kodu odczytują DTD w celu poprawnego sparsowania dokumentu i przeprowadzenia jego walidacji.

Dodatkowo HTML 4.01 obsługuje jeszcze wersje Transitional i Frameset. Wersja Transitional została stworzona w celu płynnego przejścia do wersji Strict, natomiast wersja Frameset obsługuje dokumenty wykorzystujące mechanizm ramek.

Semantyczny HTML

Nie istnieje oficjalna specyfikacja nazwana „Semantyczny HTML”, jednak poniżej zawarte wskazówki związane są właśnie z tworzeniem poprawnego, semantycznego kodu HTML.

-7-

Semantyczny HTML jest swego rodzaju celem i praktyką tworzenia dokumentów za pomocą kodu zawierającego tylko znaczenie, które autor chciał nadać poszczególnym częściom tekstu, bez informacji na temat prezentacji. Klasycznym przykładem jest różnica pomiędzy elementem <em> i elementem <i>. Zwykle element wzmacniający znaczenie jest renderowany w postaci pochylonej czcionki, dlatego wizualnie jeden i drugi wyglądają tak samo. Jednak wzmocnienie znaczenia tekstu różni się od wyświetlenia np. tytułu książki, który także może zostać wyświetlony za pomocą czcionki pochyłej. W czystym semantycznym kodzie HTML, tytuł książki używałby innego znacznika niż <em> (np. <span>), ponieważ znaczeniowo są to dwie różne rzeczy.

Tworzenie semantycznego kodu wymaga od autorów:

1. unikania znaczników prezentacyjnych2. używanie dostępnych znaczników do wyodrębnienia znaczeń poszczególnych

fraz i struktury w dokumencie. Np. tytuł książki będzie potrzebował własnego znacznika i klasy: <cite class="booktitle">Lamy świata</cite>. Tutaj został użyty znacznik <cite> dlatego, że najbardziej pasuje do znaczenia tej frazy w tekście. Element <cite> nie jest jednak na tyle precyzyjny, aby dokładnie określić rodzaj przytaczanego tytułu. Tutaj został użyty w celu przytoczenia tytułu książki, a nie np. tytułu artykułu w gazecie lub czasopiśmie. Pomimo tego, znaczenie na pewnym ogólnym poziomie zostało uchwycone i zapisane.

Semantyczny HTML wymaga także kompletnej specyfikacji oraz oprogramowania przestrzegającego zasady w niej zawarte. Głównie rozwój i wzrost popularności kaskadowych arkuszy stylów CSS zachęcił autorów stron do używania semantycznego HTML-a. CSS pozwala całkowicie oddzielić warstwę semantyczną od warstwy prezentacji poprzez trzymanie kodu odpowiedzialnego za wygląd w osobnym pliku CSS. Semantyczny HTML posiada wiele zalet:

Zapewnia zgodność stylów elementów posiadających to samo znaczenie. Każdy nagłówek, cytat, czy inne podobne do siebie elementy otrzymają ten sam wizualny styl.

Uwalnia autorów od potrzeby myślenia na temat sposobu prezentacji dokumentu. Gdy autor zapisuje liczbę dwa, nie musi się martwić, czy ma ją zapisać w postaci słowa ("dwa"), czy w postaci numerycznej (2). Semantyczny znacznik może wyglądać następująco <number>2</number>, pozostawiając szczegóły jego prezentacji autorowi arkusza stylów.

Sprawia, że dokument staje się niezależny i może być formatowany na wiele sposobów. Semantyczny dokument może być parowany z nielimitowaną liczbą arkuszy stylów, dostosowujących wygląd do ekranu komputera, wysokorozdzielczych drukarek, urządzeń mobilnych, przeglądarek wykorzystujących syntezatory mowy lub urządzeń dostosowanych dla osób posługujących się alfabetem Braille’a itd. Aby tego dokonać, nie są potrzebne żadne zmiany w semantycznym kodzie HTML.

Niektóre aspekty oddzielenia warstwy znaczeniowej od warstwy prezentacji są trudne i problematyczne. Niektóre elementy są hybrydami, które swoim znaczeniem warunkują sposób prezentacji, np. tabela wyświetla dane w formie tabelarycznej.

-8-

Zaprezentowanie tabeli przez syntezator mowy wymaga zamiany typowo wizualnego tworu na formę dźwiękową. Z drugiej strony piosenki – twory prezentowane za pomocą dźwięków – bardzo często prezentowane są w formie tekstowej. Dla tego typu elementów rozdzielenie znaczenia od formy prezentacji nie jest łatwe, jednak nie są one często spotykane.

Pozyskiwanie HTML-a

Dokumenty HTML mogą być pozyskiwane za pomocą tych samych środków, za pomocą których są pozyskiwane inne pliki. Najbardziej popularnymi sposobami pozyskiwania dokumentów HTML są serwery HTTP oraz poczta e-mail.

Publikowanie HTML-a za pomocą HTTPSieć WWW składa się głównie z dokumentów HTML przekazywanych z serwerów WWW do przeglądarek za pomocą protokołu HTTP. Aby umożliwić przeglądarce rozpoznanie pliku jako dokumentu HTML, musi być on specjalnie oznaczony. Służą do tegometadane zawierające typ MIME (text/html dla HTML 4.01 i wcześniejszych, application/xhtml+xml dla XHTML 1.0 i późniejszych) oraz standard kodowania znaków.

W nowoczesnych przeglądarkach typ MIME przesyłany wraz z dokumentem HTML warunkuje sposób interpretowania strony przez przeglądarkę. Dokument wysłany z typem MIME w postaci XHTML lub wysłany jako application/xhtml+xml, jest traktowany jako poprawnie zapisany plik XML. Każdy błąd składniowy w takim pliku uniemożliwi przeglądarce wyświetlenie tego pliku. Ten sam dokument przesłany z typem MIME w postaci HTML lub wysłany jako text/html, może zostać częściowo wyświetlony, gdyż przeglądarki bardziej pobłażliwie traktują standard HTML. Jednak plik XHTML parsowany w ten sposób nie jest poprawnym dokumentem XHTML, ani nawet HTML, ale tzw. mieszaniną znaczników.

Jeśli typ MIME zostanie rozpoznany jako inny niż HTML, przeglądarka nie powinna pozwolić na renderowanie dokumentu jako HTML, nawet jeśli dokument zawiera poprawną deklarację typu dokumentu. Tym niemniej niektóre z przeglądarek próbują rozpoznać typ pliku przy pomocy jego adresu URL, pomimo że ta praktyka jest zabroniona w specyfikacji HTTP 1.1.

HTML w poczcie elektronicznejWiele graficznych klientów pocztowych pozwala na wykorzystywanie podzbioru znaczników HTML w celu wykorzystania semantyki oraz formatowania niedostępnego przy pisaniu wiadomości za pomocą czystego tekstu, np. podkreślenie znaczenia tekstu, blokowe cytaty, diagramy, wyrażenia matematyczne itd. Część tych klientów posiada edytor GUI do tworzenia e-maili w HTML-u oraz silnik renderujący służący do wyświetlania otrzymanych wiadomości HTML.

Wykorzystywanie HTML-a w poczcie e-mail jest kontrowersyjne z uwagi na problemy z kompatybilnością, ataki phishingowe, możliwość oszukiwania filtrów antyspamowych oraz większy rozmiar wiadomości w stosunku do czystego tekstu.

Konwencje nazewnicze

Najpopularniejszym rozszerzeniem plików zawierających kod HTML jest .html. Popularnym jego skrótem jest .htm, wywodzący się ze starszych systemów operacyjnych i systemów plików (DOS, FAT), limitujących rozszerzenia plików do trzech znaków.

-9-

Obie formy rozszerzeń są obsługiwane przez wszystkie nowsze przeglądarki.

Kategoryzacja podziałów języka HTML

Od samego początku HTML zdobywał uznanie w relatywnie szybkim tempie. Niestety nie istniały wtedy żadne standardy stojące na straży czystości kodu. Pomimo tego, że autorzy HTML-a stworzyli go jako język semantyczny, praktyczne użycie wtłoczyło do niego wiele elementów i atrybutów prezentacyjnych, głównie z powodu producentów przeglądarek. Ostatnie standardy związane z HTML-em odzwierciedlają wysiłki zmierzające do uporządkowania z czasem chaotycznego rozwoju języka oraz utworzenia racjonalnych fundamentów pod budowę sensownych i dobrze prezentujących się dokumentów. Aby skierować rozwój coraz mniej semantycznego języka na właściwe tory, konsorcjum W3C ustanowiło standard kaskadowych arkuszy stylów CSS oraz rozszerzalny język arkuszy stylów XSL, przenosząc na nie ciężar warstwy prezentacji. Dzięki nim język HTML powoli zaczął wyzbywać się znaczników prezentacyjnych.

Aktualnie wyróżniamy dwie kategorie podziałów standardu HTML:

1. HTML bazowany na języku SGML versus HTML bazowany na języku XML (XHTML)

2. wersja Strict versus wersja Transitional versus wersja FramesetOparty na SGML i oparty na XMLW celu odróżnienia od tradycyjnej wersji bazowanej na SGML-u, specyfikacja HTML-a oparta na XML-u nosi nazwę XHTML. Pomimo tego element główny wykorzystywany w składni języka nadal nazywa się 'html'. Organizacja W3C chciała, aby XHTML 1.0 był identyczny z HTML 4.01, poza pewnymi obejściami wynikającymi z ograniczeń wynikających ze specyfikacji samego XML-a w stosunku do bardziej złożonego SGML-a. Czasem w wyniku tak ścisłego pokrewieństwa, autorzy dokumentacji scalają obie nazwy jako (X)HTML lub X(HTML).

Podobnie jak HTML 4.01, XHTML 1.0 posiada trzy wersje: strict, transitional i frameset.

Poza deklaracją otwierającą różnice pomiędzy HTML-em 4.01 i XHTML-em 1.0 są w większości syntaktyczne. Składnia HTML-a pozwala na więcej swobody podczas pisania kodu niż XHTML. Są to elementy z opcjonalnymi znacznikami otwierającymi lub zamykającymi, a nawet elementy puste, które nie mają znacznika zamykającego. W przeciwieństwie do HTML-a XHTML wymaga, aby wszystkie elementy posiadały znaczniki otwierające i zamykające. W konsekwencji XHTML wprowadza znaczniki, które mogą być otwarte i zamknięte tylko w znaczniku otwierającym, wstawiając znak "/" (ukośnik) przed końcem znacznika otwierającego, np. <br/>. Wdrożenie tego skrótu może stwarzać problemy dla starszego oprogramowania, któremu ta konwencja jest obca.

W celu zrozumienia subtelnych różnic pomiędzy HTML-em i XHTML-em przedstawione poniżej kroki prezentują transformację dokumentu XHTML 1.0 do dokumentu HTML 4.01:

1. Język elementu powinien być zapisany przy użyciu atrybutu lang zamiast XHTML-owego xml:lang.

2. Usuń XML-ową przestrzeń nazw (xmlns=URI). HTML nie obsługuje przestrzeni nazw.

-10-

3. Zmień deklarację typu dokumentu z XHTML 1.0 na HTML 4.01.

3. Jeśli istnieje, usuń deklarację XML (np. <?xml version="1.0" encoding="utf-8"?>).

4. Upewnij się, że typ MIME dokumentu jest ustawiony na text/html; zarówno dla HTML-a jak i XHTML-a, informacja ta pochodzi z nagłówka HTTP Content-Type, przesyłanego przez serwer

5. Zmień składnię XML elementów pustych na odpowiednią składnię HTML (<br/> na <br>)

Stosując się do wytycznych związanych z kompatybilnością (compatibility guidelines) organizacji W3C, przeglądarka powinna poprawnie zinterpretować typ dokumentu jako HTML lub XHTML. W3C zezwala na serwowanie dokumentów XHTML 1.0 jako HTML (MIME text/html) lub jako XHTML (MIME application/xhtml+xml lub application/xml). Jeśli dokument serwowany jest jako XHTML, przeglądarka używa parsera XML, stosującego się do specyfikacji XML.

Transitional versus StrictOstatnia specyfikacja HTML 4.01, a także wczesna specyfikacja XHTML posiadają trzy wersje: Strict, Transitional (nazwaną też Loose) i Frameset. Strict reprezentuje poprawną wersję standardu, podczas gdy warianty Transitional i Frameset zostały wprowadzone w celu płynnego przejścia ze starszych wersji HTML. Transitional i Frameset, w opozycji do Strict, pozwalają na używanie znaczników prezentacyjnych.

Zasadnicze różnice pomiędzy wersjami Transitional i Strict, pokazują, że Transitional jest bardziej tolerancyjny dla koderów. Obejmują one:

Mniej restrykcyjny model treści (content model)

Elementy typu inline i czysty tekst (#PCDATA) są dozwolone bezpośrednio w

znacznikach: body, blockquote, form, noscript i noframes.

Elementy prezentacyjne

podkreślenie (u),

przekreślenie (s i strike),

center,

font,

basefont.

Atrybuty prezentacyjne

background i bgcolor dla elementu body,

align dla elementów div, form, paragraph (p) oraz nagłówków (h1...h6)

align, noshade, size oraz width dla elementu hr

align, border, vspace oraz hspace dla elementów img oraz object

align dla elementu legend oraz caption

align oraz bgcolor dla elementu table

nowrap, bgcolor, width, height dla elementów td oraz th

bgcolor dla elementu tr

-11-

type, compact oraz start dla elementów ol i ul

type oraz value dla elementu li

width dla elementu pre

Dodatkowe elementy w wersji Transitional

lista menu (brak substytutu, jednak zalecana jest lista nienumerowana; może

powrócić w specyfikacji XHTML 2.0)

lista dir (brak substytutu, jednak zalecana jest lista nienumerowana)

isindex (element wymaga obsługi po stronie serwera)

applet (przestarzały na rzecz elementu object) Element pre nie zezwala na użycie elementów: applet, font i basefont Atrybut language w elemencie script Elementy związane z mechanizmem ramek

frameset (używany zamiast elementu body w wersji Frameset)

frame

iframe

noframes

atrybut target w elementach anchor, client-side image-map

(imagemap), link, form i baseFrameset versus TransitionalW odniesieniu do powyższych różnic, wersja Frameset posiada inny model treści (content model):

<html><head>Wartości elementu head.</head>

<frameset><frame></frame>

<noframes></noframes></frameset></html>

issu-12-

Przykład dokumentu

Prosty przykład strony WWW w HTML-u z ustawieniem języka polskiego:

<!doctype html>

<htmllang="pl"dir="ltr">

<head><metahttp-equiv="Content-Type"content="text/html; charset=UTF-8"><title>Tytuł strony</title></head>

<body><h1>Nagłówek pierwszego poziomu</h1><p>Akapit (z ang. paragraph)<br/>i jeszcze trochę tekstu w następnym wierszu<br/>a to jest <ahref="http://pl.wikipedia.org">link do Wikipedii</a>.</p></body>

</html>

-13-

Spis treści

 

1 Opis wstępny

2 Historia

o 2.1 Początki

o 2.2 Pierwsza specyfikacja

o 2.3 Historia wersji

2.3.1 Wersje HTML-a

2.3.2 Wersje XHTML-a

o 2.4 Współczesność

3 Komponenty języka HTML

o 3.1 Znaczniki (tagi)

o 3.2 Atrybuty

o 3.3 Encje i referencje znakowe

o 3.4 Typy danych

o 3.5 Deklaracja typu dokumentu

4 Semantyczny HTML

5 Pozyskiwanie HTML-a

o 5.1 Publikowanie HTML-a za pomocą HTTP

o 5.2 HTML w poczcie elektronicznej

o 5.3 Konwencje nazewnicze

6 Kategoryzacja podziałów języka HTML

o 6.1 Oparty na SGML i oparty na XML

o 6.2 Transitional versus Strict

o 6.3 Frameset versus Transitional

7 Przykład dokumentu HTML

8 Edytory HTML

o 8.1 Popularne edytory HTML

8.1.1 Windows

8.1.2 Linux

8.1.3 Mac OS X

9 Przypisy

10 Zobacz też

11 Linki zewnętrzne

-14-