Правильний doctype, блог про веб програмуванні

Ви написали правильний стандартний XHTML код і стандартний CSS. Ви скористалися стандартної специфікацією для роботи з DOM (Document Object Model), щоб управляти динамічними елементами на сторінці. І все-таки, в браузерах, які здавалося б зроблені з дотриманням саме цих стандартів, ваш сайт не працює. Швидше за все, помилка криється в неправильному заголовку DOCTYPE.

Що таке DOCTYPE?

Якщо ви будете користуватися неповним тегом DOCTYPE, застарілим його видом, або взагалі забудете про нього, броузер перейде в «загадковий» режим і буде виходити з припущення, що ви писали код сторінки з помилками і вільно відступали від стандартів, тобто так, як писали в кінці 90-их років.

В цьому режимі броузер спробує розібрати вашу сторінку за правилами зворотної сумісності і виведе на екран, наприклад, CSS так, як його вивів би Internet Explorer 4-ої версії, а DOM буде працювати так, як він працював саме в цьому браузері (IE перемикається в свій старий DOM, а Mozilla і Netscape 6 перемикається взагалі в бог знає що).

(Увага: броузер Opera не грає за такими правилами, він завжди намагається відобразити сторінку так, як якщо б вона відповідала стандартам. Слава Опері! З іншого боку, Opera поки не повністю підтримує стандарт W3C DOM, але робота над цим уже ведеться.)

Де ж взяти правильний DOCTYPE?

Так як теги DOCTYPE надзвичайно важливі для роботи Web-а по стандартам, і так як консорціум W3C є провідною організацією, що створює стандарти для Web-а, слід було б очікувати, що на сайті W3C буде представлений список всіх варіантів тега DOCTYPE, і здавалося б цю інформацію на сайті W3C можна знайти швидко і просто в якомусь певному розділі. Але це не так, принаймні на момент написання цієї статті.

Так, іноді W3C публікує серії навчальних статей. хоча більшість web-розробників про це навіть і не знає. Але в основному, сайт W3C містить зібрання пропозицій, проектів і Рекомендацій, які написані інженерами для інженерів. І коли я кажу про інженерів, я не маю на увазі простих фахівців в області web-розробок, таких спеців, як ви і я. Я маю на увазі інженерів, в порівнянні з якими ми виглядаємо повними бовдурами.

Я можу витратити весь день в пошуках правильних тегів DOCTYPE на сайті w3.org, але не знайду жодної сторінки, де вони перераховані всі разом. Якщо ж вам все-таки вдасться знайти якийсь тег DOCTYPE (наприклад, згадуваний в який-небудь Рекомендації або Робочому проекті), скоріше за все виявиться, що на вашому сайті він працювати не буде.

Увесь сайт W3C розкидані теги DOCTYPE, де в атрибутах відсутня URI, і теги DOCTYPE, що містять в атрибутах відносний URI, пов'язаний з документами, що знаходяться на тому ж самому сайті W3C. Якщо ви візьмете цей тег з сайту W3C, перенесете його на свій сайт і вставите в свої сторінки, відносний URI буде вказувати на неіснуючі на вашому сайті документи, отже марно пропаде ваш труд і зусилля броузера.

Наприклад, на багатьох сайтах можна зустріти на сторінках наступний варіант тега DOCTYPE, який був без всяких змін перенесений з сайту w3.org:

А виглядати DOCTYPE повинен ось так:

Зверніть увагу, що цей варіант DOCTYPE містить в кінці повний варіант URI. А так як тег вказує на правильне розташування документа, броузер знає, де цей документ треба знайти в мережі, і отже виведе вашу сторінку в тому стандарті, який ви згадали в DOCTYPE.

Правильні варіанти тега DOCTYPE

Отже, яким же варіантом тега DOCTYPE треба користуватися? Дуже добре, що ви задали це питання. Нижче перераховані повні варіанти тега DOCTYPE для різних потреб:

Стандарт HTML 4.01 Strict (строгий), Transitional (перехідний), Frameset (з фреймами)

Стандарт XHTML 1.0 Strict (строгий), Transitional (перехідний), Frameset (з фреймами)

Стандарт XHTML 1.1 DTD

Що далі?

Багато розробники ПЗ просто скопіювали неповні варіанти тега DOCTYPE з сайту W3C в свої програми. І в результаті: ви покладаєтеся на програму, яка вставляє неправильний варіант тега, броузер впадає в «загадковий» режим, а ви безуспішно б'єтеся над загадкою, чому ваші сторінки не працюють, як треба.