Учебник Macromedia Dreamweaver (стр. 63 из 135)
Далее поместите курсор мыши правее таблицы так, чтобы он принял вид текстового курсора, и щелкните левой кнопкой мыши. Большой мигающий текстовый курсор появится теперь справа от таблицы. Нажмите клавишу <Enter>, и Dreamweaver поместит после таблицы пустой абзац. Переместите туда текст сведений об авторских правах. Останется только уменьшить высоту ячейки колонки новостей, сделав ее равной высоте ячейки основного содержимого, и удалить ненужную строку внизу таблицы. Возможно также, что вам придется заново выставить значения ширины ячеек.
Сохраните теперь получившуюся страницу. У вас должно получиться нечто, похожее на рис. 8.35.
Вы заметили, как быстро мы отредактировали нашу страницу? В режиме разметки нам пришлось бы до бесконечности перемещать с места на место ячейки таблицы, подгоняя их размеры и местоположение, устраняя постоянно появляющиеся просветы и лишние ячейки. В обычном режиме все это заняло минуту.
И все же создавать "с нуля" таблицу разметки лучше всего в режиме разметки...
Второй недостаток таблиц — громоздкий HTML-код — к сожалению, непреодолим. Можно только посоветовать, опять же, не создавать слишком уж заковыристых таблиц, а'если и создавать, то с помощью Dreamweaver. Он, в отличие от дизайнера-человека, не делает ошибок. Ну, почти не делает...
И еще один совет. Если вам нужно опубликовать на сайте большой текст, а сайт сделан на основе табличного дизайна, поступите следующим образом. Вместо того чтобы помещать весь текст на одну страницу, создавая настоящего монстра, разбейте его на несколько частей и поместите на нескольких страницах. При этом в конце каждой страницы, содержащей часть такого текста, поместите ссылку на страницу со следующей частью.
Рис. 8.35. Главная страница с заголовком и сведениями об авторских правах, вынесенными за пределы таблицы разметки
Недостатки табличного дизайна
Всем хорош табличный дизайн. Мы можем точно контролировать, как один фрагмент содержимого страницы расположен относительно другого, а Dreamweaver максимально облегчает нам эту задачу. Мы можем делать наши Web-страницы максимально совместимыми с разными программами Web-обозревателей, что не всегда проходит в случае с фреймами. Мы можем многое. И нам не хочется верить, что у табличного дизайна есть недостатки.
Недостатков, пожалуй, всего два. Но каких!!!
Первый недостаток: большое количество повторяющихся элементов, присутствующих на всех страницах сайта. Посмотрите сами — на каждой странице нашего нового сайта Sample site 3 есть совершенно одинаковые заголовок, полоса навигации и сведения об авторских правах. Именно из-за этого файлы Web-страниц, созданных на основе табличного дизайна, так велики. И когда посетитель щелкает по гиперссылке, все это хозяйство каждый раз загружается заново.
Когда мы строили сайт на основе фреймов, мы отделили эти повторяющиеся элементы от уникального основного содержимого и поместили их на других страницах, отображаемых в других фреймах. Когда посетитель щелкает по какой-либо гиперссылке, то заново загружается только страница с основным содержимым. Повторяющиеся же элементы как были, так и остаются неизменными в своих фреймах.
Конечно, мы можем уменьшить объем HTML-кода уменьшением объема содержимого страницы, "выносом" некоторых его фрагментов за пределы таблицы (это все мы рассмотрели выше), тщательной оптимизацией, наконец. Но радикального уменьшения объема кода это не даст; страница так и останется достаточно большой. А все из-за этих повторяющихся элементов, от которых никуда не деться.
И здесь мы подходим ко второму недостатку табличного дизайна: большой трудоемкости внесения изменений в повторяющиеся элементы. В самом деле, если вы вдруг захотите добавить в полосу навигации новую гиперссылку, вам придется делать это во всех страницах вашего сайта. Хорошо, если их всего пять. А если пятьдесят?
Первый недостаток табличного дизайна непреодолим. Можно только посоветовать не создавать слишком больших и сложных повторяющихся элементов и тщательно оптимизировать HTML-код. И — смириться с неизбежным...
А вот второй недостаток вполне преодолим. И преодолеть его нам поможет все тот же великолепный Dreamweaver. Для этого он предоставляет замечательное средство, называемое шаблонами и описываемое в главе 9.
Что дальше?
Вот мы и познакомились с таблицами разметки и табличным дизайном. Мы создали третий по счету сайт, основанный на таблицах. Наконец, мы научились работать в режиме разметки страницы.
Собственно, вы уже поняли, какая тема будет следующей. Это шаблоны. И вы уже знаете, для решения каких проблем они созданы. Так не будем же терять времени! За дело!
· Глава 9. Использование шаблонов
o Введение в шаблоны Dreamweaver
o Работа с шаблонами
o Создание шаблона
o Редактирование шаблона
o Создание изменяемых областей
o Создание Web-страниц на основе шаблонов
o Применение шаблонов к уже созданным Web-страницам
o Гиперссылки в шаблонах
o Экспорт Web-страниц, основанных на шаблонах
o Обновление страниц, созданных на основе шаблонов
o Управление шаблонами в окне шаблонов
o Новые возможности шаблонов
o Изменяемые атрибуты
o Необязательные области
o Повторяющиеся области
o Необязательные изменяемые области
o Табличная повторяющаяся область
o Вложенные шаблоны
o Недостатки шаблонов и их преодоление
o Что дальше?
ГЛАВА 9.
Использование шаблонов
Вот мы и закончили наш третий Web-сайт. Все работает, все страницы нормально загружаются и отображаются в Web-обозревателе. Казалось бы, нет поводов для беспокойства.
Нет, но только до поры до времени.
Представим себе такую ситуацию. Мы вдруг решили добавить в наш сайт новую страницу. Чтобы это сделать, нам нужно изменить полосу навигации во всех страницах, а для этого придется открыть каждую из них в окне документа, добавить ссылку и сохранить страницу. Наш сайт невелик по размеру, и мы выполним эту работу довольно быстро. А если бы он был велик?
Конечно, мы можем воспользоваться встроенными средствами Dreamweaver. Например, вызвать диалоговое окно Find and Replace — средство исключительно мощное. (О возможностях по поиску и замене подстрок см. в главе 2.) Или запустить замену гиперссылок, вызвав пункт Change Link Sitewide меню Site панели Site (см. главу 6). Во многих случаях это поможет нам быстро заменить целые фрагменты содержимого страницы или ее HTML-кода. Большую помощь нам могут дать активы и библиотека элементов, также описанные в главе 6.
Но что делать, если мы хотим произвести какие-нибудь значительные изменения, например, радикально поменять структуру таблицы разметки? Поиск и замена нам вряд ли помогут, а уж автоматическая замена гиперссылок — тем более. Даже активы с библиотекой нам в этом случае не помогут. Неужели придется переделывать заново все страницы?!
Если бы вы работали не в среде Dreamweaver, вероятно, так бы и пришлось делать. Но нам повезло. Dreamweaver поддерживает такое мощное средство, как шаблоны. Они уже упоминались в главе 3. Сейчас мы их рассмотрим подробнее.
Введение в шаблоны Dreamweaver
Шаблон — это своеобразный образец, "скелет" Web-страницы, содержащий общие для всех страниц элементы. Когда вы создаете новую страницу на основе шаблона, вам остается только вписать в нужные места уникальное содержимое этой самой страницы и сохранить ее. Впоследствии вы можете изменить шаблон — и Dreamweaver сам обновит все созданные на его основе страницы.
В этом смысле шаблоны схожи с элементами библиотеки (см. главу 6). Отличие в том, что шаблон — это заготовка для целой страницы, а библиотека хранит только ее отдельные элементы. Однако разработчики Dreamweaver считают, что шаблоны ближе всего по "родству" активам (см. главу 6), и поместили список шаблонов в панели Assets.
Изначально шаблон изменить нельзя, т. е. когда вы создаете на его основе страницу, вы можете помещать содержимое только в специально отведенных для этого местах — изменяемых областях. Элементы самого шаблона вы редактировать не можете, т. к. они являются неизменяемыми областями. Если же вы хотите что-то исправить, то вам придется открыть в окне документа сам шаблон. Таким образом, Dreamweaver спасает вас от ошибочного изменения шаблона и, соответственно, от искажения созданных на его основе Web-страниц.
Можно сказать, что шаблоны — это обычные Web-страницы. При редактировании вы можете обращаться с шаблонами, как с обычными Web-страницами, и использовать те же инструменты. Также вы можете задавать параметры страницы, которая будет создана на основе этого шаблона (название, цвет фона, текста и гиперссылок). Однако при создании HTML-кода шаблонов Dreamweaver использует множество собственных тегов и атрибутов, поэтому говорить о том, что шаблон — обычная Web-страница, не совсем корректно.
Шаблоны сохраняются в файлах с расширением dwt в папке Templates, находящейся в корневой папке локальной копии сайта. Из этого следует, что шаблоны — неотъемлемая часть вашего сайта, как и библиотека. Чтобы использовать какой-либо шаблон в другом сайте, вы будете должны скопировать его в тот сайт, использовав стандартные средства Dreamweaver (см. главу 6). В одном сайте могут применяться несколько шаблонов.
Шаблоны более всего пригодятся вам, если вы создаете страницы на основе табличного дизайна. Такие страницы практически всегда содержат множество повторяющихся элементов, обновлять которые вручную крайне трудоемко. Но вы можете заготовить шаблоны и для "обычных" страниц. Это может понадобиться, например, если вы создаете страницы с одинаковым оформлением для какого-то большого фирменного сайта.
Вместе с Dreamweaver поставляется довольно много шаблонов, созданных профессиональными Web-дизайнерами. Вы можете использовать эти шаблоны для создания своих страниц; как это делается, было рассмотрено в главе 3. Попробуйте — возможно, вы найдете что-нибудь, для вас подходящее.