double arrow

Планирование Web-сайта

3

ДИЗАЙН WEB – СТРАНИЦ С ИСПОЛЬЗОВАНИЕМ ТАБЛИЦ

При создании дизайна WEB – страницы, размещения данных, используют таблицы.

<TABLE>…</TABLE> тег, открывающий и закрывающий таблицу

<TН>…</TН> заголовок таблицы. По умолчанию текст располагается по центру, имеет жирное начертание

<TR>…</TR> строка таблицы

<TD>…</TD> ячейки с данными

COLSPAN = кол-во_ячеек объединение столбцов

ROWSPAN – кол-во_строк объединение строк

ширина всей таблицы или ячейки, группы ячеек

HEIGHT = высота всей таблицы или ячейки, группы ячеек

CELLPADDING = ширина пустого пространства между содержимым ячейки и ее границами

ALIGN = выравнивание текста в ячейке по горизонтали

VALIGN = выравнивание текста в ячейке по вертикали

«TOP» по верхнему краю

«BOT - TOM» по высоте

«CENTER» по центру

«BASELINE» по нижнему краю

BORDER = рамка таблицы

CELLSPACING = ширина промежутков между ячейками

Цвет фона таблицы

BORDERCOLOR = цвет линий, обрамляющих таблицу

BORDERCOLORDARK = атрибут для создания трехмерных таблиц

BORDERCOLORLIGHT = атрибут для создания трехмерных таблиц

Пример:

<TABLE BORDER = 1 CELLSPACING = 0 CELLSPACING = 0 HEIGHT = «1» BORDERCOLOR = # 334455 BORDERCOLORLIGHT = # 334455>

<CAPTION> Таблица</CAPTION> - заголовок таблицы




<TR BGCOLOR = # 000055>

<TD WIDTH = «400»>

<BR>

</TD>

</TR>

<TR BGCOLOR = # 000066>

<TD WIDTH = «400»>

<BR>

</TD>

</TR>

</TABLE>


фреймы

Технология фреймирования позволяет просматривать в одном окне обозревателя несколько гипертекстовых документов. Один фрейм отображает только один гипертекстовый документ.

<FRAMESET> </FRAMESET> Тег создания и окончания фреймов
<NOFRAMES> </NOFRAMES> Теги для описания фрейма для браузера, не поддерживающего фреймы
<FRAMESET COLS= «фрейм_1, фрейм_2, …»> Определяет количество и размеры горизонтальных подокон. Размер подокна определяется в пикселах, процентах (%) или в пропорциях (*).
<FRAMESET ROWS= «фрейм_1, фрейм_2, …»> Определяет количество и размеры вертикальных подокон.
<FRAME> Тег позволяет настроить свойства фрейма, имеет атрибуты:
SRC= Адрес документа, который будет отображаться внутри фрейма
NAME= Имя фрейма
MARGINWIDTH= Горизонтальный отступ (от 1 до 6) между фреймом и границей
MARGINHEIGHT= Вертикальный отступ (от 1 до 6) между фреймом и границей
SCROLLING= SCROLLING= YES SCROLLING= NO SCROLLING= AUTO Прокрутка фрейма: создать полосу прокрутки полоса прокрутки отсутствует полосы прокрутки отображаются в зависимости от свойств обозревателя
NORESIZE= Фиксированный размер фрейма
SRC= Задать гипертекстовый документ для фрейма
TARGET= “имя_фрейма” Открыть ссылку во фрейме с именем имя_ссылки. Размещается в теге <A HREF=”…” TARGET=”…”> или в теге описания фрейма.
TARGET=”_blank” Загрузить документ в новом окне
TARGET=”_self” Загрузить документ в текущее окне
TARGET=”_top” Загрузить документ в самый верхний фрейм окна

Примеры:



<FRAMESET ROWS="*,*">

<FRAMESET COLS="65%,35%">

<FRAME SRC="link1.html">

<FRAME SRC="link2.html">

</FRAMESET>

<FRAMESET COLS="*,40%,*">

<FRAME SRC="link3.html">

<FRAME SRC="link4.html">

<FRAME SRC="link5.html">

</FRAMESET>

</FRAMESET>

Результат:

65% по горизонтали 35% по горизонтали
Половина от оставшихся 60% 40% по горизонтали Половина от оставшихся 60%
       

Лекция 5. Средства разработки мультимедийных приложений

Лекция 6. Создание мультимедийной презентации

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

2. Определение состава проектной группы:

руководитель проекта, ведет работу над проектом;

отдел графического оформления, занимается художественным оформлением сайта и разработкой всей графики;

отдел Web-разработки, занимается разработкой кода HTML для просмотра с помощью броузера.



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

3. Определение программного обеспечения, которое требуется для разработки Web-сайта.

4. Определение способа подачи информации. Необходимо принять во внимание различные факторы.

Факторы Пример: туристическое агентство
категории пользователей (вся, специализированная или частная аудитория) большинство пользователей – индивидуальные пользователи
скорость соединения для получения доступа к сайту вероятнее всего пользователи будут пользоваться коммутируемыми соединениями на скорости 28? 49 Кбит/с, хотя у некоторых из них могут быть и более высокоскоростные соединения
версии броузеров вероятнее всего пользователи пользуются не самыми последними версиями броузеров

Чем больше внимания уделяется этим факторам, тем точнее будет определена целевая аудитория и эффективнее представлена информация. Что позволит правильно определить цели разработки сайта.

5. Планирование архитектуры Web-сайта. Документ представляет собой блок-схему, на которой показаны все страницы, и отражена взаимосвязь между ними.

6. Определение структуры страницы. Компоновка страницы, содержащая оформление и средства перемещения по этой странице. Схематическое изображение внешнего вида каждой части сайта. Страницы второго уровня, на которых представлены специальные области, аналогичны начальной странице по своему оформлению, однако в других аспектах они будут от нее отличаться. Это помогает посетителям ориентироваться в пределах сайта.

7. Созданиераскадровки страницы. Планирование последовательности анимационных действий, визуальная детализация интерактивных и прочих действий на сайте. Описание кнопок, содержание ссылок, всплывающих подсказок и др.

8. Принятие решения относительно оформления и графики, используемой на Web-сайте. Определение всех файлов, которые будут использованы. Имеет смысл хранить копии исходных файлов в отдельной папке, что дает возможность сохранить их в исходном формате, причем с более высоким разрешением, т.к. Web-графика отображается с разрешением 72 точки на дюйм.

9. Определение вспомогательных приложений, которые требуются для компоновки Web-сайта.

10. Создание Web-сайта.

Лекция 7. Динамические процессы в мультимедиа среде

Лекция 8. Сведение элементов мультимедийного проекта в единое целое



3




Сейчас читают про: