Для тегів будь-якого типу діють певні правила їх використання. Причому, деякі правила обов'язкові для виконання, а інші є рекомендаціями, тобто їх можна виконувати, а можна і ні.
Атрибути тегів і лапки
Згідно зі специфікацією HTML все значення атрибутів тегів варто вказувати в подвійних (" приклад") або одинарних лапках ( 'приклад '). Відсутність лапок не призведе до помилок, браузери в багатьох випадках досить коректно обробляють код і без лапок, за винятком тексту, що містить прогалини (приклад 3.2).
Приклад 3.2. Використання лапок в атрибутах тегів
HTML 4.01 IE Cr Op Sa Fx
<!DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title> Лапки в атрибуті alt </title> </head> <body> <p> <img src="images/ arena.png" alt="Вигляд заголовка" width="400" height="101"> </p> <p> <img src="images/ arena.png" alt=Вигляд заголовка width="400" height="101"> </p> </body> </html>
В даному прикладі рядок 8 написана правильно, з усіма лапками, а в рядку 9 у атрибута alt лапки відсутні. Через це браузер в якості значення alt візьме тільки перше слово (« Вигляд »), а слово « заголовка » буде сприйнято як помилкове значення. Тому завжди привчайтесь вказувати значення атрибутів тегів в лапках.
Теги можна писати як прописними, так і малими символами
Будь-які теги, а також їх атрибути нечутливі до регістру, тому ви вільні вибирати самі, як писати — <BR> , <Br> або <br> . У будь-якому випадку рекомендується дотримуватися обраної форми записи протягом усіх сторінок сайту. Зауважимо також, що текст, повністю набраний прописними символами, читається гірше, ніж текст з малими символами або змішаний.
Перенесення рядків
Всередині тега між його атрибутами допустимо ставити перенос рядків. У прикладі 3.3 показана одна і та ж рядок, але оформлена різними способами.
Приклад 3.3. Перенесення рядків в коді тега
<!DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title> Лапки в атрибуті alt </title> </head> <body> <p> <img src="images/ arena.png" alt="Вигляд заголовка в IE" width="400" height="101"> </p> <p> <img src="images/ arena.png" alt="Вигляд заголовка в браузері IE" width="400" height="101"> </p> </body> </html>
В даному прикладі перший тег <img> набраний в один рядок, включаючи всі його атрибути, а другий тег <img> розбитий на кілька рядків.
Хоча помилки при перенесенні тексту в подібному випадку і не виникне, рекомендуємо писати теги в один рядок, інакше погіршується сприйняття коду і його стає складніше правити.
Невідомі теги і атрибути
Якщо який-небудь тег або його атрибут був написаний невірно, то браузер проігнорує подібний тег і буде відображати текст так, немов тега і не було. Знову ж таки, варто уникати невідомих тегів, оскільки код HTML не пройде валідацію.
Порядок тегів
Існує певна ієрархія вкладеності тегів. Наприклад, тег <title> повинен знаходитися усередині контейнера <head> і ніде інакше. Щоб не виникло помилки, стежте за тим, щоб теги розташовувалися в коді правильно.
Якщо теги між собою рівноцінні в ієрархії зв'язку, то їх послідовність не має значення. Так, можна поміняти місцями теги <title> і <meta> , на кінцевому результаті це ніяк не позначиться.
Закривайте всі теги
Існує три стану закриває тега: обов'язковий, не потрібно або не обов'язковий. Обов'язковий закриває тег повинен бути присутнім завжди, інакше це призведе до помилки при відображенні документа. Для деяких тегів на кшталт <br> закриває тега немає в принципі. Необов'язковий закриває тег говорить про те, що розробник може його як додати, так і опустити, до помилки це не призведе. Однак рекомендуємо закривати всі подібні теги, включаючи необов'язкові, це дисциплінує, створює більш стрункий і суворий код, який легко модифікувати.