Головна HTML Акуратний HTML
Акуратний HTML

Будь-яка робота повинна бути створена акуратно і красиво. Особливо якщо її можуть побачити багато людей. А це безпосередньо стосується розробки сайтів, і зокрема деяких технологій, що використовуються при цьому - HTML і CSS. Переглядаючи сторінки в Інтернеті ми, як правило, не дивимося в код HTML. Та й навіщо це потрібно звичайному користувачеві? Але часто буває важливо глянути на код, щоб скласти деяке враження про творців цього веб-сайту. Код HTML, це як дзеркало умінь, можливостей і бажань розробника сайту.

Зазирнувши туди можна з легкістю дізнатися про те, як зроблена сторінка - «програмою-клепалкой» або людиною, її розумом і знаннями. Щоб вам легше було зрозуміти мою думку, я проведу відмінну паралель. Візьміть музику. Є композиції, написані однією людиною за комп'ютером, за допомогою нескладної програмки. На всіх інструментах він «грає» сам. Йому не потрібен ударник з почуттям ритму, йому не потрібен гітарист з віртуозною технікою, басист теж ні до чого, і клавішник зайвий ... Він натискає кнопку і програма сама все грає. І виходить заполонили радіо і клуби безглузда «туцкатня». Мистецтво і творчості немає. Так і в написанні коду. Програма адже дурна - засмічує все коментарями, непотрібними тегами і конструкціями. А користувачу до цього немає справи - в його IE все виглядає добре. А про Oper'у і NN він навіть не знає, які висувають свої вимоги до оформлення коду сторінки.

Створення ефективного та акуратного коду HTML - це своєрідне, але мистецтво, де треба думати. Особливо це відчується, коли будете створювати сайт не для себе, а для кого-то. Причому зустрічаються сайти з дуже складною структурою, де праця верстальника займає половину часу роботи над всім сайтом. Вкладені по кілька разів таблиці, нестандартне позиціонування та оформлення тесту ... Без особистого досвіду написання HTML саме ручками тут ніяк не обійтися. Тим більше одну й ту саму задачу можна вирішити різними шляхами, серед яких потрібно вибрати найбільш оптимальний.

Щоб ваш код сторінки виглядав гідно, акуратно і «неіскусственно», вам було легко в ньому орієнтуватися, то уважно вивчіть наведені нижче пункти і дотримуйтесь їх при написанні HTML:

Намагайтеся не писати теги прописними літерами (TABLE, BODY, IMG) - це перша ознака неручной роботи і в такому коді важко орієнтуватися, так як більшість коду в Інтернеті все-таки написано малими літерами (table, body, img).

Атрибути завжди записуйте в лапки (напр., align = "right"), що додасть вашому коду акуратність і сумісність з мовою XML.

Присвоюючи будь-яке значення (ширини, висоти) в пікселях, не забувайте це вказати, тобто width = "5px".

Є теги (напр., <li>, <p>), для яких не обов'язково ставити тег закриває. Але я рекомендую все-таки ставити їх у будь-якому випадку. По-перше, так легше орієнтуватися в коді, а по-друге, для повної сумісності зі всіма браузерами і їх версіями.

Неприпустимі непотрібні коментарі, які часто залишають «програми-клепалкі». А ось свої власні завжди пишіть, вони вам полегшать знаходження потрібного фрагмента коду сторінки.

Намагайтеся не залишати стилі в сторінці. Виводьте їх в окремий файл - так простіше що-небудь поміняти і код сторінки зменшиться (іноді дуже помітно).

У кожного символу є своя так звана підстановка. Наприклад, для тире це -, а для лапок «(ліва) і» (права). У будь-якому довіднику по HTML ви знайдете список таких символів і їх підстановок. Завжди використовуйте їх, інакше можуть виникнути проблеми з їх коректним відображенням.

Наостанок скажу, що «програмами-клепалкамі» краще не користуватися, тому що вони засмічують код і врешті-решт це отупляє. Використовуйте багатофункціональні блокноти, де ви пишете все самі, але цей процес прискорюється за рахунок додаткових можливостей.

Часто при розробці сайту багато часу приділяється на візуальний дизайн - адже його бачать відвідувачі. А те, що приховано (код HTML), то можна зробити і по-швидкому. З-за такого ставлення в нашому Рунеті безліч сайтів з чудовим зовнішнім дизайном мають огидний код, зроблений на швидку руку в «клепалке». Не варто так безвідповідально підходити до HTML, адже він основа сайту.

 

 
© 2008-2013 PHPist