Исправляем основные ошибки валидации. Не откладывай!

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

Ошибки валидации

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

Для проверки кодов необходимо зайти на сервис validator.w3.org и ввести в строку адрес Вашего сайта. Этот сервис поможет Вам выявить все ошибки валидации, которые существуют на сайте. Некоторые оптимизаторы считают, что ни один сервис не способен выявить абсолютно все ошибки на сайте. Однако это не значит, что не нужно искать, выявлять и исправлять.

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

Проверка валидации

Процесс проверки состоит в определении соответствий кода сайта, которые должны иметь такие требования:

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

Еще один способ проверки валидации

С помощью плагина для гугл хром - HTML Validator for Chrome

В зависимости от браузера можно выбирать варианты:

• HTML Validator для браузера Firefox;
• HTML Validator for Chrome;
• HTML5 Editor для Opera.

Мне этот способ не понравился, т.к. он не заработал и не получилось ничего посмотреть и исправить, но потом я установил его с https://htmlvalidator.app/ и https://chromewebstore.google.com/detail/html-validator/aofddmgnidinflambjlfkpboeamdldbd/reviews?hl=en 

Ошибки валидации известны, а как их исправлять и что делать то?

Решение проблемы с исправлением ошибок валидации

Итог: сервис является обрезанной версией validator.w3.org и решения проблемы не решает, поэтому поищу другие варианты.

Заходим на старый добрый https://chatgpt.com/ и пишем там промпт:

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

Грузим html код - к сожалению частями, т.к. видимо по размеру количество знаков превышает допустимый лимит

Затем начинаем роботу скармливать ошибки, добавлять наовые куски кода на сайт и перепроверять тем же валидатором validator.w3.org

Итак ставим код и смотрим, что было:

А что стало?

В итоге я закидываю в chatgpt.com и получаю нормальный код и размещаю его на сайте. Если Вы не можете сами или вам лень - пишите мне на ватсапп на +7(987)10-55-799 - я за 500 рублей поудаляю 20 ошибок с вашего сайта, а может и  больше - как договоримся. 

Часто встречаемые ошибки валидации HTML: причины и решения

Так как роботы любят тексты - то я попросил робота написать текст про основные ошибки валидации и он мне этот текст написал:

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

1. Отсутствие закрывающих тегов Одна из самых распространённых ошибок — это забытые или неправильно размещённые закрывающие теги. Например, если забыть закрыть тег <div>, это может нарушить структуру страницы и привести к её некорректному отображению. Всегда проверяйте, чтобы каждый открывающий тег имел соответствующий закрывающий тег.

2. Неиспользуемые атрибуты и избыточные роли Многие разработчики добавляют атрибуты вроде role="navigation" к тегам, где это не требуется. Для элемента <nav> атрибут role="navigation" является избыточным, так как сам по себе элемент уже обозначает навигацию. Это может привести к предупреждениям при валидации.

3. Неверное использование заголовков Очень важно использовать заголовки (например, <h1>, <h2>) в правильном порядке. Заголовки помогают структурировать контент страницы и делают её более доступной для пользователей и поисковых систем. Часто встречается ошибка, когда на странице используется несколько <h1> или заголовки идут не по порядку.

4. Отсутствие атрибута alt для изображений Атрибут alt для изображений важен не только с точки зрения доступности, но и для SEO. Он предоставляет текстовую альтернативу изображениям для пользователей с ограниченными возможностями и помогает поисковым системам лучше понимать содержимое изображений. Забывать про этот атрибут — частая ошибка новичков.

5. Неправильная вложенность элементов Вложенность HTML-элементов должна быть логичной и правильной. Например, тег <p> не может содержать блочные элементы, такие как <div> или <h1>. Нарушение правил вложенности может вызвать ошибки в отображении и валидации.

6. Использование устаревших атрибутов и элементов В HTML5 многие старые элементы, такие как <font> и <center>, были заменены более современными средствами оформления. Использование устаревших элементов может привести к проблемам с совместимостью, особенно на мобильных устройствах.

7. Отсутствие атрибута lang в теге <html> Атрибут lang важен для определения языка страницы, что необходимо для правильной индексации и отображения контента. Его отсутствие может вызвать проблемы с доступностью, особенно для пользователей с нарушениями слуха или зрения.

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

• Продвижение
• Веб-сайт

Олег Крицкий

Руководитель

Готовы начать?

Позвоните нам:

---

+7(987)10-55-799

Заинтересованы в сотрудничестве ? Вы можете заказать продвижение своего сайта прямо сейчас

Заказать продвижение

Олег Крицкий

Руководитель

Готовы начать?

Позвоните нам:

---

+7(987)10-55-799

Заинтересованы в сотрудничестве ? Вы можете заказать создание своего сайта прямо сейчас

Заказать веб-сайт