Дизайнери витрачають години на відточування майстерності для ретельної підгонки найдрібніших деталей в дизайні веб сайтів, які виходять з-під їхнього пера. Однак якість коду дуже часто залишається досить низьким. Вам потрібні докази? Подивіться галереї безкоштовних шаблонів CSS. 90% шаблонів не пройдуть перевірку. Причому, основна частина помилок є досить примітивними і їх дуже легко виправити. У цьому уроці розглянемо типові помилки в коді HTML, які заважають успішному завершенню перевірки.
Навіщо перевіряти код?
Якщо сайт виглядає відмінно в браузері, то навіщо перевіряти код? Типове питання, що задається перед перевіркою коду. Але ж сайт не обмежується тільки тим, що видно користувачеві. Сторінки HTML призначені для представлення даних, а не графічних ефектів. Дані повинні бути доступними для читання для всього величезної спільноти людей, яка використовує інтернет. І читачі можуть використовувати зовсім інші технології для отримання інформації, представленої на вашому сайті - наприклад, вони можуть використовувати програму для відтворення даних голосом і просто слухати, що написано на вашій сторінці.
Сторінка HTML, яка не містить помилок, в основному буде коректно відображатися в більшості браузерів, а також буде відповідати вимогам майбутніх технологій. Тут варто згадати пошукові механізми, дія яких дуже важливо для цілей SEO. Ніхто не хоче створювати для них перешкод, а чистий і правильний код набагато легше сприймається пошуковими ботами.
Це також питання професіоналізму. Неправильний код HTML дуже схожий на граматичні помилки в написах на сайті. І хоча клієнт може і не помітити помилок в коді - це не змінює суті питання. Ніхто не любить граматичні помилки в дизайні, але залишати код HTML з помилками чомусь не вважається таким же ганебним діянням.
загальні помилки
Нижче представлені помилки, які виловлені в шаблонах з першої сторінки відомої галереї CSS шаблонів. Безліч сайтів виглядають відмінно і навіть чудово, але дуже часто якість коду не відповідає якості дизайну. Хоча більшість таких помилок може бути виправлено дуже швидко і просто.
Не вказаний тип документа
Найгірша помилка - не використовувати Doctype. Відсутність тега Doctype означає, що браузер буде "здогадуватися", яка мова використовувався для створення документа. Для виправлення помилки потрібно вказати тип документа вашої сторінки.
Не закрите елемент
Опускається символ / в самозакривних елементах
Більшість елементів HTML має окремі закривають теги, наприклад:
. Але є елементи, такі як input. img і meta. які є такими, що зачиняються, це означає, що вони повинні мати символ / перед закривається дужкою.
Нічого не зроблено конвертація спеціальних символів
Амперсанд, а також подвійні лапки, які копіюються з Word, є найпоширенішими причинами цієї помилки. Потрібно завжди перевіряти код на наявність таких символів і конвертувати до відповідного код HTML -. Також треба чинити і з іншими спеціальними символами.
Неконвертованого символи в URL
Відповідно до попереднього пункту, спеціальні символи, особливо амперсанд, повинні бути кодовані в рядках URL. Посилання на сайти, побудовані з використанням PHP, часто містять змінні з використанням символу . їх потрібно писати з використанням коду HTML -.
Блокові елементи всередині малих
Одне з основних правил HTML полягає в тому, що блокові елементи НІКОЛИ не повинні знаходитися всередині малих елементів.
Популярний приклад помилки - використання посилання в заголовку:
Ім'я класу, ID або ім'я атрибута не може починатися з цифри. Вони можуть включати цифри, але не на початку слова.
А яка ситуація з перевіркою CSS коду?
На відміну від HTML, CSS використовується для візуального представлення сторінки. Таким чином, питання "Якщо сторінка виглядає добре, то навіщо перевіряти код?" В даному випадку звучить більш переконливо. Неправильний код CSS не має такого впливу на веб сторінки, як неправильний код HTML. Однак перевірку варто проводити на предмет виявлення помилок і помилок в коді. Якщо ви використовуєте нові властивості CSS3, вони зроблять ваш документ не пройшов перевірку, так як ще не включені в специфікацію, але якщо ви впевнені, що все правильно, то на такі помилки можна не звертати увагу.
5 останніх уроків рубрики "HTML і DHTML"
При написанні або налагодження PHP скриптів ми частенько користуємося функціями var_dump () і print_r () для виведення попередніх даних масив і об'єктів. У цьому пості я б хотів розповісти вам про функції var_export (), яка може перетворити масив в формат, придатний для PHP коду.
Створення шаблону для листа не така вже й проста справа. Пропонуємо вам підбірку з 30 сайтів, де можна безкоштовно скачати подібні шаблони на будь-який смак.
Наприклад у вас є поле пошуку, яке обробляється при кожному натисканні клавіші клавіатури. Якщо хтось захоче написати слово Windows, AJAX запит буде відправлений за наступними фрагментами: W, Wi, Win, Wind, Windo, Window, Windows. Проблема ?.
Підбірка з 15 нових сайтів, де можна скачати безкоштовні фотографії для заповнення своїх сайтів.
Проблема тільки в тому, що на
PROGRAMMATOR
І що заважає використовувати валідний noindex?
Щось таке вже було. PROGRAMMATOR, спасибі за noindex, не знав! А воно всюди спрацьовує?
PROGRAMMATOR
А таке питання, якщо є помилки в валідності (в коді), вони сильно впливають на індексування сайту?
Товариші, а підкажіть, чому коли я використовую валідний . , то у мене злітає вся розмітка блоку укладеного в цьому тезі. А якщо використовую
За рахунок отримання інформації відразу по двох каналах (зір і слух) ефективність навчання значно перевершує навчання по книгах. А домашні завдання і онлайн-тести дозволять вам постійно думати на мові, що вивчається і відразу перевіряти свої знання!
Якщо ви давно хочете як слід вивчити HTML, то у мене для Вас є чудова новина!
Якщо ви вже вивчили HTML і хочете рухатися далі, то наступним кроком буде вивчення технології CSS.
Якщо ви хочете розібратися з поняттями домену і хостингу, навчитися створювати бази даних, закачувати файли сайту на сервер по FTP, створювати піддомени, налаштовувати поштові скриньки для свого сайту і стежити за його відвідуваністю, то цей курс створений спеціально для вас!
