3. Разработка шаблона страницы

Следует начать с разработки стартовой страницы. Для этого сначала создаем корневую папку, где у нас будут находиться все необходимые графические и анимированные объекты, а так же сама страница. Затем в программе Macromedia Dreamweaver создаем web-сайт. Во вкладке дополнительно указываем имя сайта и адрес локальной корневой папки. После всего этого можно приступать к работе в визуальном режиме через вкладку проект. Для начала в тело страницы вставляем таблицу, которую выбираем на специальной вкладке. В раскрывшемся окне выставляем количество строк и столбцов. Выбираем 3 строки и два столбца, а также размер страницы сто процентов. Таблица создана. Выделяем первый столбец и прописываем ширину строк сто восемьдесят пикселей. Верхние ячейки объединяем – это будет наш хедер (заголовок страницы). Нижние так же объединяем – это будет наш футер (нижняя часть страницы). Левая средняя ячейка будет нашей панелью навигации, а правая средняя будет служить для контента (содержательная часть страницы).

Теперь отредактируем таблицу. Для хедера выставим высоту сто пятьдесят пикселей, для футера – тридцать пикселей. Зададим для них необходимый цвет фона, это будет светло зеленый цвет. Для панели навигации зададим цвет чуть светлее. Каркас нашей страницы готов. Можно приступить к его заполнению.

В необходимую ячейку вставим таблицу в одну строку и один столбец, размером девяносто процентов и выравниваем ее по центру. Теперь в нее вставляем заранее заготовленный контент. В хедер вставляем, специально разработанный в программе Corel Draw, графический объект, размером с хедер. Внизу третьим заголовком подписываем: «Рекламное агентство полного цикла » и выравниваем по центру. Контент и хедер готовы.

В футере прописываем: «Копирайтинг 2012 » и выравниваем по центру.

Наш шаблон готов.

1.4 Создание каркаса навигационной панели

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

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