Бесплатный обучающий видеокурс по созданию сайтов с нуля!

Структура сайта . Разработка структуры сайта .

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

Как вы думаете, из чего делается каркас? В последнее время, каркасы для сайтов начали делать по блочному типу(как бы из элементарных блоков,в качестве блока берется элемент DIV, расположение и свойства которого,задаются через стили CSS ). Но сделать так, чтобы этот каркас одинаково отображался во всех браузерах обычно сложно для новичка, т.к. требует довольно хороших знаний стилей CSS .

Поэтому, давайте рассмотрим по какому принципу строиться структура сайта из таблиц. Этот вариант классический, и во всех браузерах смотриться одинаково...

Табличный каркас это в принципе просто таблица, в которой имеются несколько ячеек, или если он более сложный, имеются еще и вложенные таблицы. Таблица может быть фиксированной ширины(мне так больше нравиться, да и проблем меньше) а может разворачиваться на весь экран, в зависимости от разрешения монитора.

Короче, давайте смотреть на примере:

Как видите, обычная примитивная табличка, разделенная соответсвующим образом на колонки и ряды. Как делать такие таблицы, можете почитать здесь.

Что можно посоветовать, ну...наверное то, что шапку лучше делать не чисто графическим изображением, а компоновкой, обычного html текста и рисунка на заднем плане(в начале написать текст, затем в ячейку таблицы поставить фоновое изображение). Это значительно улучшит позиции в поисковых системах (особенно если у вас там ключевая фраза!).

Там где реклама, на первых порах поставьте рекламу от Google - для нее не важна посещаемость вашего сайта, или если у вас другие варианты - ставьте другое. Меню можно сделать самому(просто добавляем еще одну табличку), а можно воспользоватся програмкой CSS Menu Generator - там все просто, указываете ширину меню, цвета ячейки в спокойном состоянии, при наведении мыши и др., ставите ссылки (затем копируете html код и вставляете его в ячейку таблицы Меню, а CSS код в свою таблицу стилей ) вобщем разберетесь.

Структура сайта может иметь к примеру такой вид:

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

Обратите внимание, что опять же - Все Сделано Из Таблиц! В общем я показал вам принцип, а дальше уже придумывайте, фантазируйте, ваша структура сайта будет намного лучше !!!

На моем новом сайте, Вы можете скачать видеоурок "Создаем универсальный табличный макет страницы" , там я все показываю на реальном примере, разобраться будет значительно легче :)

Удачи!

Узнай как создаются современные сайты !Оказывается, все очень просто...