Почти стандартный режим

Этот режим основан на стандартном режиме с некоторыми исключениями: отображение изображений внутри ячеек таблицы и рисунков друг под другом происходит как в режиме совместимости. Для переключения в почти стандартный режим применяется один из следующих доктайпов.

Для HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Для фреймов в HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

Для XHTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">

Для фреймов в XHTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN">

Стандартный режим

Продолжая тему режимов браузера, рассмотрим стандартный режим — режим поддержки стандартов (X)HTML и CSS. Для переключения браузера в этот режим используется один из следующих доктайпов.

Для HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<!DOCTYPE html>

Для XHTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Режим совместимости

Этот режим предназначен для отображения веб-страницы подобно старым браузерам. В режиме совместимости игнорируются стандарты HTML и CSS, и поведение браузеров становится непредсказуемым. Для переключения в режим совместимости существует множество доктайпов, вот лишь некоторые из них.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">

Также переход происходит, если доктайп вообще не указан или не может быть распознан.

Режимы браузеров

Во время противостояния браузеров Internet Explorer и Netscape каждый из разработчиков старался улучшить своё детище, чтобы усилить позиции программы на рынке и привлечь больше пользователей.  Netscape 4 и IE4 ужасно поддерживали веб-стандарты, поэтому следующая версия, IE5 должна была не только исправить ошибки IE4, но и показать улучшенную поддержку спецификации CSS. Это было необходимо еще и по политическим мотивам, поскольку компания Майкрософт вошла в группу W3C и начала оказывать сильное влияние на разработку HTML и CSS.

В процессе работы над браузером IE5 его разработчики столкнулись с неожиданной трудностью. Разница при отображении страницы в разных версиях браузера была настолько велика, что множество сайтов оказались бы неработоспособными при просмотре в IE5. Идея сделать кнопку для переключения в режим совместимости пришла только в версии 8.0, поэтому разработчики IE5 пошли другим путём. Все старые страницы отображались по старым правилам, а для включения режима поддержки стандартов в код страницы необходимо добавить элемент <!DOCTYPE> (доктайп).

Режимы Internet Explorer

Вокруг Internet Explorer сложилась ситуация, которая больше не прослеживается ни с одним другим браузером — разброс версий начинается с 6.0 и заканчивается 9.0. Причины использования устаревших версий могут быть совершенно разные.

  • Internet Explorer встроен в операционную систему Windows и неопытные пользователи даже не подозревают о наличии альтернативы.
  • Корпоративные пользователи с ограниченным доступом не могут самостоятельно обновить версию или сменить браузер.
  • Обновление IE до новой версии происходит через систему Windows Update, которая часто отключается по требованиям безопасности или для снижения интернет-трафика.
  • Некоторые приложения, например, банковские, могут быть «заточены» для работы только под конкретную версию IE.
  • В силу инерции мышления, когда пользователю нравится та программа, с которой он привык работать.

Библиотека minify

При редактировании CSS-файла возникает противоречивая задача. С одной стороны код должен быть удобным для восприятия и редактирования, быстрого отыскания нужного селектора, для чего активно применяются отбивки, комментарии, пробелы и символы табуляции. С другой стороны, объем кода должен быть компактным и не содержать в себе ничего лишнего. Компактность позволяет несколько ускорить загрузку сайта и повысить его производительность.

Данное противоречие решается наличием двух версий CSS-файла: один для редактирования, а второй для загрузки на сервер. Сам же процесс сокращения кода называется минимизацией и вполне автоматизирован с помощью специализированных программ или сетевых сервисов. Но если приходится часто вносить изменения в CSS-файл, то процесс минимизации становится неудобным. Сами посудите, вначале надо отредактировать файл, затем его минимизировать и полученный код сохранить в файл, который нужно залить на сервер. Слишком много действий приходится совершать ради одного изменения. Логичнее было бы возложить задачу минимизации на сайт. Загрузили файл на сервер, и вот он уже в компактном виде отдается посетителям. Одно из таких универсальных решений называется minify, это библиотека на PHP5. Она минимизирует, объединяет и кэширует CSS-файлы, а также JavaScript.

Форматирование кода CSS

Существует множество разных подходов, как же писать CSS-код. Кто-то упорядочивает селекторы по блокам, другой согласно структуре документа, третий по алфавиту. На форуме после обсуждения этого вопроса выявилась вполне закономерная тенденция — сколько людей, столько и мнений. Поэтому предлагаю ознакомиться с онлайновым инструментом, который форматирует CSS-код сразу четырьмя разными способами. А вы уж сами решайте, какой из них вам симпатичнее.

Приложение

Марк Пилгрим

Оригинал: http://diveintohtml5.info/everything.html

Перевод: Влад Мержевич

Почти алфавитный не ерундовый справочник по определению всего

Затруднения? Прочитайте Проверка технологий HTML5 для знакомства с основами. Хотите вместо этого библиотеку все-в-одном? Попробуйте Modernizr.

Opera 11

Если посмотреть статистику использования браузеров в Рунете, то можно однозначно заявить, что IE постепенно сдает свои позиции, а на первое место выходят Firefox и Opera. Даже сложив между собой разные версии браузеров, получим, что лидер сменился и суммарное использование Opera и Opera Mini, выше, чем у всех остальных браузеров, включая Internet Explorer. Возможно, не очень корректно учитывать браузер для мобильных устройств, тем не менее, тенденция очевидна. В остальном мире влияние Оперы не столь впечатляюще, но в Рунете этот браузер любят и активно используют люди самых разных профессий. Очередная, одиннадцатая версия Оперы должна укрепить лидерство браузера и, возможно, переманить к себе сторонников Internet Explorer и Firefox.

Если сравнивать с предыдущей версией 10.63, то каких-то глобальных изменений не заметно, однако сделан большой шаг вперед по отношению к десятой ветке в целом. Интерфейс стал удобнее, красивее и вобрал в себя последние тенденции разработчиков браузеров. Поскольку меня Опера интересует в первую очередь как разработчика, я кратко опишу некоторые новые возможности и подробнее остановлюсь на вещах, связанных с созданием сайтов.

Сумасшедшие формы

Марк Пилгрим

Оригинал: http://diveintohtml5.info/forms.html

Перевод: Влад Мержевич

Каждый знает о веб-формах, не так ли? Вставляем тег <form>, несколько <input type="text">, может быть <input type="password">, завершаем это все кнопкой <input type="submit"> и готово.

Вы не знаете и половины об этом. HTML5 определяет более десятка новых типов полей, которые вы можете использовать в своих формах. И когда я говорю «использовать», я имею в виду что их можно использовать прямо сейчас — без каких-либо прокладок, хаков или обходных путей. Не волнуйтесь сильно, я не хочу сказать, что все эти новые захватывающие возможности на самом деле поддерживаются в любом браузере. Совершенно нет, я не имею в виду, что всеми. В современных браузерах, да, ваши формы покажут все, на что они способны. Но в старых браузерах ваши формы по-прежнему будут работать, хотя и не в полной мере. То есть эти возможности элегантно деградируют в каждом браузере. Даже в IE6.