Создание текстовых веб-документов

⇐ ПредыдущаяСтр 10 из 12Следующая ⇒

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

Результаты должны выглядеть так:

для навигатора,

и так:

для каталога.

Для указания размеров ячеек таблиц необходимо использовать атрибуты width (ширины) и height (высоты), для указания цвета фона – bgcolor.

Размер шрифта задается с использованием атрибута <font size= n >.

Коды цветов приведены в таблице, которая находится в папке ИРМ на сервере.

4.1 Создайте вэб-страницу navigator.

4.2 Создайте вэб-страницу catalog.

4.3 Впишите имена этих файлов как имена фреймов в файл index.

4.4 Проверить результат, активизировав файл index.

Организация гиперссылок на сайте-витрины

Мощным инструментом динамического наполнения страниц с фреймовой организацией экрана является использование аппарата гиперссылок. Это обеспечивает тег-контейнер <a> </a>, в пределах которого указывается т.н. URL адрес. Абсолютный URL адрес указывает полный путь т.е. с указанием протокола, сервера, каталога и страницы (как например http://www.mysite.ru/public/index.html ). Он всегда точен, но громоздок. В случае адресования элементов, расположенных в одном каталоге старшая часть адреса может отсутствовать. Так, если связываемые вэб-страницы расположены в одной папке, достаточно для ссылки указать только имя файла. Если файлы расположены в соседних каталогах, следует указывать путь начиная с имени одноуровневых папок, например: ../private/price.html.Две точки в начале означает подняться в иерархии папок на уровень выше.

При создании гиперссылок важным моментом является возможность вызова вэб-страницы в нужную область экрана (в нужный фрейм). Для этого используются атрибуты, с помощью которых можно дать имя любому фрейму !

Такая конструкция выглядит следующим образом:

Когда именование фреймов произведено, вызов в эту область производится с использованием атрибута target:

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

5.1 Откройте в блокноте вэб-страницу catalog.

5.2 Организуйте гиперссылку по слову кресла с вызовомпо ней в область content веб-страницы сontent.

5.3 Сохраните изменения и проверьте работоспособность ссылки.

5.4 Аналогичным образом организуйте вызов на поле сontent расширенной информации по креслу aragon, используя как гиперссылку рисунок этого кресла (aragon.jpg) в таблице на странице content.

В качестве расширенной информации по креслу следует взять рисунок aragon_big, находящийся в папке рисунки_кресел.Очевидно, что вызываемый по этой гиперссылке фрагмент должен быть оформлен как html-документ.

5.5 Проверьте работоспособность ссылки.

5.6 Для корректности навигации следует соблюдать правило возврата, т.е. всегдадолжна присутствовать возможность вернуться по обратной гиперссылке к предыдущему состоянию!

Реализуйте это правило, организовав гиперссылку по рисунку aragon_big с вызовом веб-страницы сontent в область content .

5.7 Проверьте работу всех ссылок.

Доработка сайта

Для закрепления навыков, полученных при выполнении п.п. 3,4,5 доработайте сайт-витрину. Организуйте возможность вызова на поле content товарную информацию о диванах, по аналогии с тем, как это было организовано для кресел.

При оформлении этого сайта используйте рисунки товаров с сайтов в соответствии с вашим номером в списке :

№1 по списку http://gold-meb.ru,

№2 по списку http://www.homeme.ru,

№3 по списку http://www.mebel-moda.ru,

№4 по списку http://ladya.ru,

№5 по списку http://www.stolplit.ru,

№6 по списку http://www.good-mebel.com,

№7 по списку http://www.britannica.su,

№8 по списку http://www.mebelniyostrov.ru,

№9 по списку http://www.domosti.ru,

№10 по списку http://www.angagement.ru.

Рисунки, необходимые для наполнения области сontent, можно получить, используя технологию п.2. Для одного из образцов диванов организовать вызов расширенной информации. Рисунки диванов целесообразно разместить в отдельной папке рисунки_диванов.

Выполнение этой части работы должно привести к тому, что из поля навигатора появится возможность вызова в область сontent информации по крайней мере о двух группах товаров данного направления (мебели). Аналогично, используя строки каталога можно организовать вызов информации о других товарах, а по элементам навигатора осуществить вызов нужных для посетителя сайта сведений.

Дата добавления: 2018-04-05; просмотров: 194; Мы поможем в написании вашей работы!

Поделиться с друзьями:

⇐ Предыдущая 3 4 5 6 7 8 91011 12 Следующая ⇒

Мы поможем в написании ваших работ!