Лабораторная работа №8. Оформление гиперссылок и совместных страниц FrontPage Ссылка (гиперссылка) — это соединение между двумя файлами (страницами). Посетители сайта могут, щелкнув по ссылке, перейти туда, куда она ведет. Место назначения ссылки представляется в виде URL (Uniform Resource Locator, Унифицированный указатель ресурса). Ссылки могут указывать на текст, изображения и другие файлы (например, на документы Microsoft Office), а также на закладки внутри документов. Например, вы может проставить ссылку с документа Microsoft Word на файл Excel. Когда вы щелкаете по такой ссылке, автоматически запускается программа Excel и открывает файл, на который указывает ссылка. Используя Frontpage, вы сможете очень просто связывать между собой HTML-страницы и файлы Office, создавая мощный и динамичный сайт. Создание ссылки Для того чтобы установить ссылку, выделите участок текста или изображение, с которого будет осуществляться переход, нажмите правую кнопку мыши и в контекстном меню выберите пункт Hyperlink (Гиперссылка). Вы увидите диалоговое окно Create Hyperlink (Создание гиперссылки), показанное на рис. Вы ссылки можете на различных устанавливать объекты нескольких типов: - ссылки на страницы сайта, открытого в данный момент. Если какой-либо сайт в данный момент в Frontpage, то в диалоговом окне вы увидите перечень всех страниц этого сайта, и на любую из них можно установить гиперссылку. - ссылки на URL. Вы можете ввести точный адрес (URL) страницы в текстовом поле или же нажать на кнопку Use your Web Browser to select a page (Указать страницу с помощью браузера). По нажатию этой кнопки запускается Web-браузер, установленный на вашем компьютере. Когда вы найдете нужную страницу в Internet, адрес этой страницы будет автоматически помещен в текстовое поле URL в диалоговом окне Create Hyperlink. 2 - ссылки на локальные файлы. Если вы хотите установить гиперссылку на файл, находящийся на вашем компьютере, вы можете сделать это, используя кнопку Make a hyperlink to a file on your computer (Создать ссылку на файл на вашем компьютере). В появившемся диалоговом окне Select File (Выбор файла) вы можете указать нужный файл. - ссылки на адрес e-mail. Если вы хотите создать ссылку, которая позволяла бы посетителям вашего сайта отправить письмо по какому-либо конкретному адресу, то в этом случае можно использовать кнопку Make a hyperlink that sends E-mail (Создать ссылку для отправки письма по электронной почте). Вы увидите появившееся диалоговое окно Create E-mail Hyperlink (Создание почтовой ссылки), изображенное на рис. Для того чтобы такая ссылка работала, вам достаточно просто ввести адрес получателя в текстовом поле. - ссылка на новую страницу. Данная возможность позволяет создать ссылку, указывающую на еще не созданную страницу. Нажатие на кнопку Create a page and link to the new page (Создать страницу и проставить ссылку) вызывает появление диалогового окна New (Новая страница). Задание для самостоятельно выполнения На сайте Мой личный сайт создать новую страницу soderganie.htm, где отразить все ссылки на созданные Вами страницы. Бегущие строки Бегущие строки привлекают к себе взгляд, заставляя посетителей уделять вашему сайту более пристальное внимание. Однако с бегущими строками, как и со всеми другими анимационными и графическими средствами, необходимо соблюдать чувство меры — избыток их может раздражать. Бегущие строки (marquees) — это элементы HTML, позволяющие вставить в страницу движущийся текст; бегущие строки превращают статичные страницы в динамичные и живые. Чтобы поместить на страницу бегущую строку: 1. Установите курсор в то место страницы, где должна располагаться бегущая строка. Выберите в меню Insert пункт Active Elements и далее Marquee в появившемся 3 меню. На экране появится диалоговое окно Marquee Properties (Свойства бегущей строки), показанное на рис. 30. Рис. 30. Диалоговое окно Marquee Properties. 2. В поле Text введите текст бегущей строки. 3. В секции Direction (Направление) укажите направление движения строки — Left (Влево) или Right (Вправо). 4. В секции Movement Speed (Скорость движения) введите значения задержки (Delay) и шага (Amount). Задержка определяет интервал в миллисекундах между последовательными перемещениями строки. Шаг задает расстояние в пикселах между последовательными положениями строки, т. е. скорость движения строки можно повысить, увеличивая это число. Манипулируя двумя этими значениями, можно заставить "бегать" вашу строку с любой скоростью. 5. В секции Behavior (Поведение) выберите одну из следующих опций: • Scroll (Прокрутка). В этом случае строка движется по экрану в направлении, указанном в секции Direction. Текст появляется из-за границы области, отведенной бегущей строке, и исчезает за противоположным краем. • Slide (Сдвиг). Этот вариант отличается от предыдущего тем, что строка, достигнув противоположного края, останавливается, и текст остается на экране. • Alternate (Попеременно). При этом текст бегущей строки движется попеременно то в одну, то в другую сторону, никогда не исчезая с экрана. 6. В секции Align with Text (Привязка к тексту) укажите, как текст должен располагаться в пространстве, отведенном бегущей строке; размеры этой области 4 задаются в секции Size. Текст можно прижать к верхней границе поля строки (Ton), к нижней границе (Bottom) или разместить посередине (Middle). 7. В секции Size устанавливается размер прямоугольной области, отведенной бегущей строке. Если вы задаете ширину в пикселах, то введите нужное значение и выберете переключатель В пикселах; если ширина должна быть задана в процентах от ширины экрана, то введите ее значение и выберите переключатель В процентах. Чтобы задать размер области бегущей строки по вертикали, установите флажок Высота. Чтобы бегущая строка легко читалась, предоставьте ей побольше свободы: отведите ей поле достаточной высоты и расположите посередине поля (секция Привязка к тексту, параметр Middle (Середина)). 8. В секции Repeat (Повтор) задайте число "пробегов" строки или, если вы хотите, чтобы строка бежала постоянно, без конца, установите флажок Continuously (Непрерывно). 9. При желании задайте для бегущей строки цвет фона, выбрав его из раскрывающегося списка Background Color (Цвет фона). Иногда фон бегущей строки, отличный от фона остальной страницы, производит благоприятное впечатление, но старайтесь не переборщить с цветами. 10. Произведя все необходимые установки, нажмите кнопку ОК и выйдите из диалогового окна Marquee Properties. Чтобы изменить параметры бегущей строки, щелкните на ней правой кнопкой мыши и выберите в контекстном меню пункт Marquee Properties, либо дважды щелкните левой кнопкой; при этом откроется уже знакомое вам диалоговое окно Свойства заставки. Сделайте необходимые исправления и нажмите кнопку ОK. Задание для самостоятельно выполнения На странице soderganie.htm добавить бегущую строку, где ввести информацию о создателях сайта. Использование баннеров и совместных границ Баннеры страниц - это средство быстрого создания заголовков на веб-страницах. Если к текущей странице применяется какая-либо тема, то для баннера этой страницы используются шрифт и графика этой темы; в противном случае баннер страницы содержит только текст, который форматируется вручную. В баннере страницы выводится заголовок для каждой страницы. Веб-страницы могут также содержать совместные границы, представляющие 5 верхние, нижние, левые и правые области всех или некоторых страниц веб-узла. С помощью совместных границ можно обновлять информацию всех страниц, внося изменения только в одном месте. Например, если логотип компании появляется вверху каждой страницы веб-узла, а примечание об авторских правах (copyright) - внизу, можно обновить логотип и примечание об авторских правах на одной странице, и эти изменения будут сразу же реализованы на всех остальных страницах. Совместные границы обеспечивают постоянство и правильность представления информации на всех страницах узла. Для создания совместных границ выполните следующее: 1. В окне Вид щелкните по кнопке Папки и в рабочей области просмотрите содержимое Вашего сайта (см. рис.). Для изменения имен и заголовков страниц из контекстного меню выберите пункт Переименовать для требуемой страницы. 2. Далее в окне Вид щелкните по кнопке Navigation (Навигация), чтобы переключиться в режим просмотра переходов узла. Навигационная структура в этом режиме представляет собой иерархические связи страниц внутри сайта и «маршруты», которые Вы можете использовать для перемещения из одной страницы в другую. 3. Для создания иерархической структуры узла перетащите из окна Список файлов в рабочую область все созданные страницы. Создайте следующую структуру, представленную на рис. 6 4. В меню Format (Формат) выберите пункт Shared Borders (Совместные границы). 5. В диалоговом окне Shared Borders выберите вариант All pages (Ко всем страницам) и затем установите флажки Тор (Верхняя) и Left (Левая). Выбор параметров будет отражаться в окне предварительного просмотра (см. рис.). 6. Щелкните на кнопке ОК, чтобы закрыть диалоговое окно Shared Borders (Совместные границы) и применить к совместным границам новые значения параметров. Если содержимое вашей страницы было отформатировано ранее, то появится окно сообщения, предупреждающее, что изменение параметров для верхней или левой совместной границы приведет к перезаписи содержимого. Для продолжения щелкните на кнопке Yes (Да). Совместные границы появятся вверху и слева остального содержимого каждой страницы веб-узла с примечанием, идентифицирующим каждую границу. Задание для самостоятельного выполнения Включите верхнюю и левую совместные границы на страницах веб-узла Мой личный сайт. Затем просмотрите, как изменится Ваш узел после задания совместных границ.