Якщо ви не знали, то між звичайним будівництвом і «зведенням» сайтів є багато спільного. У процесі створення будинку та інтернет ресурсу потрібно дотримувати правильні пропорції між основними частинами.
При цьому важливо дотримуватися встановлених правил і стандартів, а також дотримуватися розмірність, зазначеної у проектній документації. Інакше будівлю або інтернет ресурс можуть не пройти процедуру валідації. І тоді доведеться все починати спочатку:
Валідація в сайтобудуванні
Тепер все вищесказане «натягнемо» на принципи побудови сучасного інтернету. Але у віртуальному просторі, як і в королівстві кривих дзеркал все не так однозначно. І значення обох термінів (валідації та верифікації) просто злилися воєдино:
Під валідацією сайту розуміється відповідність програмного коду ресурсу всім встановленим і загальноприйнятим нормам розробки, верстки і веб-дизайну. А також тим умовам, які були висунуті замовником виконавцю і прописані в ТЗ розробляється ресурсу.
Але найчастіше під валідністю мається на увазі саме відповідність коду (програмного, html і css) загальноприйнятим і визначеним нормам. Існує кілька організацій, що займаються стандартизацією сучасного веб-простору. Але найбільш авторитетної з них є Консорціум Всесвітньої павутини (W3C):
Саме спираючись на його стандарти, найчастіше, визначається валідність ресурсу або окремого коду незалежно від мови або технології, які використовувались для написання.
Встановлені консорціумом W3C стандарти є авторитетними для всіх мов програмування та технологій, які застосовуються для створення сайтів. А також для HTML, XML і CSS.
Для перевірки валідності існують спеціальні онлайн-сервіси, так звані «валідатори». Вони дозволяють перевірити на відповідність стандартам W3C сайт або частину коду, і виявити помилки валідації, які були допущені при їх написанні.
Найбільш авторитетним онлайн-вадидатором є ресурс validator.w3.org:
Дійсний HTML
Здавалося б, все просто! Для валідації будь-якого сайту потрібно лише пропустити код через валідатор, виправити помилки і все. Але не все так просто у віртуальному просторі. Буває, що навіть самий дійсний сайт не буде коректно відображатися в одному з браузерів.
Основною причиною не валідності «працюючого» html є проблема кросбраузерності. Деколи професійному верстальнику доводиться спеціально писати завідомо не валідний гіпертекстовий код, щоб всі частини верстаемого їм ресурсу однаково відображалися у всіх сучасних і застарілих версіях браузерів.
Проблема кросбраузерності в даний час майже вирішена. І все завдяки тому, що при створенні розробники браузерів дотримуються загальноприйнятих стандартів W3C.
Але це не є основною причиною того, від чого страждає валідація html:
- Не закритий тег – велика частина тегів в html є парними, тобто складаються з відкриває і закриває елемента. Часто при верстці або написанні сценарію веб-майстри забувають дописувати закриваючий тег. А це може призвести до неправильного відображення всього сайту;
- Порушення вкладеності елементів – ця проблема виникає при блокової верстки, коли не дотримується ієрархічну структуру всіх блоків
. Або інших парних елементів, якщо частина тега відкрита в одному шарі, а закривається в іншому. При цьому можливе порушення структури дизайну сайту; - Використання атрибуту style – в сучасному сайтобудуванні загальноприйнятою нормою є використання для оформлення елементів дизайну каскадних таблиць стилів (CSS). Застарілий атрибут style вживається вкрай рідко: при його використанні обсяги html коду можуть збільшуватися в рази. Це не тільки уповільнює швидкість завантаження всього сайту, але і затруднює його розуміння та подальше редагування;
- Використання вкладеного CSS – впровадження каскадних таблиць стилів всередину html. Це також збільшує обсяг коду і ускладнює його налагодження. Найкраще стильові опису зберігати в окремих файлах:
Проблема валідності CSS
Більша частина проблем з кросбраузерністю виникає саме з-за помилок відображення оформлення елементів, заданого за допомогою CSS.
Точніше, щоб вирішити проблему коректного висновку дизайну сайту у всіх браузерах, верстальщику доводиться застосовувати не зовсім «валідні» (на думку W3C) засоби:
- Коментарі – коли в коментарях (найчастіше для IE) прописується альтернативне значення властивості, невидиме для інших браузерів;
- Хакі – під ними розуміються спеціальні властивості CSS, дозволяють вирішити проблему некоректного відображення в одному з браузерів:
- За допомогою JavaScript – зміна стильового властивості елемента через об’єктну модель документа.
Застосування цих способів (особливо хаків) може негативно впливати на валідність всього сайту, але в теж час дозволяє повністю вирішувати проблему кросбраузерності.
Валідність CSS не є гарантом працездатності ресурсу.
Валідність XML
Набагато простіше все йде з валідністю XML. Щоб створювати чистий код, потрібно дотримуватися зводу основних синтаксичних правил цієї мови:
- Не забувати про необхідність обов’язкової наявності кореневого елемента;
- Не забувати закривати тег;
- Пам’ятати про те, що XML є залежним від регістра мовою;
- Пам’ятати про необхідність дотримуватися ієрархію вкладеності елементів;
- Значення кожного атрибута вказується в закритих лапках.
Часто зустрічаються помилки валідації
- Unknown entity…
Найчастіше таке повідомлення валідатор видає при використанні знаку амперсанда (&) в тій частині адресного рядка, через яку передаються змінні та їх значення. Для недопущення та виправлення даної помилки замість & слід використовувати &. Приклад:
… — неправильно.
… — правильно.
- Missing tag
Таке повідомлення видається, якщо порушена ієрархічна вкладеність тегів. Приклад:
Lorem
— неправильно.
Lorem
— правильно.
- Missing DOCTYPE
Найчастіше валідатор видає це повідомлення, якщо вміст елемента і сам елемент записані в нижньому регістрі. Необхідно пам’ятати, що даний елемент є залежним від регістра тегом. Приклад:
— неправильно.
— правильно.
- There is no such element…
Ця помилка виникає, якщо один або декілька тегів записані у верхньому регістрі. Приклад:
Lorem
— неправильно.Lorem
— правильно.
- Missing closing tag
Ця помилка валідації виникає, якщо один з «порожніх» тегів у своїй закриває частини не містить слеш ( XHTML). До порожнім відноситься тег . Приклад:
- required attribute «alt» not specified
Таке повідомлення видається валідатором, якщо тег не містить в собі атрибут alt, встановлює для зображення альтернативний текст. Приклад:
- Missing » «
Ця помилка виникає, якщо значення одного або декількох атрибутів записані не в лапках. Приклад:
І в кінці хотілося б вас застерегти від гонки за надмірної валідністю. Як завжди, істина знаходиться посередині: хороший код повинен бути валідним, але це ніяк не може позначатися на його працездатності. І це головне!
