Разбор ошибок валидации сайта


Наконец-то появилось свободное время между бесконечной чередой заказов, и я решил заняться своим блогом. Попробуем его улучшить в плане валидации. Ниже в статье я расскажу, что такое валидация сайта, кода html и css, зачем она нужна и как привести сайт к стандартам на конкретном примере.

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

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

Конкретный пример прохождения валидации для страницы сайта

Возьмем первую попавшуюся страницу на моем сайте - Кодирование и декодирование base64 на Java 8. Забьем адрес страницы в валидатор и смотрим результат:

Errors found while checking this document as HTML 4.01 Transitional! Result: 105 Errors, 67 warning(s) Да уж, картина вырисовывается неприятная: больше сотни ошибок и 67 предупреждений – как вообще поисковики индексируют мой блог, и заходят люди? Но не будем огорчаться, а научимся проходить валидацию, справлять ошибки. Итак, первое предупреждение:

Unable to Determine Parse Mode! The validator can process documents either as XML (for document types such as XHTML, SVG, etc.) or SGML (for HTML 4.01 and prior versions). For this document, the information available was not sufficient to determine the parsing mode unambiguously, because: the MIME Media Type (text/html) can be used for XML or SGML document types No known Document Type could be detected No XML declaration (e.g ) could be found at the beginning of the document. No XML namespace (e.g ) could be found at the root of the document. As a default, the validator is falling back to SGML mode. Warning No DOCTYPE found! Checking with default HTML 4.01 Transitional Document Type. No DOCTYPE Declaration could be found or recognized in this document. This generally means that the document is not declaring its Document Type at the top. It can also mean that the DOCTYPE declaration contains a spelling error, or that it is not using the correct syntax. The document was checked using a default "fallback" Document Type Definition that closely resembles “HTML 4.01 Transitional”. Это одно и тоже. А исправляется просто: в самом начале страницы добавить тег:

Проверяем,что у нас получилось и видим, что одним этим тегом мы убрали 105 ошибок и 3 предупреждения! Теперь у нас осталось только 64 предупреждения. Начинаем разбирать их по одному.

Warning: The type attribute for the style element is not needed and should be omitted. From line 5, column 1; to line 5, column 23 /x-icon">↩↩↩↩↩A Это значит, что для элемента style не нужен атрибут type – это лишнее. На странице у нас два таких замечания. Аналогичное предупреждение и по JavaScript:

Warning: The type attribute is unnecessary for JavaScript resources. From line 418, column 1; to line 418, column 31 ↩↩$(doc Таких у нас 8 ошибок. Убираем данные атрибуты и ура – еще на 10 предупреждений меньше!

Error: CSS: background: The first argument to the linear-gradient function should be to top, not top. At line 39, column 61 0%,#E8E8E8 100%);↩ border-r Следующая ошибка - первый аргумент у linear-gradient должен быть to top, а не top. Исправлем. Далее ошибка:

Error: CSS: Parse Error. From line 65, column 13; to line 65, column 16 margin: 0 auto;↩padd Здесь у меня неверно закомментировано css. Надо просто убрать эту строку. Или закомментировать по-другому /* и */. Я так сделал, как привык так .

Error: CSS: @import are not allowed after any valid statement other than @charset and @import.. At line 88, column 74 0,600,700,300);↩@import url(// Теперь у нас идет ошибка импорта. Перенесем эти строчки в самое начало файла и она исчезнет.

Error: Bad value _blanck for attribute target on element a: Reserved keyword blanck used. From line 241, column 218; to line 241, column 295 cookies..php?id=98" target="_blanck" style="display: inline;">Здесь Далее не нравится значение атрибута target, нам сообщают, что надо использовать «blank» без нижнего подчеркивания спереди. Убираем.

Error: End tag li seen, but there were open elements. From line 379, column 2; to line 379, column 6

    ↩ ↩↩
↩↩↩↩↩↩

↩↩↩

Close