Валидация HTML

Введение

Итак, вы написали несколько страниц HTML, и они, кажется, выводятся нормально, но имеется несколько не совсем правильных вещей. Как лучше всего начать поиск того, что неправильно, и гарантировать, что эти страницы (и написанные в будущем страницы) будут выводиться правильно в различных браузерах, без каких-либо ошибок?

Ответом является валидация (проверка на соответствие правилам)! Существует много доступных средств на сайте W3C и в других местах, которые позволяют выполнить валидацию кода сайта.

Наиболее известными валидаторами являются следующие:

• W3C MarkUp Validator (http://validator.w3.org/ ): Этот валидатор находит используемый в проверяемом документе doctype (X)HTML, и просматривает затем весь документ, указывая места, где код HTML не соответствует используемому doctype (т.е., где имеются ошибки кода HTML ).
• W3C Link Checker (http://validator.w3.org/checklink): Этот валидатор просматривает документ, представленный для проверки, и проверяет все ссылки в документе, чтобы гарантировать отсутствие неработающих ссылок (у которых значения href указывают на несуществующие ресурсы).
• W3C CSS Validator (http://jigsaw.w3.org/css-validator/): Как можно догадаться, этот валидатор просматривает документ CSS (или HTML/CSS ) и проверяет, что CSS соответствует спецификациям CSS.

В этой статье будет рассмотрен первый из этих инструментов, чтобы показать, как его использовать, и как интерпретировать типичные результаты, которые возвращает валидатор. Проверка ссылок достаточно очевидна, а валидатор CSS также станет вполне понятен после прочтения этой статьи и статей по CSS, которые будут представлены дальше в курсе.

Статья имеет следующую структуру:

• Ошибки
• Что такое валидация?
• Зачем нужна валидация?
• Различные браузеры интерпретируют неправильный код HTML по разному
  • Quirksmode
• Как выполнить валидацию страниц
  • Валидатор W3C HTML
• Заключение
• Дополнительные инструменты
• Контрольные вопросы

Ошибки

В программировании компьютеров существует, вообще говоря, два вида проблем кода:

• синтаксические ошибки - когда ошибки в записи кода не позволяют компьютеру правильно выполнить или скомпилировать программу.
• ошибки программирования (или логики) — когда код не полностью отражает замысел программиста.

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

HTML не является языком программирования. Синтаксические ошибки на Web -странице обычно не ведут к тому, что Web-браузер отказывается открыть страницу (хотя XHTML является более строгим, чем HTML -- по крайней мере, когда обрабатывается как данные application/xhtml+xml или text/xml, как и должно быть - и некоторые doctype запрещают использование определенных типов элементов HTML ). Это является одной из основных причин быстрого принятия и распространения Web.

Первый браузер Web, WorldWideWeb (http://www.w3.org/People/Berners-Lee/WorldWideWeb.html) написанный Тимом Бернерс-Ли, был также редактором, позволявшим людям создавать Web -страницы, не изучая сначала HTML. Этот редактор создавал неверный HTML. Это можно было бы исправить, но был создан важный прецедент, который существует во всех браузерах Web до сегодняшнего дня - суть которого в том, что предоставление людям доступа к контенту важнее, чем сообщение об ошибках людям, которые их не понимают или не могут их исправить.

Что такое валидация?

Хотя браузеры Web будут принимать плохие (недействительные в нашей терминологии) Web -страницы и делать максимум возможного для визуализации кода, делая наилучшие предположения о намерении автора, тем не менее, можно проверить, был ли HTML написан правильно, и на самом деле это нужно делать, как мы увидим ниже. Мы называем этот процесс "валидацией" HTML.

Программа валидации сравнивает код HTML на странице Web с правилами сопровождающего doctype и сообщает, какие правила и где были нарушены.

Зачем нужна валидация?

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

Существует некоторая доля истины в таком подходе, спецификация HTML не является совершенной, и сейчас существенно устарела. Некоторые вещи, которые, возможно, правильны (такие как начало упорядоченного списка в точке, отличной от 1) являются недействительными в HTML. Однако как говорит пословица:

Учите правила, чтобы знать, как нарушать их правильно

Существует две крайне важные причины для валидации кода HTML при его создании.

• Человек не совершенен, как и создаваемый им код — все делают ошибки, и Web -страницы будут более высокого качества (т.е., работать более согласованно), если выполоть все ошибки.
• Браузеры изменяются. В будущем браузеры, скорее всего, будут менее снисходительны при синтаксическом анализе недействительного кода.

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

Различные браузеры интерпретируют неправильный код HTML по разному

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

Но что будет, если передать браузеру недействительный (невалидный) код? Что тогда произойдет? Ответ состоит в том, что в браузере начинает работать обработка ошибок, чтобы определить, что делать с кодом. Браузер, как правило, поступает следующим образом: "ладно, этот код недействителен, как можно представить эту страницу конечному пользователю? Давайте заполним недостающее следующим образом!"

Звучит прекрасно, не правда ли? Если на странице имеется несколько ошибок, то браузер заполнит вместо вас недостающее? Не совсем так, так как каждый браузер делает это по-разному. Например:

<p><strong>This text should be bold</p>
<p>Should this text be bold? How does the HTML look when rendered?</p>
<p><a href="#"></strong>This text should be a link</p>
<p>Should this text be a link? How does the HTML look when rendered?</p>

Ошибки состоят в том, что элемент strong неправильно вложен в несколько блочных элементов, а элемент анкера не закрыт.

Когда вы попробуете вывести этот код в различных браузерах, они интерпретируют код совершенно по разному:

• Opera сделает последующие элементы потомками элемента strong.
• Firefox добавит дополнительные элементы strong между параграфами, которые не присутствуют в разметке.
• Internet Explorer поместит текст "This text should be a link" ("Этот текст должен быть ссылкой") вне тега анкера, который создает ссылку.

Исходную версию этого примера можно найти в статье Халворда Стина "Одинаковые ошибки DOM, различная интерпретация в браузерах" (http://www.thinkvitamin.com/features/dev/same-dom-errors-different-browser-interpretations) — прочтите ее, чтобы познакомиться с более глубокой обработкой ошибок HTML, и дополнительной информацией об инструментах отладки.

Ни одно из поведений различных браузеров не является неправильным; все они пытаются заполнить пробелы неправильного кода. Главный вывод состоит в том, что надо стараться избегать на странице недействительной разметки, если это возможно!

Quirksmode

Надо знать еще о так называемом режиме Quirksmode. Браузер переходит в этот режим, если встречает страницу, которая имеет неправильный doctype, или вообще не имеет doctype. В этом режиме браузер делает наилучшие предположения о множестве правил, согласно которым он должен интерпретировать код, и снова заполняет пробелы как можно лучшим образом. Этот режим существует в действительности для того, чтобы можно было все еще выводить старые страницы, и не должен никогда использоваться при создании новых страниц.