Валидность HTML документа

Давайте сначала поговорим о термене “Валидность”. Валидность с латинского означает “сильный, здоровый, достойный”. Если мы возьмем такую науку как психология, то там валидностью называют обоснованность и пригодность применения методик и результатов исследования в конкретных условиях. Более прикладное определение понятия валидность - это мера соответствия методик и результатов исследования поставленным задачам

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

Если вы хотите ознакомиться с данным материалом в видео формате, вы можете найти запись в курсе Введение в HTML или просто перейти по ссылке. Также вы сможете получить методичку и перезентацию на данную тему под видео - уроком

Отсутствие ошибок в верстке документа - один из основных показателей качества разметки.

Предположим мы сформировали HTML документе версии 4.01 strict

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

    <body>
        <section>
            <span>Hello World</span>
        </section>
    </body>
</html>

Если вы пишите HTML код в современных текстовых редакторах или IDE, то такие редакторы валидность документа проверяют в реальном времени. Если же у вас простой текстовый редактор, не оснащенный инструментами валидации, то осуществить проверку соответствия стандартам можно при помощи специальных программ - валидаторов или онлайн сервисов, например “http://validator.w3.org/”.

Давайте проваледируем наш документ при помощи онлайн инструмента поставляемым w3.org

Перейдем по адресу онлайн валидатора, зайдем на вкладку “Validate by File Upload”, выберем файл с HTML разметкой, который хотим проверить и нажмем на кнопку “Check”

После небольшой паузы, онлайн валидатор отобразит ряд ошибок, которые были допущены при формировании документа

Первое что мы видим, это заголовок:

Errors found while checking this document as HTML 4.01 Strict!

Что в переводе означает:

Были найдены ошибки при проверке документа обозначенного как HTML 4.01 Strict

В секции “Result” мы можем увидеть, что онлайн валидатор обнаружил 2 критические ошибки и 2 предупреждения. Давайте рассмотрим их поочередно

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

No Character Encoding Found! Falling back to UTF-8

Это означает, что не была найдена строка, указывающая какую кодировку использовать для данного HTML документа и была применена кодировка по умолчанию. Давайте сразу исправим этот момент.

Установить кодировку можно при помощи элемента “meta”. Для версий HTML 4 кодировка указывается в атрибуте “content”

<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1">

Теперь документ выглядит следующим образом

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1">
        <title>Invalid Validity</title>
    </head>

    <body>
        <section>
            <span>Hello World</span>
        </section>
    </body>
</html>

Снова произведем проверку разметки при помощи онлайн валидатора

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

Ошибка выглядит следующим образом:

element “SECTION” undefined

Это означает, что элемент “section” не был найден. Давайте зайдем на портал “www.w3schools.com” и почитаем о данном элементе

В описании на данном сайте мы видим строку:

The <section> tag is new in HTML5

Тег “<section>” появился в HTML версии 5, а мы используем HTML версии 4, вследствие чего возникла ошибка. Давайте поменяем тег “section” на “div”

<div>
    <span>Hello World</span>
</div>

Снова произведем валидацию документа

Ура, валидация прошла успешно. Текст на зеленой плашке выглядит следующим образом:

This document was successfully checked as HTML 4.01 Strict!

можно перевести как

Документ был успешно проверен как HTML 4.01 Strict

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

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

Информация

Автор конспекта


Дата создания: 08.01.2019
Категория: HTML