FrontPage 2003 - профессиональное средство проектирования и создания сложных, динамических web-сайтов.

Microsoft Office FrontPage

Программа создания Веб-сайтов и управления ими

ЭТО ПРОСТО?!!

презентация подготовлена Никитиным М.Е.

План:

• Внешний вид программы
• Создание страницы, Web-узла
• Выбор темы
• Фон
• Вставка рисунка
• Вставка веб-компонента (Создание интерактивной кнопки) ‏
• Вставка гиперссылки
• Вставка фотоколлекции
• Вставка таблицы
• Шаблоны страниц
• Создание страницы рамок

презентация подготовлена Никитиным М.Е.

ВНЕШНИЙ ВИД ПРОГРАММЫ

Найдите сходства с Microsoft Office Word

Найдите сходства с

Создание страницы происходит в режимах «конструктор» и, если Вы владеете языком HTML, в режиме «код»

Режимы:

презентация подготовлена Никитиным М.Е.

СОЗДАНИЕ САЙТА

?

презентация подготовлена Никитиным М.Е.

Выбор темы

Использование темы «утяжеляет» сайт, поэтому лучше использовать для фона рисунок!!!

презентация подготовлена Никитиным М.Е.

Оформление фона

Выберем в качестве

фона рисунок

Чтобы рисунок не двигался ставим галочку

презентация подготовлена Никитиным М.Е.

Вставка рисунка

Знакомо?!!

презентация подготовлена Никитиным М.Е.

Вставка веб-компонента

Рассмотрим создание интерактивной кнопки

Нажимаем готово

презентация подготовлена Никитиным М.Е.

Первая вкладка «Кнопка»

Вводим текст на кнопке

Выбираем вид кнопки

презентация подготовлена Никитиным М.Е.

Вторая вкладка «Шрифт»

Выбираем шрифт

Начертание

Размер шрифта

Исходный цвет текста

Цвет при наведении

Цвет при нажатии

презентация подготовлена Никитиным М.Е.

Третья вкладка «Рисунок»

Выбираем ширину и высоту кнопки

Если кнопка со скругленными углами, то необходимо поставить флажок «Использовать для кнопки формат GIF и прозрачный фон.

Нажимаем «ОК»

презентация подготовлена Никитиным М.Е.

Вставка гиперссылки

Выделяем нужный элемент (фрагмент текста, рисунок и т.п.) ‏

Например, из списка нов_стр_1.htm

когда готовы

все страницы,

устанавливаем связи

между ними:

Указываем адрес

презентация подготовлена Никитиным М.Е.

Вставка фотоколлекции

Фотоколлекцию можно вставить только в Web-узел !

Прежде чем создавать фотоколлекцию, необходимо поместить снимки в папку, находящуюся в Web-узле!!!

презентация подготовлена Никитиным М.Е.

Наполнение фотоколлекции

• Нажимаем добавить – рисунки из файла - … и повторяем эти действия до наполнения коллекции

• Для каждой фотографии можно создать подпись, использовать другие параметры шрифта

• Можно фотографию изменить, удалить

презентация подготовлена Никитиным М.Е.

Выбираем макет

Нажимаем «ОК»

презентация подготовлена Никитиным М.Е.

Вставка таблицы

• Можно воспользоваться макетной таблицей

• Границы таблицы можно сделать прозрачными
• Таблицы часто используют для выравнивания текста …

• Или нарисовать таблицу самому

презентация подготовлена Никитиным М.Е.

Шаблоны страниц

презентация подготовлена Никитиным М.Е.

Первая вкладка «Общие»

презентация подготовлена Никитиным М.Е.

Вторая вкладка «Страница рамок»

презентация подготовлена Никитиным М.Е.

Рассмотрим более подробно создание страниц рамок»

• Для примера выберем «Вложенную иерархию»

• Определим конечную рамку (для «загрузки» страниц)

презентация подготовлена Никитиным М.Е.

Появляются страницы рамок

Мы можем задать

начальную страницу,

если такая имеется

• Повторяем действия для всех рамок

• Выбираем нужную страницу

• Нажимаем «ОК»

презентация подготовлена Никитиным М.Е.

Создание страниц

презентация подготовлена Никитиным М.Е.

Сохраняем страницы

• Файл –
• сохранить

• Даем имя странице

• Видим расположение страницы

• Запоминаем название конечной рамки

презентация подготовлена Никитиным М.Е.

Добавление гиперссылки

• Выделяем элемент для гиперссылки
• Вставка
• гиперссылка

• Выбираем страницу

• Выбираем рамку

• Делаем ЩЛКМ по конечной рамке

• Нажимаем «ОК»

• Появляется окно «Конечная рамка»

• Устанавливаем страницу по умолчанию

презентация подготовлена Никитиным М.Е.