World Wide Web Consortium, W3C
Перевірка HTML коду на валідність сайтів DLE. Перевірка CSS коду шаблону дле на валідність офіційному сервісом W3C
Вітаю всіх! Сьогодні мова піде про HTML і CSS коді, точніше про перевірки валідності. Валідність - це відповідність коду певним нормам. Задає нам ці норми Консорціум Всесвітньої павутини (від англ. World Wide Web Consortium, W3C).
Перевірка HTML коду на валідність сайтів DLE. Перевірка CSS коду шаблону дле на валідність в офіційному сервісі W3C
World Wide Web Consortium, W3C
Консорціум встановлює стандарти всесвітньої павутини і завданням розробників програмного забезпечення, зокрема, інтернет-браузерів, радить впроваджувати ці стандарти в свої розробки. На жаль, не всі вони дотримуються цих норм.
Перевірка HTML коду на валідність офіційним сервісом W3C
Офіційний ресурс W3C надає веб-майстрам дуже корисні сервіси, для виявлення помилок HTML і CSS коді, є валідатор. Щоб потрапити на головну сторінку сервісу Validate HTML W3C перейдіть за посиланням.
Виберіть найкращий варіант перевірки для вашого ресурсу з трьох вкладок
Вибравши будь-який з варіантів натискаємо Check відкриється наступна сторінка. Для прикладу я перевірив головну сторінку Яндекса і ось що отримав:
Як бачите, сервіс показав що є 38 помилок і 8 попереджень. Дотримуватися абсолютно всі стандарти дійсно складно, тим більше для такого великого порталу. Нижче буде наведено список помилок і попереджень з докладним їх описом та рекомендаціями щодо їх виправлення:
Помилки і попередження валідатора все англійською, але якщо знаєте сама мова HTML, то зрозумієте і суть, а якщо немає, то можна завжди знайти інформацію в пошуку або скористайтеся яким небудь форумі, пов'язаним з сайтобудування та веб-дизайном. Відповіді неодмінно знайдуться;).
Налаштування перевірки HTML
На сторінці Ви знайдете налаштування перевірки, які можуть дуже стати в нагоді:
Пам'ятайте в методах виправлення помилок для різних CMS (системи управління сайтом) немає, тому що HTML всюди однаковий. Інша справа якщо помилки в самому двигуні, у Вашому випадку на DataLife Engine DLE. тому не завжди їх вдається виправити без втрати працездатності. CMS спочатку може бути побудована правильно, і єдине що може викликати помилки, так це всілякі плагіни і сторонній код (банери, лічильники). Іноді доводиться чимось жертвувати і відмовлятися.
Для успішного просування ресурсу важливо дотримуватися стандартів W3C, але численні плагіни в більшості своїй роблять свою «чорну» справу і все псують, час покаже!
Що нам дає валідний код?
В першу чергу це гарант правильного відображення сторінок в сучасних браузерах. Знизиться швидкість завантаження сторінок. Також, правильний код може сприятливо вплинути на ранжування в пошуковій видачі! Тому, не варто відкладати це на довгий час і по можливості перевірити сайт (шаблон) на валідність, можливо навіть зараз!
Перевірка CSS на валідність офіційному сервісом W3C
Каскадна таблиця стилів CSS (від англ. Cascading Style Sheets) - спеціальна технологія, що дозволяє описувати зовнішній вигляд документа мовою розмітки. За допомогою CSS можна легко виконати верстку, не захаращуючи код самого документа, що значно прискорює швидкість завантаження.
Дуже важливо правильність таблиць стилів для будь-якого сайту, тому для перевірки існує корисний сервіс, який надає W3C.
Що дає перевірка CSS коду?
Наприклад у вашого шаблону на дле в CSS стилях прописаний запит на завантаження графічного зображення, але цього графічного зображення (картинки) в папці немає. В результаті, ваш сайт буде зависати при кожному завантаженні сторінки, що не дуже добре. А, що якщо таких картинок куча? Сайт, буде жахливо довго завантажуватися.
Буває також особливо з безкоштовними шаблонами дле і ріпами в CSS коді прописані настройки не відносять не до одного файлу шаблону dle. це теж є грубою помилкою і зайвим сміттям.
Щоб уникнути таких проблем, раджу скористатися даним сервісом для пошуку і виправлення помилок.
Перейдемо на пропонований сервіс для перевірки валідність CSS і перевіримо для прикладу головну сторінку Яндекса. Пройшовши по посиланню на сторінку валідатора CSS відкриється нове вікно, яке буде виглядати наступним чином:
На відміну від HTML W3C нас чекає приємне здивування! Все російською мовою! Крім того, є можливість вибору мови з 18 доступних. Внизу сторінки є примітка, бачимо примітка про необхідність перевірки коду HTML на валідність. У вікні присутні вкладки, що пропонують нам на вибір що необхідно перевірити:
URI
завантажений файл
набраний текст
Результати перевірки CSS
І знову Яндексу необхідно попрацювати над помилками. З перших рядків таблиці видно, що помилки в основному пов'язані з параметром border-radius, що відповідає за обрізка кутів, що не підтримує стандарт CSS2.1, який використовується в конкретному випадку. Насправді це не критично, просто не підтримують такі параметри браузери не будуть дотримуватися цього правила, а відобразять прямі кути.
Налаштувань практично немає, сервіс пропонує нам згенерований валідний код таблиці стилів, який буде відображений після списку всіх помилок і попереджень:
Інформація про коректне CSS
Правильно вивчивши, порівнявши з вихідним варіантом, можна виявити методи виправлення помилок і попереджень, а після вжити заходів щодо їх усунення.
Увага! Стилі CSS коду engine.css шаблону Dle управляє оформленням модулів і спливаючі підказки движка DataLife Engine. тому видаляти що-небудь варто вкрай обережно. Іноді буває такого файлу немає в шаблоні, дизайнер верстки перейменував файл або поєднав в один файл стилю CSS, що природно не зовсім добре і зручно.