Валідація контенту сайту по w3c - студія клондайк

Що таке валідація html коду?

Html, як відомо, мова розмітки, який є основою для переважної більшості сторінок в інтернеті. Як у будь-якого іншого мови, у html є правила написання - синтаксис. Дійсний html-код це код, який відповідає всім рекомендаціям написання коду - специфікації.

Специфікації. Що це?

Як у будь-якого іншого мови, у HTML існують свої правила написання - синтаксис. Ці правила пише команда професіоналів, зацікавлених у розвитку html і займаються розробкою нових елементів, що відповідають параметрам сучасних пристроїв, актуальних сучасним технологіям і, найголовніше, що відповідають сучасним вимогам безпеки. Саме правила написання елементів html, встановлені розробниками мови, називаються специфікацією.

Скільки специфікацій існує.

Починаючи з HTML5, розробники і виробники браузерів можуть вибирати між двома різновидами одного і того ж мови розмітки: специфікаціями, розробленими консорціумом W3C, і тих, що розроблені WHATWG.

В принципі ці специфікації дуже схожі, однак, з роками, між ними все більше і більше відмінностей. Більшості вебмайстрів не варто сильно турбуватися з цього приводу: або ці відмінності специфікацій не скажуть на їх проектах, або розробники браузерів будуть підтримувати обидва стандарти мови.

Однак при використанні в своїх проектах щойно з'явилися нововведення в одній з специфікацій, у вебмайстрів можуть виникнути проблеми. Наприклад Девід Берон з Mozilla заявив:

Якщо HTML-специфікації W3C і WHATWG розрізняються, то ми намагаємося слідувати специфікації WHATWG.

Навіщо потрібна валідація?

Пошукові роботи сканують сторінки вашого сайту для пошуку релевантного контенту. Пошукові роботи підкоряються стандартам HTML. Якщо у вашому HTML коді є грубі помилки, то роботи можуть заплутатися і не знайти контенті на вашій сторінці. Чи не закритий тег або крива верстка сильно вдарять по вивченню вашого сайті роботами. Наявність битих посилань істотно сповільнить індексацію вашого ресурсу. Дійсний код в рази спрощує індексацію сторінок вашого сайту і дозволяє їм швидше опинитися у видачі.

Розбір помилок на прикладі головної сторінки сайту Клондайка.

У цій частині статті розберемо валідацію html5 по специфікації W3C на прикладі головної сторінки сайту студії Клондайк.

Як перевірити HTML код на валідність? Для перевірки валідації нашого HTML5 коду використовуємо відомий HTML Validator для перевірки відповідності коду w3c стандартам. Не дивлячись на те, що не всі HTML помилки призведуть до проблем пошукового ранжирування, деякі з них можуть утруднити пошуковим системам успішно індексувати сторінки і можуть зіпсувати всі ваші SEO зусилля.

Через пару секунд отримуємо результат перевірки.

У нашому випадку було виявлено 36 помилок.

Розглянемо кожну помилку окремо.

Як ми відразу бачимо, валідатор показує що на нашій головній сторінці присутній відразу 24 однотипних помилки - у нас не проставлено атрибут alt у картинок.

Дивимося вихідний код сайту:

Дійсно, у картинок не прописаний атрибут alt.

Навіщо потрібен цей атрибут? Коли завантажується сторінка, спочатку завантажується текст з атрибуту alt. а вже після йде зміна тексту на зображення. Якщо в браузері відключено завантаження картинок, то на місці зображення буде альтернативний текст (з атрибута alt).

Що ж, приступимо до виправлення. Для кожної картинки ми пропишемо відповідний їй атрибут alt.

Далі прибираємо зайвий закриває тег