Оставьте Doctype, чтобы перевести браузеры в режим «Причуды»
Если вы разрабатывали веб-страницы более нескольких месяцев, вы, скорее всего, знаете о трудностях написания страницы, которая выглядит одинаково во всех браузерах. На самом деле это невозможно. Многие браузеры были написаны со специальными функциями, с которыми могли справиться только они. Или у них есть особые способы обработки вещей, которые отличаются от того, как их обрабатывают другие браузеры. Например:
- Слои были созданы для использования в браузерах Netscape. Они не работают ни в каком другом браузере и фактически устарели в Netscape 6.x +.
- Встроенные фреймы изначально создавались только для Internet Explorer и с тех пор стали частью спецификации HTML.
-
Internet Explorer 6.0 добавляет дополнительный пробел (например,
) вокруг тегов, если только вы не пишете содержимое div в одну (длинную) строку. (IE 6 имеет много других причуд, а также этот.) - Netscpe 4.7 не будет отображать таблицы, которые не написаны в правильном HTML – вместо этого он показывает пустую страницу. Это было исправлено в Netscape 6.
Проблема для разработчиков браузеров заключается в том, что им приходится создавать веб-браузеры, обратно совместимые с веб-страницами, созданными для старых браузеров. Чтобы решить эту проблему, создатели браузеров создали режимы для работы браузеров. Эти режимы определяются наличием или отсутствием элемента DOCTYPE и тем, что вызывает DOCTYPE
.
Переключение DOCTYPE и «Режим причуд»
Если вы добавили следующий DOCTYPE
на свою веб-страницу:
Современные браузеры (Android 1+, Chrome 1+, IE 6+, iOS 1+, Firefox 1+, Netscape 6+, Opera 6+, Safari 1+) интерпретируют это следующим образом:
-
Поскольку существует правильно написанный
DOCTYPE
, это запускает режим стандартов. - Это HTML 4.01 Переходный документ
- Поскольку он находится в стандартном режиме, большинство браузеров отображают контент, совместимый (или в основном совместимый) с HTML 4.01 Transitional.
И если вы добавите этот DOCTYPE
в свой документ:
Это говорит современным браузерам, что вы хотите отображать страницу HTML 4.01 в строгом соответствии с DTD. Эти браузеры перейдут в режим «строгого» или «стандартного» и отобразят страницу в соответствии со стандартами. (Таким образом, для этого документа такие теги могут быть полностью проигнорированы браузером, так как элемент FONT устарел в HTML 4.01 Strict.)
Если вы полностью пропустите DOCTYPE
, браузеры автоматически перейдут в режим «причуд».
В таблице ниже показано, что делают обычные браузеры, когда представлены разные общие объявления DOCTYPE
.
Microsoft делает это сложнее
В Internet Explorer 6 также есть функция, заключающаяся в том, что если вы поместите что-либо выше объявления DOCTYPE
, они перейдут в режим причуд. Итак, оба из этих примеров приведут IE 6 в режим причуд, даже несмотря на то, что объявления DOCTYPE
говорят, что они находятся в режиме строгих стандартов:
и XHTML 1.1 DOCTYPE
:
Плюс, если вы пройдете IE6, то у вас есть «особенность», которую Microsoft добавила в IE8 и IE9: переключение элементов META
и черный список сайтов. Фактически, эти две версии браузера теперь имеют до семи (!) Различных режимов:
- IE 5,5 причудливый режим (IE 8 и 9)
- Режим стандартов IE 7 (IE 8 и 9)
- IE 8 почти стандартный режим (IE 8 и 9)
- Режим стандартов IE 8 (IE 8 и 9)
- IE 9 почти стандартный режим (IE 9)
- Режим стандартов IE 9 (IE 9)
- Режим XML (IE 9)
В IE 8 также введен «Режим совместимости», в котором пользователь может изменить модель рендеринга обратно в режим IE 7. Таким образом, даже если вы установите режим, который вы хотите установить, используя элементы DOCTYPE
и META
, ваша страница может все еще быть возвращена в менее соответствующий стандартам режим.
Что такое Quirks Mode?
Режим Quirks был создан, чтобы помочь справиться со всей странной поддержкой рендеринга и несовместимых браузеров и взломами, которые веб-дизайнеры использовали для решения этих задач. Беспокойство производителей браузеров заключалось в том, что если они переключат свои браузеры на полное соответствие спецификациям, веб-дизайнеры останутся позади. Настроив переключение DOCTYPE
и «Режим причуд», это позволило веб-дизайнерам выбирать, как они хотят, чтобы браузеры отображали их HTML.
Эффекты Quirks Mode
Есть несколько эффектов, которые большинство браузеров используют в режиме Quirks:
- В некоторых браузерах блочная модель меняется на IE 5.5 версии блочной модели в режиме причуд.
- Некоторые браузеры не наследуют стили в таблицах
- Режим Quirks существенно влияет на синтаксический анализ CSS и макета CSS. Если вы конвертируете страницы в стандартный режим из режима Quirks, обязательно протестируйте свой макет CSS и проведите тщательный анализ.
-
Следите за изменениями в сценариях, когда в режиме причуд. Например, Firefox изменяет способ работы атрибута
id
. IE8 и IE9 очень сильно изменили сценарии в режиме причуд.
Есть также разница в режиме «Почти Стандарты»:
- Высота ячеек таблицы только с изображениями рассчитывается иначе, чем в стандартном режиме.
Как выбрать DOCTYPE
Я более подробно остановлюсь в моем списке статей DOCTYPE
, но вот несколько общих правил:
-
Всегда сначала выбирайте режим стандартов. И текущий стандарт, который вы должны использовать, – это HTML5: если у вас нет особых причин избегать использования HTML5
DOCTYPE
, это то, что вам следует использовать. - Перейдите к строгому HTML 4.01, если вам нужно проверить устаревшие элементы или по какой-то причине хотите избежать новых функций:
- Если вы нарезали изображения в таблице и не хотите их исправлять, перейдите к переходному HTML 4.01:
-
Не пишите страницы намеренно в режиме причуд. Всегда используйте
DOCTYPE
. Это сэкономит вам время на разработку в будущем и действительно не принесет пользы. IE6 быстро теряет популярность, и, разрабатывая для этого браузера (что по сути и является дизайном в режиме «Причуды»), вы ограничиваете себя, своих читателей и свои страницы. Если вам нужно писать для IE 6 или 7, используйте условные комментарии для их поддержки, а не переводите современные браузеры в режим причуд.
Зачем использовать DOCTYPE
Как только вы узнаете, что происходит переключение DOCTYPE
этого типа, вы можете напрямую воздействовать на свои веб-страницы, используя DOCTYPE
, который указывает, что браузер может ожидать от вашей страницы. , Кроме того, как только вы начнете использовать DOCTYPE
, вы будете писать HTML, который будет ближе к действительности (вы все равно должны его проверить). И, написав действительный XHTML, вы поощряете производителей браузеров создавать совместимые со стандартами браузеры.
Версии браузера и режим причуд
None | Режим причуд | Режим причуд | Режим причуд |
HTML 3.2 | |||
Режим причуд | Режим причуд | Режим причуд | |
HTML 4.01 | |||
Переходная | Режим стандартов * | Режим стандартов * | Режим стандартов |
Переходная | Режим причуд | Режим причуд | Режим причуд |
Строгий | Режим стандартов | Режим стандартов * | Режим стандартов |
Строгий | Режим стандартов | Режим стандартов * | Режим стандартов |
HTML5 | |||
Режим стандартов | Режим стандартов * | Режим причуд |