Сайт, придуманный дизайнером должен быть после этого свёрстан и адаптирован для определённых нужд.
Под вёрсткой подразумевается применение html, или html+css. Второй вариант является наиболее распространённым. Вообще, есть, конечно, и другие варианты вёрстки, более сложные, но они не поддерживаются всеми браузерами. HTML-вёрстка бывает блочной(div) и табличной(table). Оба варианты имеют свои достоинства и недостатки.
Табличная вёрстка
Табличная вёрстка выполняется с помощью таблиц, которые вкладываются друг в друга. Вёрстка с помощью таблиц возникла гораздо раньше блочной, поэтому почти все браузеры считывают её корректно. К тому же, верстать сайты таким образом удобно, если вам нужна конструкция нескольких колонок. К минусам табличной вёрстки можно отнести то, что при большом количестве вложенных таблиц получается громоздкий код, который сложно редактировать. Сайты, выполненные с помощью таблиц плохо индексируются поисковыми системами. От этого страдают сайты, которые по своему содержимому вполне могли бы попасть на хорошие позиции в поисковых выдачах.
Блочная вёрстка
Блочная вёрстка отличается меньшим весом сайта из-за более компактного использования кода. С точки зрения позиционирования блочная вёрстка абсолютно удобна. Блоки или слои могут перекрывать друг друга, а нижнюю часть HTML-кода можно расположить вверху, что используется оптимизаторами. Минусом блочной вёрстки является некоторая сложность в использовании. Необходимо знать CSS 1 и 2 версии (на подходе 3 версия, в которой ещё больше функций). Некоторая сложность в создании сайтов с «резиновой» версткой, но в сети существует множество инструкций, как легко сделать это блоками. Можно сделать вывод, что блочную верстку используют более знающие web-дизайнеры и верстальщики, т.к. нужно знать много тонкостей при верстке блоками.
Табличная верстка:
1 2 3 4 5 6 7 8 9 10 11 12 | <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr colspan="2"> <td class="header" colspan="2">Шапка</td> </tr> <tr> <td class="content">Контент</td> <td class="sidebar">Меню</td> </tr> <tr colspan="2"> <td class="footer" colspan="2">Подвал</td> </tr> </table> |
Блочная верстка:
1 2 3 4 5 6 | <div id="header">Шапка</div> <div id="wrapper"> <div id="content">Контент</div> <div id="sidebar">Меню</div> </div> <div id="footer">Подвал</div> |
Если учесть, что есть ещё люди, которые используют старые версии, поэтому услуги web-студий, выполняющих сайты с блочной вёрсткой стоят дороже.
Говоря о разных видах вёрстки, следует вспомнить о том, что профессиональные верстальщики не отдают предпочтение табличной или блочной вёрстке и считают, что для профессионалов нет ничего невозможного. Специалисты высшего класса практически не видят разницы между двумя видами вёрстки, а вы можете в процессе роста верстать сайты и с помощью блоков, и с помощью таблиц, совершенствуя навыки.
