Пятница, 22 Января 2010 г. 21:41
+ в цитатник
Doctype это самый первый элемент любой верстки сайта. Многие начинающие верстальщики, из за недостатка информации, недооценивают этот ключевой элемент. Главное назначение данного элемента – предоставление браузеру информацию о типе(html,xhtml) использованной гипертекстовой разметки. После этого, зная какая разметка используется, браузер может валидировать ее. Существует два самых популярных типов гипертекстовой разметки: переходная(Transitional) и строгая(Strict). Так же есть третий тип разметки – фреймовая(Frameset), но она используется реже. Кроме того верстка еще делится на два типа: html, xhtml. XHTML является наследником XML, по этому в ней используются многие правила оформления перенятые от XML.
Вот примеры правильных доктайпов:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Ниже приведены основные различия между переходной и строгой разметкой:
Переходная совместимость (Transitional)
Составляющие:
- Правильный XHTML-код. (Также допустимо использовать HTML 4.01.);
- CSS для управления шрифтами, цветом, границами и другими элементами;
- Легкое использование таблиц XHTML для разметки. Следует избегать вложенных таблиц, возлагая эту работу на CSS;
- Дополнительно: можно применять структурные метки к значащим ячейкам таблицы (полезно для CSS и при создании скриптов, поможет в переходе к разметке CSS без таблиц);
- JavaScript/ECMAScript на базе DOM, допустимо разветвление кода.
Преимущества:
- Рациональная совместимость со старыми браузерами. Обратная совместимость с новыми продуктами – такие сайты будут отлично работать в новых браузерах и устройствах;
- Начало пути к окончательному переходу сайта на XML-код и CSS-разметку;
- Повышение доступности сайта, снижение риска потери части посетителей, соответствие нормам и требованиям по доступности;
- Частичное разделение содержания и дизайна (код все же содержит некоторые элементы дизайна);
- Элегантность, четкость и простота кода, снижение размера файлов,
уменьшение трафика и снижение расходов на производство, обслуживание и поддержку сайта.
Недостатки:
- Структура и внешний вид по-прежнему связаны, что несколько осложняет обслуживание и обновление сайта;
- По этой же причине в будущем поддерживать такие сайты будет все труднее, если учесть распространение основанных на XML систем управления
контентом (Content-management System – CMS). Вряд ли это станет проблемой для маленьких сайтов, но для крупномасштабных сайтов, содержащих сотни и тысячи динамических страниц, это может обернуться
большой головной болью.
Строгая совместимость(Strict)
Составляющие:
- Полное отделение структуры от оформления и поведения;
-
- Для разметки используется CSS. Таблицы применяются лишь по прямому
назначению – для отображения табличных данных, например адресных
книг, списков событий, учетных записей, электронных таблиц;
- Создание структуры страниц на XHTML 1.0 Strict или XHTML 1.0 Transitional;
- Акцент на структуре. В коде не содержится уловок по оформлению сайта.
- Структурные метки элементов дизайна;
- Для придания динамики сайту используются скрипты, основанные на
объектной модели DOM. Разветвление кода только в случае крайней необходимости;
- Атрибут повышения доступности и тестирование.
Преимущества:
- Более высокая степень совместимости с существующими и будущими браузерами и беспроводными устройствами;
- Легкий переход к более продвинутым формам основанного на XML кода;
- Элегантный, простой,и логичный код;
- Более легкое, быстрое и создание и обслуживание. Благодаря
снижению затрат на создание и поддержку сайта, маленькие бюджеты
можно уберечь от истощения, а большие использовать для наполнения
сайта контентом, дизайна, программирования, графики, фотографий,
редактирования и тестирования юзабилити;
- Проще интегрировать сайт с системами управления контентом на базе
шаблонов и динамической публикации;
- Благодаря CSS можно создавать дизайн, который невозможен при разметке с помощью таблиц HTML;
- Cайты будут работать в еще не созданных браузерах и устройствах.
Недостатки:
- Поддержка браузерами CSS еще не идеальна. Могут потребоваться некоторые доработки;
- Некоторые приемы, легко выполняемые с помощью таблиц HTML, невозможно осуществить с помощью CSS. Поэтому, возможно, потребуется переосмыслить определенные дизайнерские идеи;
- Динамические модели сайта на базе DOM не будут работать в браузерах
4.0 и более ранних версиях, а также в программах для чтения информации с экрана, текстовых браузерах и в большинстве беспроводных устройств. Для обеспечения функциональности в этих устройствах и браузерах потребуется использовать теги и возможности CGI.
источник http://zodios.net/htmlcss/saga-o-doctype.html
-
Запись понравилась
-
0
Процитировали
-
0
Сохранили
-