Валідація сайту або правильний html
Сьогоднішню статтю я хочу присвятити валідації сайту (тобто HTML). Спершу визначимо що означає цей термін! Валідація сайту - це перевірка синтаксичних помилок, перевірка вкладеності тегів і інші критерії. Як правило, валідатори (сервіси для перевірки сайтів на наявність помилок в структурі документа) перевіряють HTML-код на відповідність певному стандарту, який вказаний на самому початку будь-якої HTML-сторінки першим рядком. Якщо ви не знали для чого вона, тепер будете знати! # 128578; Але для чого, власне, потрібна ця сама валідація і на що вона впливає?
«Що таке валідація сайту?»
Як я вже говорив вище, валідація - це відповідність HTML-коду певним правилам і стандартам. На зміну XHTML прийшла технологія HTML5, яка значно полегшила життя розробникам. Справа в тому, що у версії XHTML синтаксис був дуже суворим. Якщо в HTML5 ви можете писати тег перенесення як без похилої риси, так в такому вигляді, то в XHTML буде вірним лише останній варіант. HTML5 не так суворий, та й до того ж з`явилося безліч корисних тегів, але не про це зараз # 128578; .
«На що впливає валідація сайту?»
А зараз відповімо на друге питання.
Валідація сайту дозволяє стежити за правильним відображенням сайту в різних браузерах. Наприклад, якщо не закрити тег або десь зробити помилку в коді, в подальшому одна і та ж сторінка може відображатися в різних браузерах по-різному. Також стилі для сайту (CSS) можуть відображатися не так як ви цього очікували. Тому необхідно уважно стежити за цим.
Також я не міг не сказати що валідація впливає на пошукові системи: пошукові системи віддають перевагу сайтам з дійсним HTML-кодом. Майте це на увазі!
Ну що, я вас переконав в тому, що валідація сайту дійсно необхідна? Тоді з теорією закінчили і переходимо до практики!
Способи перевірки валідації
Про кожного із способів я написав докладні інструкції у вигляді тексту, а також, якщо комусь ліньки читати і вникати, зняв відео # 128521; .
1 спосіб. сервіс validator.w3.org
Суть першого методу полягає у використанні сервісу для перевірки валідності сайту. Як перевірити валідність сайту за допомогою сервісу validator.w3.org:
1. Переходимо за адресою: validator.w3.org. Перед нами відкриється сторінка, на якій є 3 вкладки. На першій вкладці «Validate by URI» ви можете перевірити валідність сайту розміщеного в інтернет, на другий «Validate by File Upload» - завантажити файл з комп`ютера, і на третій «Validate by Direct Input» - вставити вміст файлу безпосередньо в форму для введення. Я буду розповідати про перший варіант, тобто коли сайт розміщений в інтернет (думаю і з іншими способами у вас проблем не виникне). Тому вибираємо першу вкладку як на зображенні нижче:
2. Далі натискаємо на кнопку «More options» і тут необхідно виставити наступні значення:
- Character Encoding - кодування вашого сайту. АЛЕ! Якщо вона вже є між тегами (У себе на сайті в браузері натискаєте на поєднання клавіш CTRL + U, і шукаєте на початку документа приблизно такий рядок
1
="cp1251" /gt;
), То тут залишаємо обраним (Detect automatically).
- Document Type - тип поточного документа. Він вказується першим рядком в HTML (коли перебуваєте на своєму сайті, в браузері натискаєте поєднання клавіш CTRL + U, і дивіться найпершу сходинку
1
). Якщо ж в першому рядку є щось схоже, тоді і тут залишайте значення (Detect automatically).
Якщо у вас щось з того, що я описав вище нету, тоді вам самостійно необхідно буде виставити ці значення. Я тут нічого не міняв і залишив все як є.
3. Потім в полі «Address» вводимо адресу вашого сайту як зробив я:
Після чого натискаємо на кнопку «Check», яка розташована по середині сірого блоку:
4. Далі йде валідація вашого сайту і через деякий час з`явиться результат валідації. Буде схожа сторінка з повідомленням «This document was successfully checked as HTML5!» (Що означає що ваш сайт успішно пройшов перевірку на валідність певного типу документа, тобто в моєму випадку HTML5):
Якщо у вас напис на червоному тлі - це значить що у вас присутні помилки в вашому HTML-документі. Їх необхідно виправити. Для цього просто виділяєте назву помилки (в відео я все це показую як робити) і вставляєте її, наприклад, в Google. Далі просто читаєте як з цією помилкою боролися інші веб-майстри і виправляєте її слідуючи цим радам. Також у вас є інший вихід - доручити цю справу знає людині, яка розбирається в коді, і нехай він це зробить за вас.
Для тих, хто не зрозумів або полінувався почитати - дивіться відео нижче # 128578;
2 спосіб. Плагіни для браузерів
1. Плагін для браузера Mozilla Firefox - Перейти
Переходьте за посиланням вище, вибираєте версію браузера Firefox і натискаєте на кнопку «Download». Потім вибираєте необхідну операційну систему і встановлюєте як звичайне доповнення. (Ті, хто не зрозумів, дивіться відео # 128578; )
2. Плагін для браузера Google Chrome - Перейти
Тут вам необхідно натиснути на кнопку «Безкоштовно» і потім у віконці натиснути «Додати».
3. Плагін для браузера Opera - Перейти
Тут також відбувається звичайна установка доповнення.
4. Плагін для браузера Safari - Перейти
установка:
- Розпакуйте архів з плагіном.
- Скопіюйте файл «Safari Validator.webplugin» в папку, де встановлений браузер, потім / Library / Internet Plug-Ins (створіть папку, якщо вона відсутня)
- Зробіть подвійний клік на файлі Safari Validator.safariextz.
- Перезапустити браузер Safari.
Як встановити плагін в Firefox і як користуватися ним я розповідаю в другому відео:
висновок
Ось і вся стаття. Сподіваюся відеоматеріали, а також текстова інформація, яку я тут представив допоможе вам поліпшити ваш сайт і зробити його ще більш «привабливим» для пошукових систем # 128578; , Адже ми всі так до цього прагнемо. Якщо виникають питання і складнощі на будь-якому етапі - пишіть в коментарях, будемо разом розбиратися! Той, хто дочитав до кінця статтю і виконав все, про що я писав - вже поліпшив свій сайт і результат не змусить себе чекати. # 128578;
Успіхів!
З повагою, Юрій Німець