Любая работа, а тем более вёрстка, должна быть выполнена аккуратно, потому что переделывать вёрстку в дальнейшем будет ленивее. тем более, если создаётся она для посещаемого и корпаративного сайта. Что значит правильно верстать на html и css? И что необходимо делать, что бы стать профессиональным верстальщиком?

Просматривая различные сайты в Интернете, мы не смотрим в код HTML. Ну не берём в расчёт верстальщиков, которым интересно посмотреть на чужую работу. Да и совсем не нужно это обычному пользователю? Но достаточно бывает только взглянуть на html код, чтобы составить впечатление о самих создателях сайта. Код HTML страниц — это как зеркало умений веб-мастера, который занимался созданием сайта.

Заглянув на код можно легко узнать о том, как сделана сама страничка: программкой для клепания сайтов пачками или руками html-верстальщика. Программа не обладает человеческой логикой и не заметит эллиментраных ошибок, к тому же засоряя всё своими комментариями, ненужными тегами и конструкциями. А псевдо «мастеру» до этого нет дела, ведь в его браузере все смотрится хорошо, а то, что браузеров существует великое множество ему и дела нет…

Создание минималистичного (чем меньше кода в странице, тем лучше для дальнейшей раскрутки сайта в поисковиках), аккуратного и работающего во всех браузерах — это своеобразное, но искусство. Особенно это заметно, когда вы создаёте сайт не для себя, а для работодателя, который разбирается в html.

Встречаются сайты с очень сложной структурой, в которых работа верстальщика занимает самое большое по времени всего создания сайта. К примеру, сложная вложенность слоёв, абсолютное позиционирование совместно с JavaScript кодом делает html вёрстку одним из сложнейших занятий, без опыта в которых сложно нормально работать и зарабатывать.

Чтобы ваш код страницы выглядел достойно, аккуратно и «неискусственно», вам было легко в нем ориентироваться, то внимательно изучите нижеперечисленные пункты и придерживайтесь их при написании HTML:

* Писать html теги большими прописными буквами является неправильным (TABLE, BODY, IMG) — это первый признак неручной работы и в таком коде тяжело ориентироваться, так как большинство кода в Интернете все-таки написано строчными буквами (table, body, img) и это является стандартом и весь html код, написаный строчными буквами признается html-валидатором невалидным!

* Атрибуты всегда записывайте в кавычки (напр., align=»right»), что придаст вашему коду аккуратность и совместимость с языком XML.

* Присваивая какое-либо значение (ширины, высоты) в пикселях, не забывайте это указать, т.е. width=»5px». Например, height=23 будет ошибкой, приавльно писать height=»23%»;

* Есть теги, в которых нет закрывающего тега (img, hr, br), но по стандартам W3C — это те люди, которые диктуют правила написания html кода (да и многого другого). В таких случаях надо закрывать одиночный тег закрывающим слешем <br />

* Лишние комментарии, которыми программы засоряют код, так же, не пойдут на пользу вашему сайту, а вот ваши собственные комментарии помогут разобраться через некоторое время намного быстрее. Тем более, если сайтом станет заниматься другой мастер;

* Старайтесь не оставлять стили и JavaScript код в страничке. Выводите их в отдельный файл — так проще что-либо поменять и код страницы уменьшится (иногда очень заметно);

* У любого символа есть своя замена. В каждом справочнике по HTML есть список этих подстановок. Желательно использовать их, что бы не было проблем с просмотром в некоторых браузерах.

Напоследок скажу, что программами для клипания быстрых сайтов пользоваться не стоит, потому что они очень сильно засоряют код и ничего хорошего из этого никогда не выйдет. Советую использовать специальные редакторы для программистов, в которых вы сами пишете код, но скорость работы увеличивается за счёт специльных возможностей, таких как подсветка кода или проверка на валидность — правильность с точки зрения стандарта html и css. (Как пример, Notepad++)

Чаще всего при создании сайта больше всего сил и времени уделяется визуальному дизайну сайта, с точки зрения дизайнера, это правильно — ведь именно его увидят рядовые посетители сайта. И часто экономия на коде сайта может сыграть медвежью услугу: увеличиваются расходы на раскрутку сайт (в том числе и время), начинают открываться проблемы с кроссбраузерностью (внешним видом в различных браузерах) сайта и в конце-концов, сайт приходиться перевёрстывать.

Как видите, скупой (или ленивый) платит дважды, а то и трижды! Из-за такого отношения в нашем Рунете множество сайтов с замечательным внешним дизайном имеют отвратительный код, сделанный на скорую руку в программе-клепалке, осовенной не полностью. Не повторяйте ошибок таких сайтостроителей, верстайте аккуратно и красиво, выделяйте структуру кода, и всегда помните, что язык HTML — основа сайта.

Источник: internet-technologies.ru