Верстка блоками в 3 колонки в духе WEB 2.0

Центральная часть страницы. Сама суть, за которой пришел посетитель. Раньшее ее загрузится только блок класса top с заголовком страницы. Но и его можно убрать в конец страницы, сделав блоку container3col соответствующий отступ сверху и спозиционировав top абсолютно (такое может иметь смысл, если в топе расположен флеш, куча декоративных элементов и прочая тяжеловесная дребедень, и так был сверстан сайт www.apies.ru, который я убрал из портфолио так как, внеся рад изменения в содержание, владельцы подпортили его внешний вид), но лично я не люблю абсолютное позиционирование после обнаружения побочных эффектов, например, в сохраненной Яндексом копии. Впрочем, данная идиалогия не всегда применима. Во-первых, можно сделать страницы компактными, чтобы они грузились так быстро, что порядок блоков не имел бы значения. Во-вторых... Представьте, вы на медленном соединении приходите на главную страницу и долго читаете: «Здрасте. Я Вася Пупкин. У меня на сайте есть сотня классных статей, но для того, чтобы узнать о них, вам придется подождать, пока загрузится меню, которое, специально, чтобы поизмываться над вами, я загнал в самый конец страницы...». Тяжеловесный основной блок может помешать посетилелю увидеть блок меню и, вместо перехода на следующую страницу, может сработать переход назад, туда, откуда пришли на этот сайт. Помещать меню до, или после контента – зависит от вкуса и от случая. Мне кажется, на сайте своей дизайн-студии я верстал наиболее правильным образом: вначале краткое описание назначения сайта и особые ссылки (на контакты и цены, их можно было бы поместить в конец документа и спозиционировать абсолютно, но, как уже писал, абсолютного позиционирования я не люблю), затем ссылки на основные разделы, затем блок основного текста, а дальше уже прочие ссылки и, в конце, копирайты со счетчиками. Но не буду настаивать на том, что это самое лучшее решение. Если вы найдете лучший способ, то наверно, сможете и больше меня зарабатывать ;)

Только мне не понравилась эта "правильная верстка". В эксплорере меню появлялось с некоторым запазданием (как и следовало ожидать, но...). Мне это запаздание не понравилось. Так что, я перенес меню поставив перед основным текстом и результат мне понравился больше. Думаю, помещение меню из трех пунктов перед текстом не сильно отравит жизнь посетителю с медленного модема, тем более, что вес страниц колеблится от 6 до 8 килобайт...

Кстати, хороший пример того, как ситуация и вкусы влияют на выбор варианта.

Но вернемся к верстке блоками в 3 колонки в духе WEB 2.0: Благодаря невидимому блоку clear высота данного блока кажется равной высоте самого высокого блока (в том случае, если левый или правый блок длиннее). На самом деле, тут работает блок container3col. Бордюр, фон и прочие украшательства, при необходимости нужно давать именно ему. Однако отступ для основного текста, задавать нужно именно в блоке content (в илиале, поместив в него вспомогательный блок, так как IE справедливо счтитает, что width задает ширину блока, независимо от того, какие у него отступы для внутреннего содержания, а Опера и Мазила считают, что ширина блока это не только его ширина, но и его отступы – в результате, задав padding и width для блока, получаем РАЗНУЮ ширину в разных браузерах).

Левый блок. В данном варианте верстки физически расположенн ПОСЛЕ блока с основным текстом. Идиалогия WEB 2.0 предполагает, что зайдя на сайт с медленного модема, человек увидит его после того, как прочтет основной текст.
Правый блок. В данном варианте верстки позже него загрузится только "хвост" сайта (в противовес к header – заголовку, голове).

Пример для: Табличной верстки и верстки блоками главная страницу сайта