webmaster webmastering webdesign

Jesteś tutaj: webmade.org >> artykuły >> standardy

Zmień XHTML 1.0 Strict na XHTML 1.1 !

autor: Mateusz Pilszek, ostatnia modyfikacja: 2007-03-15

szukaj: XHTML 1.0 XHTML 1.0 XHTML 1.1 XHTML 1.1 DTD DTD prolog prolog typ MIME typ MIME

Spotkałem wiele osób, które twierdziły, że zbudowanie strony w XHTML 1.1 jest trudne, ponieważ jest on zbyt restrykcyjny. Uważam, że jest to nieprawda, ponieważ XHTML 1.1 różni się tylko kilkoma szczegółami od starszego brata - XHTML 1.0 Strict. Postaram się przybliżyć je w poniższym artykule.

Prolog i definicja typu dokumentu (DTD)

Prolog XML nie musi występować, jednak jego dodanie na samym początku strony jest dobrą praktyką:

<?xml version="1.0" encoding="iso-8859-2" ?>

Pierwszą różnicą jest definicja typu dokumentu (DTD) następująca po prologu. Dla XHTML 1.1 brzmi ona następująco:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

Typ MIME dokumentu

Typ MIME dokumentu w XHTML 1.0 mógł być ustawiony jako text/html. W XHTML 1.1 musi być on zadeklarowany jako application/xhtml+xml:

<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-2" />

Można także używać dwóch innych – natywnych typów MIME – text/xml oraz application/xml.

Gdzie się podział atrybut lang?

Po prostu zrezygnowano z niego na rzecz nowocześniejszego atrybutu pochodzącego z XML. Tak więc aby określić język dla dowolnego elementu na stronie używamy atrybutu xml:lang. Aby określić język całego dokumentu, odpowiedni atrybut powinniśmy dodać do znacznika <html>:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl">

W XHTML 1.0 w powyższym kodzie mógł pojawić się także atrybut lang. Jego użycie w XHTML 1.1 jest zabronione.

Brak atrybutu style

XHTML 1.1 jest kolejnym krokiem wymuszającym na twórcy oddzielenie semantycznej treści od kodu określającego sposób prezentacji. Założenie jest takie – treść ma się znaleźć w dokumencie XHTML, natomiast kod CSS opisujący jej wygląd w osobnym pliku (najczęściej o rozszerzeniu .css). W najnowszej wersji XHTML nie znajdziemy więc atrybutu style. Wygląd strony powinniśmy zdefiniować w osobnym pliku CSS i dołączyć go za pomocą znacznika <link> umieszczonego w sekcji head:

<link rel="Stylesheet" href="styl.css" type="text/css" />

Nadal możemy korzystać z atrybutów class oraz id, dzięki czemu możemy określać wygląd konkretnych elementów strony z poziomu arkusza zewnętrznego.

Atrybut name nie do wszystkiego

Standard XHTML 1.1 zabrania korzystania z atrybutu name dla znaczników <a> i <map>. W przeszłości atrybut ten używano do tworzenia kotwic. Obecnie aby utworzyć kotwicę, należy korzystać z atrybutu id (identyfikator elementu):

<a id="kotwica">To będzie kotwica</a>

Zapamiętaj! Identyfikator musi być unikalny w obrębie całej strony. Teraz pewnie domyślasz się, dlaczego zlikwidowano atrybut name dla tych elementów. Na stronie mogłoby znaleźć się kilka kotwic o tej samej nazwie, więc skąd przeglądarka miała wiedzieć, do której z nich chce przejść użytkownik? Atrybut id rozwiązał ten problem.

Kotwica może być tworzona dla dowolnych elementów strony, np. nagłówków, obrazów, itp. Wystarczy określić dla nich atrybut id.

Dołączanie arkusza CSS

Standard XHTML 1.1 zaleca dołączanie arkuszy CSS za pomocą tzw. instrukcji przetwarzania XML. Powinna ona wystąpić zaraz po prologu:

<?xml version="1.0" ?>
<?xml-stylesheet href="styl.css" type="text/css" ?>

Niestety, metody tej nie obsługuje żadna przeglądarka, więc konieczne jest także użycie znacznika <link>, o którym wspomniałem wcześniej. Mimo to polecam stosować dodatkowo tę instrukcję, ponieważ nie jest wykluczone, że w przyszłości będzie ona jedynym sposobem włączania zewnętrznych arkuszy do dokumentów.

I już...?

Tak! Są to najważniejsze różnice pomiędzy XHTML 1.0 Strict a XHTML 1.1. Pamiętając kilka reguł, które zostały wprowadzone, możesz stworzyć stronę godną nowoczesnego webmastera. Pochwal się kolegom, że Twoja strona jest „na topie”.

Mateusz Pilszek

Osoby czytające tę publikację przeglądały również:

Chcesz zostać programistą?

Poznaj 6 kroków do efektywnej
nauki programowania!

 

valid XHTML
valid CSS
© 2004-2008 copyright by webmade.org