Rozdział 9. HTML a XHTML
Co to jest XHTML?
XHTML to EXtensible HyperText Markup Language
XHTML jest niemal identyczny z HTML 4.01
XHTML ma czystszą formę niż HTML
XHTML jest aplikacją XML
XHTML 1.0 jest od 26 stycznia 2000 oficjalnym standardem sieciowym. Rekomendacja W3C oznacza, że specyfikacja jest stabilna i przetestowana.
Po co XHTML?
W sieci umieszczanych jest coraz więcej stron WWW, rośnie też liczba „złych” stron - stron, napisanych niepoprawnie. Taki kod HTML:
<html>
<head>
<title>Błędny kod HTML!</title>
<body>
<h1>TU JEST EWIDENTNY BŁĄD!
</body>
będzie wyświetlany poprawnie w większości przeglądarek, mimo, że zawiera błąd składni - brakuje w nim znacznika zamykającego </h1>.
XML nie dopuszcza takich wpadek. Dlatego połączenie języków XML i HTML daje nadzieję na stworzenie dobrego i stabilnego narzędzia. Dokumenty XHTML są interpretowane przez wszystkie urządzenia radzące sobie z językiem XML. XHTML pozwala tworzyć dokumenty o poprawnej strukturze, które działają we wszystkich przeglądarkach i są kompatybilne wstecznie.
Czy XHTML wymaga specjalnych przygotowań?
XHTML to kolejna generacja języka HTML, ale niewątpliwie trochę czasu upłynie zanim ludzie i urządzenia do niej się dostosują. Trochę, lecz niezbyt wiele. Należy pamiętać, że między HTML 4.01 a XHTML nie ma wiele różnic, nie będzie więc to trudny proces.
Podstawowe wymagania to kod pisany małymi literami i zamykanie znaczników - chyba możesz je spełnić.
Jakie są najważniejsze różnice między XHTML a HTML?
Elementy XHTML muszą być poprawnie zagnieżdżane
Dokumenty XHTML muszą mieć poprawną formę
Nazwy znaczników muszą być pisane małymi literami
Wszystkie elementy XHTML muszą być zamknięte
Co to oznacza konieczność poprawnego zagnieżdżania elementów?
W języku HTML wymaganie prawidłowego zagnieżdżania nie musi być restrykcyjnie spełniane. Na przykład wyrażenie sformułowane w HTML tak:
<b><i>Tekst pogrubiony i pisany kursywą...</b></i>
będzie w XHTML absolutnie niepoprawne. W XHTML zagnieżdżenie musi być prawidłowe:
<b><i>Tekst pogrubiony i pisany kursywą... </i></b>
Na przykład częstym błędem w zagnieżdżonych listach jest zapominanie, że lista zagnieżdżona musi być umieszczona w obrębie elementu li. Oto zły zapis:
<ul>
<li>Punkt 1</li>
<li>Punkt 2
<ul>
<li>Zagnieżdżony 1</li>
<li>Zagnieżdżony 2</li>
</ul>
<li>Punkt 3</li>
</ul>
A tutaj poprawny odpowiednik błędnego kodu:
<ul>
<li>Punkt 1</li>
<li>Punkt 2
<ul>
<li>Zagnieżdżony 1</li>
<li>Zagnieżdżony 2</li>
</ul>
</li>
<li>Punkt 3</li>
W poprawnym przykładzie znacznik </li> został wstawiony za znacznikiem </ul> listy zagnieżdżanej.
Co oznacza, że dokument musi mieć poprawną formę?
Oto wymagania, które określają poprawność formy. Wszystkie elementy XHTML muszą być zagnieżdżone w podstawowym elemencie html. Elementy podrzędne danych elementów stosowane są w parach i są prawidłowo zagnieżdżone w elemencie nadrzędnym. Podstawowa struktura dokumentu prezentuje się tak:
<html>
<head> ... </head>
<body> ... </body>
</html>
Dlaczego należy stosować małe litery?
Konieczność stosowania małych liter wynika z tego, że dokumenty XHTML są aplikacjami XML, a XML to język czuły na wielkość znaku. Tak więc znaczniki <br> i <BR> zostaną zinterpretowane jako różne.
Zgodnie z tym, zapisz kodu w takiej formie:
<BODY>
<P>Tekst</P>
</BODY>
jest niepoprawny. Poprawna postać powinna wyglądać tak:
<body>
<p>Tekst</p>
Dlaczego należy pamiętać o znacznikach zamykających?
Wszystkie elementy, które nie są puste, muszą mieć znaczniki zamykające.
Zgodnie z tym, zapisz kodu w takiej formie:
<p>Tekst
<p>Kolejny akapit
jest niepoprawny. Poprawna postać powinna wyglądać tak:
<p>Tekst</p>
<p>Kolejny akapit.</p>
A co z elementami pustymi?
Elementy puste muszą także zostać zaopatrzone w znacznik zamykający lub znacznik otwierający musi kończyć się znakami />.
Oto nieprawidłowa postać wyrażenia:
Tu dodamy łamanie wiersza<br>
A tu pojawi się linia pozioma<hr>
Poprawny zapis wygląda tak:
Tu dodamy łamanie wiersza<br />
A tu pojawi się linia pozioma<hr />
lub
Kolejna linia <hr></hr>
Dodatkowa spacja w zapisie znacznika zamykającego, <br /> , jest konieczna, aby zachować zgodność z obecnymi przeglądarkami.
Co oznacza stwierdzenie, że XHTM ma czystszą formę?
XHTML nie dopuszcza dowolności. Nazwy znaczników i atrybutów muszą być pisane małymi literami, wartości atrybutów muszą być podawane w cudzysłowach, skracanie definicji atrybutu jest niedopuszczalne, atrybut id zastępuje nazwę atrybutu, a DTD definiuje w dokumentach XHTML elementy obowiązkowe.
Skoro tak, to zapis:
<table WIDTH=100%>
będzie nieprawidłowy z dwóch powodów: nazwa atrybutu pisana jest wielkimi literami, a wartość nie została ujęta w cudzysłowach. Oto zapis poprawny:
<table width=”100%”>
Rezygnacja z możliwości skróconego zapisu atrybutów oznacza, że nie wolno zapisać tak:
<input checked>
<input readonly>
<input disabled>
<option selected>
Należy zastosować pełną postać zapisu:
<input checked=”checked”>
<input readonly=”readonly”>
<input disabled=”disabled”>
<option selected=”selected”>
Co oznacza, że atrybut id zastępuje nazwę?
W HTML 4.01 stosowany jest atrybut name, który definiuje nazwy następujących elementów: a, frame, iframe, img i map. W XHTML jego rolę przejmuje atrybut id.
Taki zapis będzie w XHTML niepoprawny:
<img src="obraz.gif" name="obraz" />
A tu postać prawidłowa:
<img src="obraz.gif" id="obraz" />
W celu zachowania zgodności z obecnymi wersjami przeglądarek, na razie należy stosować oba atrybuty, name i id, z tymi samymi wartościami. Na przykład:
<img src="obraz.gif" id="obraz" name="obraz" />
Należy także pamiętać o dodatkowej spacji przed /> (patrz uwaga o znacznikach zamykających w XHTML).
Co to jest atrybut lang?
Atrybut lang jest stosowany niemal z każdym elementem XHTML. Określa on język, w jakim zdefiniowana została zawartość:
<div lang="no" xml:lang="no">Kici kici!</div>
Jakie są obowiązkowe elementy XHTML?
Wszystkie dokumenty XHTML muszą zawierać deklarację DOCTYPE. Obowiązkowe są także elementy html, head i body, a element title musi być zawarty w obrębie elementu head. Oto podstawowy szablon dokumentu XHTML:
<!DOCTYPE Doctype goes here>
<html>
<head>
<title>Tytuł dokumentu</title>
</head>
<body>
Zawartość dokumentu
</body>
</html>
Deklaracja DOCTYPE nie jest częścią samego dokumentu XHTML, nie jest też elementem XHTML i nie może mieć znacznika zamykającego. Deklaracja DOCTYPE jest zawsze umieszczana w pierwszym wierszu kodu dokumentu XHTML.
Jak wygląda przykładowy dokument XHTML?
Oto przykład dokumentu XHTML:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Dokument XHTML</title>
</head>
<body>
<p>Tekst</p>
</body>
</html>
Deklaracja DOCTYPE określa typ dokumentu:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Reszta dokumentu wygląda jak zwykły dokument HTML:
<html>
<head>
<title>Dokument XHTML</title>
</head>
<body>
<p>Tekst</p>
</body>
</html>
Deklaracje typu dokumentu zostały zawarte w dodatku A.
2 Część I ♦ Podstawy obsługi systemu WhizBang (Nagłówek strony)
2 G:\HTML\r09.doc