Великий Путь Вебмастера от идеи до интернет бизнеса
Блог Романа Чуешова
Начни зарабатывать на создании сайтов, лендингов, мобильных приложениях и новейших интернет технологиях
Рубрика:Основы HTML

Как проверить html код вашего сайта на ошибки и почему это так важно в современном мире сайтостроения

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

Если подробнее, то я в деталях опишу, как и какими программами проверить html код на ошибки, что такое Консорциум Всемирной паутины, который более известный под аббревиатурой W3C и дам определение важным терминам. Предоставляемая информация в статье поможет вам не только проверять страницы сайтов на корректность, а и конкретнее разобраться с понятием валидации в общем. Давайте начнем!

Каждой программе нужно двойное В: валидация и верификация

Каждый написанный программный код проходит проверку корректности семантики и логики связей объектов. Если использовать терминологию, то это называется валидация и верификация. Их используют во многих областях IT: программирование, сайтостроение, тестирование и т.д.

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

Итак, валидация – это проверка созданного документа с кодом на наличие ошибок в написании элементов, соответствие мировым единым стандартам, которые установлены в W3C, и прописанным спецификациям самого языка.

Валидация и верификация

При помощи проверки кода на валидность, разработчик может исправить найденные так скажем «ляпы» среди написанного текста. Для большей наглядности я перечислю некоторые из них:

  • Неверно написанные теги, атрибуты или свойства;
  • Поставлены лишние скобки;
  • Обнаружен не закрытый элемент;
  • Не указан или неверно указан тип <!DOCTYPE>;
  • Ошибочно вложены теги;
  • Нет указания обязательных атрибутов.

Теперь рассмотрим верификацию.

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

С какой целью существует Консорциум Всемирной паутины?

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

Это способствует усовершенствованию мировой сети, ее гибкости, универсальности, а также достижению полной совместимости между создаваемой аппаратурой и программными продуктами.

W3C также выпускает свои пакеты программ, среди которых есть и validator.w3.org. Это один из наиболее известных сервисов для проверки валидности кода.

w3c проверка валидности кода

Сайт validator.w3.org поддерживает проверку программ в трех режимах: онлайн-режим проверки вписанного кода в диалоговое окно, валидация по ссылке на ресурс и проверка загруженного файла.

А теперь подробнее познакомимся с работой в данном сервисе.


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

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

Расширений мне, побольше!

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

Так, на сцене появляется HTML Validator для Firefox и Chrome. Так как данные браузер занимают почетные места среди лидеров, всемирная организация создала под них встраиваемый валидатор HTML Validator. Он разработан по принципу сайта validator.w3.org, однако имеет явное преимущество – функционирует без подключения к сети.

html валидатор

Установить представленное расширение можно тремя способами:

  1. Через привычную нам панель расширений;
  2. Через указания пути документа с расширением;
  3. Загрузкой «в лоб». В системных файлах нужно найти каталог Firefox (допустим C:\Program Files\Chrome или C:\Program Files\Mozilla Firefox), а в ней подкаталог extension, куда и копируется расширение.

После повторного запуска браузера, расширение вступит в силу.

HTML Validator очень прост в использовании. Он не работает на русском языке, однако обладает интуитивно понятным интерфейсом.

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

Просмотреть код можно сразу в браузере при помощи функции «Просмотр исходного кода страницы» или горячей клавиши F12.

Еще немного программ для вадидации

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

А теперь я хочу добавить небольшой бонус в виде описания одного онлайн-сервиса, который проверяет код всех популярных веб-языков, снабжен конвертером и многими другими полезными вещами. Это сайт http://www.freeformatter.com. Он проверяет как html-текст, так и даже запросы на XPath.

Еще один html валидатор

Для проверки сайта стоит только или вставить текст документа, или ссылку на проверяемый ресурс.

На этом я закончу публикацию. Делитесь ссылкой на статью с друзьями и не забывайте подписываться на мои обновления. Желаю удачи! Пока-пока!

С уважентем, Роман Чуешов


Прочитано: 301 раз
Этот блог уже читают
читай и ты!
Оставить коментарий
:p :-p 8) 8-) :lol: =( :( :-( :8 ;) ;-) :(( :o: