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

Дизайн на плавающих фреймах в сочетании с дизайном на таблицах, вроде как преодолевает эту проблему. Но очень неуклюже. С одной стороны, плавающие фреймы трудно настроить, приходится на каждой странице делать индивидуальную настройку. А, с другой стороны, информация, выводимая в плавающий фрейм, индексируется отдельно от содержания страницы. А ведь там могут тоже находиться полезные ключевые слова.

Все эти недостатки изящьно решает дизайн Святой Грааль. Да, название говорит само за себя.

Суть этого дизайна следующая. Нужно чтобы контент из левой колонки располагался в коде странице после контента из центральной колонки. Такая структура, типа листа Мебиуса, достигается с применением слоев div, когда каждый блок страницы расположен в своем слое, и использованием технологии CSS для позиционирования этих слоев.

Здесь мы также используем шаблон для трех-колоночного дизайна.

Когда Вы будете смотреть на скаченный код этого дизайна (ссылка в левом меню), то конечно же сразу обратите свое внимание, что кодах левая колонка с меню располагается после основного текста в центральной колонке. Этот эффект достигается за счет того, что контент центрального слоя выводится с отступом от левого края экрана на величину ширины левой колонки. После чего начинает выводится левая колонка, которая формально стоит справа от центрального слоя, а не слева. Но в стилях задается отрицательный отступ слева для вывода контента. Отрицательное значение отступа говорит о том, что отступапть надо не направо, а, наоборот, налево. А значение этого отступа таково, что вывод контента левой колонки начинается как раз у левого края экрана. Тем самым левая и центральная колонки как бы меняются местами, создавая эффект подобный листу Мебиуса.