Начебто ви зробили все правильно, але ваш сайт чомусь не виглядає або не працює, як очікувалося, в останніх версіях браузерів.
Ви написали правильний стандартний XHTML код і стандартний CSS. Ви скористалися стандартної специфікацією для роботи з DOM (Document Object Model), щоб управляти динамічними елементами на сторінці. І все-таки, в браузерах, які здавалося б зроблені з дотриманням саме цих стандартів, ваш сайт не працює. Швидше за все, помилка криється в неправильному заголовку DOCTYPE.
Що таке DOCTYPE
Тег DOCTYPE також важливий для правильного відображення і роботи сторінки в браузерах, які відповідають стандартам (Mozilla, IE5 / Mac, і IE6 / Win).
Якщо ви будете користуватися неповним тегом DOCTYPE, застарілим його видом, або взагалі забудете про нього, браузер перейде в "загадковий" режим і буде виходити з припущення, що ви писали код сторінки з помилками і вільно відступали від стандартів, т. Е. Так, як писали в кінці 90-х років.
В цьому режимі браузер спробує розібрати вашу сторінку за правилами зворотної сумісності і виведе на екран, наприклад, CSS так, як його вивів би Internet Explorer 4-й версії, а DOM буде працювати так, як він працював саме в цьому браузері (IE перемикається в свій старий DOM, а Mozilla і Netscape 6 перемикається взагалі невідомо під що).
Рекомендуємо прочитати Як засобами CSS змінити колір маркера html-списку
(Увага: браузер Opera не грає за такими правилами, він завжди намагається відобразити сторінку так, як якщо б вона відповідала стандартам. Слава Опері! З іншого боку, Opera поки не повністю підтримує стандарт W3C DOM, але робота над цим уже ведеться.)
Де взяти правильний DOCTYPE
Так як теги DOCTYPE надзвичайно важливі для роботи інтернету по стандартам, і так як консорціум W3C є провідною організацією, що створює стандарти для Web-а, слід було б очікувати, що на сайті W3C буде представлений список всіх варіантів тега DOCTYPE, і здавалося б цю інформацію на сайті W3C можна знайти швидко і просто в якомусь певному розділі. Але це не так, принаймні на момент написання цієї статті.
Так, іноді W3C публікує серії навчальних статей. хоча більшість веб-розробників про це навіть і не знає. Але в основному, сайт W3C містить зібрання пропозицій, проектів і Рекомендацій, які написані інженерами для інженерів. І коли я кажу про інженерів, я не маю на увазі простих фахівців в області веб-розробок, таких спеців, як ви і я. Я маю на увазі інженерів, в порівнянні з якими ми виглядаємо повними бовдурами.
Я можу витратити весь день в пошуках правильних тегів 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
Рекомендуємо прочитати Як підключити Яндекс.Спеллер до WordPress
Що далі
Багато розробники ПЗ просто скопіювали неповні варіанти тега DOCTYPE з сайту W3C в свої програми. І в результаті: ви покладаєтеся на програму, яка вставляє неправильний варіант тега, браузер впадає в "загадковий" режим, а ви безуспішно б'єтеся над загадкою, чому ваші сторінки не працюють, як треба.
В найближчому майбутньому
У нас є всі причини сподіватися, що W3C скоро викладе повний, точний і зручний список всіх варіантів тега DOCTYPE на своєму сайті.
Але так як кожен день створюються і випускаються в мережу все нові і нові сайти, ця інформація вам потрібна вже зараз, так от вона - користуйтеся.
UPD: Майбутнє вже настало
Найпростішою і надійної декларацією doctype для використання є та, яка визначена в HTML5: