Сегодня мы с вами рассмотрим урок по созданию персональной страницы. Давайте начнем.
Не забудем добавить уже готовую графику в каталог images. Скопируем графику в буфер обмена Windows и, кликнув правой кнопкой мыши по названию images в дереве сайта (окпо редактора Folder List), получим контекстное меню. Выберем опцию Paste, и графика добавлена в наш проект.
Если окно Folder List отсутствует в вашем редакторе, то войдите в меню «View» и выберите опцию «Folder List». В этом окне FrontPage показывает дерево вашего сайта.
Рассмотрим, из чего состоит FrontPage. Его составляют, кроме меню и панели инструментов, три окна:
окно Views (слева) — позволяет переключаться между задачами. FrontPage поддерживает следующие задачи (все или большую часть вы обязательно используете в процессе создания сайта, однако далее мы не будем останавливаться на них):
Page — режим редактирования html-crpa- ниц (он сейчас активен),
Folders — режим работы с каталогами нашего WEB-сайта. Да, любой WEB-сайт — это набор файлов (текстовых и графических), которые еще можно разложить по каталогам,
Reports — редактор представляет общий отчет о состоянии разрабатываемого WEB- сойта,
Navigation — рисует структурную схему сайта,
Hyperlinks — выводит состояние всех ссылок, используемых на страницах сайта,
Tasks — используется, когда работу над сайтом ведут несколько человек;
окно Folder List — в нем отрисовывается структура нашего WEB-сайта;
— окно с именем текущего редактируемого файла. В этом окне, внизу, вы увидите три закладки:
Normal — режим работы WYSWYG (именно о работе в нем мы и будем говорить),
— HTML — режим работы прямо с кодом HTML (тегами и текстами), то есть само программирование,
Preview — режим быстрого просмотра нашей страницы: так она будет отображаться’-] в браузере.
Давайте еще раз внимательно взглянем на окно редактора FrontPage. Мы видим, что меню редактора и панель инструментов мало отличаются от тех же меню и панели инструментов часто используемого текстового редактора Windows Word. Основные меню и кнопки, которые мы будем использовать для создания наших гипертекстовых документов, те же самые, что мы использовали в Windows Word для редактирования текста. Поэтому я лишь буду говорить о названии кнопок панели инструментов и дороге к нужной опции через меню.
Что ж, теперь можно начать заполнять наши страницы.
Использование графики, цвета и текста
Первым делом мы установим на нашей странице фон и зададим основные цвета текста и ссылок.
Фон нашей страницы может состоять либо из холста, либо из комбинации холст-текстура. Холст — это цвет вашей страницы в браузере. Вы его можете не изменять, надеясь на то, что посетитель Интернета пользуется стандартной схемой Windows (в ней он белый). Но все же рекомендуется установить его самому, чтобы избежать недоразумений, когда цвет холста посетителя вашего сайта окажется одним цветом с цветом текста вашей страницы. Однако когда вы используете текстуру, вы должны цвет холста установить очень близким к преобладающему цвету в вашей текстуре.
Зайдем в меню «Format» и выберем опцию «Background. В открывшемся окне (рис. 135) включим опцию «Background Picture» и нажмем кнопку «Browse…. В открывшемся окне войдем в каталог images и выберем файл bkg.gif, нажмем Кнопку «ОК». Файл, содержащий текстуру, мы подключили к нашему гипертекстовому документу.
Мы можем включить опцию «Watermark», если хотим, чтобы наша текстура оставалась неподвижной, в то время как текст перемещался в результате прокрутки страницы.
Теперь отстроим цвета — «Colors». Они должны хорошо читаться на используемой нами текстуре (а значит, и холсте). Мы настраиваем следующие параметры:
Background — задаем цвет холста;
Text — задаем цвет текста на странице;
Hyperlink, Visited Hyperlink, Active Hyperlink — определяем цвет ссылок.
Нажав на стрелку вниз в каждом из этих параметров, мы получим контекстное меню, в котором увидим:
Standard colors — 16 основных цветов;
Document’s colors — уже выбранные нами другие цвета;
«More colors…» — возможность перейти в окно с расширенной цветовой гаммой.
Что ж, текстуру мы разместили, основные цвета страницы мы настроили.
Любой элемент страницы, будь то текст или графика, можно выровнять влево, вправо, сцентрить. Это позволяют сделать инструменты форматирования FrontPage (они находятся в панели инструментов редактора или можно загрузить окно настройки абзаца через меню «Format» опцию «Paragraph»), те же самые, что мы используем в редакторе Windows Word для выравнивания текста и картинок.
В меню «Insert выберем опцию «Picture». Она предложит воспользоваться коллекцией графики Microsoft Office («Clip Art») или разместить графический файл («From File»). Выберем пункт «From File». Более короткий путь к тому же окну выбора файлов лежит через кнопку «Insert Picture From File», находящуюся на панели инструментов редактора.
Итак, мы получили окно «Picture», приглашающее нас выбрать файл. Выделяем файл «titul-map.gif» и нажимаем кнопку «ОК». Теперь на нашей странице появилась «шапка» — заголовок сайта, совмещенный с картой.
В контекстном меню этой картинки выберем опцию «Picture Properties…».
В закладке General, в поле Text, введем название картинки:
Делаем мы это для того, чтобы посетитель, пришедший на нашу страницу с отключенным в его браузере показом графики, мог узнать, что изображено на картинке.
В закладке Appearance укажем тип выравнивания картинки: установим значение «Alignment» в «Absmiddle (выравнивать по центру одновременно по горизонтали и по вертикали).
Автор сатьи Елена
