Создание Web-страниц при помощи программы FrontPage. Использование изображения в качестве фона Создаём шаблон для страниц в FrontPage

Что можно добавить на сайт, чтобы улучшить визуальное восприятие? Можно задать фон страницы . Белые страницы на сером фоне воспринимаются гораздо лучше.

Задача фона страницы акцентировать и концентрировать внимание на содержании сайта, а не отвлекать. Поэтому правильным будет использовать нейтральные фоны. Обычно это серые оттенки.

Давайте нашей странице добавим фон. Напомню, что сейчас наш сайт выглядит вот так (нажмите ссылку).

1. Для того, чтобы добавить фон, открываем программу Frontpage и в меню " Формат" нажимаем " Фон"

3. Нажимаем " Другой. .."

4. Выставляем следующие значения:

Оттенок: 160, Контраст: 0, Яркость: 216,

Красный: 230, Зеленый: 230, Синий: 230

и жмем везде " Ок"

5. После всех наших манипуляций все закрасилось серым цветом, т.е. фон страницы и сама страница стали светло - серыми.

Как перекрасить ячейку в белый цвет

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

6. Для этого на странице надо нажать правую кнопку мыши и в раскрывшемся меню выбрать " Свойства ячейки"

7. Далее: " Фон" - " Цвет" - " Белый цвет" - " Применить" - " Ок"

9. Таким образом, на странице сайта мы создали фон. Теперь сама страница белая, а фон светло - серый:

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

С помощью программы Frontpage вставить видео на сайт не составляет ни малейшего труда. Для этого Вам не надо будет искать в интернете, скачивать и использовать дополнительные плагины или скрипты. В этом уроке я расскажу, как вставляется видео на сайт с популярного видеохостинга YouTube . Делается это легко, быстро и тем более бесплатно.

На Ютубе Вы всегда можете найти множество роликов в свободном доступе на любую тематику и затем добавить их на страницы своего сайта.

Или можете записать свой ролик самостоятельно. Загрузить его на видеохостинг, а потом также вставить с Ютуба на свой сайт. Для этого потребуется лишь предварительно зарегистрироваться на сервисе и создать свой аккаунт.

Для чего вставляют видео на сайт?

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

Во-вторых, когда посетитель просматривает видео, он какое-то время находится на сайте и не уходит с него. А это очень хорошо сказывается на продвижении сайта поисковыми системами.

А иногда без видео ну никак нельзя. Например, домохозяйка создала сайт по урокам вязания и шитья. Уверен, что одними картинками и текстом здесь не обойтись. А вот если записать видео о том, в какую петлю просунуть спицу, да какой узелок затянуть, а потом добавить видео на сайт, то все сразу станет понятным.

Или какой-нибудь другой тематический сайт. Например, как правильно подготовить снасти к рыбалке или как правильно накачать пресс. Как же здесь без видео обойтись?

Как вставить на сайт видео с Ютуба

Повторю, что делается это весьма просто. С Ютуба копируется HTML -код видео и вставляется на страницу сайта. Все это занимает не более 3-х минут. Предлагаю научиться этому, используя наш сайт, который мы создали на прошлых уроках. Давайте разместим на нем видео-обзор о подарочном наборе чая " Ассорти" .

Сразу скажу, что специальное видео самостоятельно я не записывал. Чай действительно был очень вкусным и я его очень быстро выпил. А вот видео не успел записать))

Поэтому на Ютубе я нашел небольшой ролик про этот подарочный набор. Он вполне подойдет нам в качестве примера и даст понимание принципа, как вставляется видео на страницы сайта созданного в html .

Итак, поехали:

1. Заходим на сайт www.youtube.com и в строке поиска набираем фразу " подарочный набор чай Гринфилд " . Ниже появится список видео-роликов, отвечающих нашему запросу. Я выбрал четвертый по счету сверху (спасибо автору за его создание). Вот на всякий случай прямая ссылка не него: http://www.youtube.com/watch?v=hNFpu3EOPAM

3. Затем нажимаем "HTML -код"

4. Копируем код

5. Открываем в программе Frontpage наш сайт о чае. Напомню, что сейчас он выглядит у нас вот так (нажмите ссылку) и ставим букву "O " над словом " Доставка "

6. Далее выделяем левой кнопкой мышки букву "O " , переходим в режим " С разделением" , находим в верху в коде букву " О " и тоже выделяем ее

7. В коде вместо буквы " О " вставляем код видео, который мы скопировали (см. п.4), нажимаем на кнопку " Конструктор" и жмем сохранить

8. В итоге всех наших манипуляций на страницу сайта вставился прямоугольник серого цвета. На нем написано: " Не удается открыть страницу" и далее идет ссылка на видео с Ютуба.

10. Вот и все . Мы вставили видео на наш сайт . Теперь на сайте кроме текста и картинок присутствует еще и визуализация.

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

На мой взгляд такой видео-отзыв, помимо текста и картинок, дает еще более четкое представление о размерах, наполнении и качестве товара, который мы предлагаем купить у нас.

Поэтому видео не только можно, но и нужно использовать у себя на сайте. Главное не переусердствовать. О том, как НЕ наделать ошибок при создании сайта и прочих фишках очень подробно рассказывается в видео-курсе №3, который называется " Как создать сайт, который нравится людям " . Очень рекомендую.

А для релакса предлагаю посмотреть красивое видео.

Вопросы и ответы

Дорогие друзья! Если у Вас имеются вопросы, предложения или вдруг что-то стало непонятным, то Вы всегда можете написать мне об этом. Напоминаю, что для этого на сайте создана специальная форма . Я обязательно отвечаю всем на письма.

Я не так давно начал изучать программу "Microsoft FrontPage 2003" по книге "Microsoft Office FrontPage 2003" (384 стр.), русская версия (+1 CD), г.Москва, 2005 г. Описание в книге достаточно подробное и плюс в том, что много иллюстраций-скриншотов, чтоб можно было сравнивать, что получается у пользователя и как это выглядит в книжке. А на CD-диске даются дополнительные материалы по урокам Front Page из книги. Я прочёл 190 страниц и всё было нормально, все упражнения получались точь в точь по книжному. Дошёл до темы "Добавление границ и заливки" (стр. 190-194). Остновлюсь только на сути возникшей у меня проблемы по порядку:
1) в упражнении нужно создать одностраничный сайт;
2) открываем главную (домашнюю) страницу сайта index.htm;
3) на странице несколько раз нужно нажать Enter - чтоб курсор опустился до самого низа страницы (или чуть ниже можно);
4) когда курсор будет внизу выделяем всю страницу нажатием клавиш Ctrl + A, выделенная страница станет чёрной;
5) теперь нужно создать изображение заднего фона на странице:
a) на панели инструментов щёлкаем Формат и выбираем пункт Границы и заливка;
b) переходим на вкладку Заливка;
c) внизу в поле, где написано Узор щёлкаем на кнопке Обзор… и выбираем на компьютере подходящее изображение для заднего фона (не большое примерно 1/16-1/32 от размера страницы), после этого в строке Фоновый рисунок должен отобразиться путь к картинке на компьютере;
d) теперь выставляем настройки расположения этой фоновой картинки на странице сайта index.htm:


Повторить: по оси Х
Присоединение: прокручивать
e) нажимаем далее ОК и смотрим на вкладке Просмотр программы Front Page (это внизу) - фоновая картинка размножится по горизонтали страницы (слева на право);
f) возвращаемся снова на вкладку Конструктор программы Front Page и повторяем шаги с пункта 4) – выделить страницу до пункта d) здесь ставим новые настройки:
Положение по вертикали: по центру
Положение по горизонтали: по центру
Повторить: по оси Y
Присоединение: прокручивать
g) нажимаем ОК и смотрим на вкладке Просмотр программы Front Page - фоновая картинка размножится по вертикали страницы (сверху вниз);
h) возвращаемся снова на вкладку Конструктор программы Front Page и повторяем шаги с пункта 4) – выделить страницу до пункта d) здесь ставим новые настройки:
Положение по вертикали: по центру
Положение по горизонтали: по центру
Повторить: по осям X и Y
Присоединение: прокручивать
i) нажимаем ОК и смотрим на вкладке Просмотр программы Front Page - фоновая картинка замостит собой всю страницу (размножится по всей странице);
Всё что было до этого сходится с упражнением в книге. Теперь мы дошли до проблемы.
j) возвращаемся снова на вкладку Конструктор программы Front Page и повторяем шаги с пункта 4) – выделить страницу до пункта d) здесь ставим новые настройки:
Положение по вертикали: по центру
Положение по горизонтали: по центру
Повторить: нет
Присоединение: прокручивать
l) нажимаем ОК и смотрим на вкладке Просмотр программы Front Page - фоновая картинка ДОЛЖНА (согласно настройкам) отобразиться в единичном экземпляре в центре страницы, но этого почему-то не происходит. Она множится по всей странице. Не могу понять в чём проблема. Спасибо за помощь!

С развитием Интернета появился протокол обмена информацией,протокол называется HTTP (HyperText Transfer Protocol – протокол передачи гипертекста).Вместе с этим протоколом появилась и служба World Wide Web (часто называемая WWW или просто Web ), которая подставляет собой обширную сеть серверов HTTP , передающих файлы через Интернет .

Основную часть этих файлов представляют собой Web-страницы – специальные файлы, написанные на языке HTML (HyperText Markup Language – язык разметки гипертекста). Web-страницы публикуются в Интернете путем размещения таких файлов на серверах HTTP (Web-узлах) . Содержание Web-страниц может быть разным и посвященным совершенно произвольным темам, но все они используют одну и тужу основу – язык HTML .
Большинство людей желающих создать свой собственный сайт или страничку, знакомы с языком HTML только понаслышке. Поэтому им на помощь может придти программа Microsoft FrontPage ,один из самых известных конструкторов сайтов.

FrontPage, входит в пакет приложений Microsoft Office , стал первым продуктом широкого использования для Internet , сочетающим в себе клиентскую и серверную части и обеспечивающим возможность разработки сайта в целом и установки его на большинство популярных серверов. FrontPage способен взять на себя всю необходимую работу по программированию. Однако FrontPage станет достаточно серьезным помощником и для профессиональных разработчиков, предпочитающих держать в руках полный контроль над творческим процессом.

Окно программы FrontPage 2003.

Программа FrontPage выпущена компанией Microsoft и выполнена в едином стиле продуктов, входящих в пакет Microsoft Office , поэтому внешний вид программы практически не отличается от текстового процессора Word .

В верхней части окна располагается строка меню и две панели инструментов: Стандартная и Форматирование . Включать или отключать отображение панелей инструментов позволяет меню Вид .
В левой части находится Панель представлений , при помощи которой можно переключать режимы документа.
Основную часть окна занимает рабочая область, в которой могут быть открыты одно или несколько окон, содержащих отдельные документы.
В нижней части окна располагается строка состояния , содержащая справочную информацию . Так же в нижней части окна находятся три кнопки просмотра документа.
Отображение панелей инструментов.
Для управления панелями инструментов во FrontPage можно воспользоваться теми же способами, как в Microsoft Word . А именно:
в меню Вид надо выбрать пункт Панели инструментов , а в открывшемся новом подменю - установить флажки напротив тех панелей инструментов, которые вам нужны; или щелкнуть правой кнопкой мыши по какой-либо панели управления (или по области рядом с ней) и точно так же воспользоваться контекстным меню.

FrontPage , как и другие приложения Microsoft Office , позволяет добавлять, удалять, менять местами пункты меню и кнопки на панелях инструментов. Также существует возможность создавать полностью свои панели.
Для этого надо:

В меню Сервис выбрать пункт Настройка …
или
в меню Вид выбрать пункт Панели инструментов , а в появившемся каскадном меню - пункт Настройка …
В результате ваших действий откроется диалоговое окно Настройка , где можно установить необходимые панели.

Создание новой Web-страницы .

Если вы запустили FrontPage , значит, новая Web-страница у вас уже создана (при запуске FrontPage сразу открывается новая пустая Web-страница , готовая для размещения текста и любых других элементов).
Создать новую Web-страницу можно и другими способами:

С помощью кнопки Новая страница на Стандартной панели инструментов.
меню Файл выбрать подменю Создать , а затем – Страница или Web-узел ;
с помощью комбинаций Ctrl+N ;
с помощью контекстного меню (работает во всех режимах, кроме режимов Задачи и Отчеты ) - для этого внутри Списка папок данного Web ) надо щелкнуть правой кнопкой мыши и в появившемся контекстном меню выбрать пункт Создать  Страница .

Создание станиц при помощи мастера и шаблонов.

Как уже говорилось выше, если для создания новой страницы вы воспользовались меню Файл  Создать  Страница или Web-узел , то FrontPage предложит вам воспользоваться шаблоном для создания новой страницы.
Для этого он откроет диалоговое окно, внешний вид которого приведен ниже:

На вкладке Общие данного диалогового окна выводится перечень шаблонов FrontPage , доступных в настоящий момент. Выбрав любой из шаблонов, можно посмотреть его описание в поле Образец .
Создание FrontPage Web .
Microsoft FrontPage Web - это набор Web-страниц , файлов с изображениями и других компонентов, которые можно рассматривать как единое целое.
Если делать сайт во FrontPage , то для его хранения удобней всего использовать FrontPage Web .
самый главный плюс - это возможность переименовывать файлы, входящие в состав FrontPage Web .
Представьте себе, что перед публикацией вашего сайта в Интернет вы вдруг заметили, что пара файлов у вас названа русскими именами. - «Теперь по всем файлам придется лазить и ссылки ручками менять!» дуамете Вы.Вот тут-то и поможет FrontPage Web - вы можете покойно переименовать файлы, а FrontPage самостоятельно пройдется по всем другим файлам, входящим в FrontPage Web и переименует все ссылки на исправленный вами файл.
все остальные преимущества описывать не буду, но хочется сказать, что для использования всех возможностей FrontPage , то лучше использовать FrontPage Web .
Итак, чтобы создать новый FrontPage Web нажмите на стрелочку, расположенную слева от кнопки Новая страница на панели инструментов и в появившемся выпадающем меню выберите пункт Веб-узел…

Открытие Web-страниц.

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

Открыть уже существующую Web-страницу можно в любом из существующих режимов.

Из режима Page Views есть четыре способа открыть существующую страницу:

1 способ

Если вы работаете с FrontPage Web , то просто выберите нужный файл в Списке папок и дважды щелкните по нему мышью.

2 способ

В меню Файл выберите пункт Последние файлы . Из появившегося каскадного меню выберите нужный файл.

3 способ

С помощью диалогового окна Открытие файла: Файл  Открыть .

Предварительный просмотр.

Для того чтобы посмотреть, как ваша страница выглядит непосредственно в браузере можно воспользоваться вкладкой Просмотр в режиме редактирования Web-страницы . Но в данном случае может оказаться, что браузер FrontPage не вполне корректно отобразит некоторые элементы вашей страницы , поэтому лучше всего:
воспользоваться кнопочкой на панели инструментов
или в меню Файл выбрать пункт Предварительный просмот р в обозревателе.

Если вы воспользовались первым способом, то содержимое вашей страницы отобразиться во встроенном браузере FrontPage .
Если же вы воспользовались вторым способами, то FrontPage выведет диалоговое окно Просмотр в обозревателе…

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

Сохранение Web-страниц .

По умолчанию FrontPage вместо названия страницы берет первую строку текста с вашей страницы . Это не всегда то, что надо. Изменить название страницы можно с помощью кнопки Изменить - нажатие на эту кнопку открывает диалоговое окно Название страницы , в котором вы можете изменить название страницы .

Удаление Web-страниц.

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

Существует три способа удаления Web-страницы .

1 способ

В панели Список папок выделите файл, который необходимо удалить и нажмите кнопку Delete на клавиатуре.

2 способ

В панели Список папок щелкните правой кнопкой мыши по файлу (или значку файла ), который необходимо удалить и в появившемся контекстном меню выберите пункт Удалить .

3 способ

В панели Список папок выделите файл , который необходимо удалить и затем выберите пункт Удалить в меню Правка .

Работа с текстом.

На первый взгляд, ввод текста во FrontPage ничем не отличается от ввода текста в любом текстовом редакторе (например, в Microsoft Word ).
Для того чтобы набрать текст, достаточно щелкнуть мышью в любом месте страницы, и курсор будет помещен в ближайшую точку, в которую можно ввести текст.
Набор прописных букв, редактирование текста (удаление символов, вставка текста и т.д.) производится точно также, как в Microsoft Word.
Есть только одно небольшое НО: при нажатии клавиши Enter во FrontPage осуществляется принудительный переход курсора на новую строку, при этом до и после абзаца ставятся фиксированные абзацные отступы.
Если вам не надо создавать абзацы, то для перехода на новую строку лучше всего использовать комбинацию клавиш Shift +Enter.

Работа с изображениями.

Графически форматы в Web .

Все компьютерные изображения, все форматы для их хранения (а, следовательно, и все программы для их обработки) делятся на два больших класса - векторные и растровые . Векторное изображение состоит из объектов - геометрических форм, составленных из прямых, дуг, окружностей и кривых Безье. Достоинств у векторной графики немало. С точки зрения дизайнера, самое главное ее достоинство состоит в том, что векторную графику можно «вертеть» как угодно, не боясь «протереть дырку» в изображении или потерять часть информации. Другое достоинство - небольшой объем файлов (в сравнении с растровыми изображениями) и независимость от разрешения устройств вывода (будь то принтер или экран монитора). Эти факторы сделали векторную графику вероятным кандидатом для использования в Internet . Правда стоит оговориться, что на сегодняшний момент векторная графика встречается не так уж часто, как хотелось бы.
Тем не менее, среди реально применяемых векторных форматов хотелось бы отметить формат Shockwave Flash фирмы Macromedia . Для просмотра этого формата в браузере нужен подключаемый модуль (plug-in ), бесплатно распространяемый фирмой Macromedia . На сегодняшний день существуют как сайты целиком и полностью созданные по этой технологии, так и сайты, используемые Flash-формат лишь частично.
Растровое представление графики базируется на понятии растра. Растр – это совокупность объектов (в данном случае пикселей), размещенных в одинаковые строки и столбцы. Т.е. растровый компьютерный файл можно рассматривать как набор маленьких цветных или серых квадратиков, образующих мозаику изображения. Т.к. размер этих квадратиков заведомо мал, то при просмотре растровой графики эти квадратики сливаются друг с другом, образуя непрерывную смену цветов.

Растровый формат хранения изображения имеет как свои преимущества, так и недостатки. Одним из больших плюсов растровой графики является возможность работы с полутонами, т.е. возможность передавать изображение точно также, как оно выглядит в жизни. А вот среди недостатков основной проблемой является размер файла. Естественно, чем больше пикселей отведено для формирования изображения , тем выше качество передаваемого изображения , но, тем самым больше будет и размер файла.
Если мы теперь вернемся к браузерам, то можно сказать следующее, что большинство браузеров без проблем могут отображать графические файлы четырех форматов (*.gif, *.jpg, *.png, *.bmp ), использовать из которых на сегодняшний момент лучше всего два - *.gif и *.jpg . Да и то после предварительной оптимизации.
Вставка изображений на Web-страницу .
Вставлять изображение на вашу Web-страницу можно несколькими способами:
1. Перетащить изображение из Windows Explorer (то есть прямо из проводника).
2. Перетащить изображение из Internet Explorer .
3. Перетащить файл с изображением с панели Список папок , прямо на страницу.
4. С помощью буфера обмена - скопировать изображение в буфер обмена из любой другой программы, а затем на странице вставить его из буфера обмена.
5. С помощью кнопки Добавить рисунок из файла на панели инструментов Стандартная .
6. С помощью меню Вставка  Рисунок.
Рассмотрим эти способы более подробно:
Способ 1
Windows Explorer (то есть прямо из проводника) надо:
во FrontPage
открыть окно проводника;
в окне проводника выделить файл с картинкой, которую вы хотите вставить на свою страницу;
левой клавишей мыши перетащить файл-картинку на свою Web-страницу картинка вставиться в то место, где на странице находился курсор вставки.
Способ 2
Для того чтобы перетащить изображение из Internet Explorer надо:
во FrontPage открыть страницу, на которую вы хотите добавить изображение;
в браузере откройте то изображение, которое вы хотите поместить на своей Web-странице браузера название файла должно оканчиваться на jpg, jpeg, gif );
левой клавишей мыши перетащите выделенную картинку на свою Web-страницу ;
Способ 3
Для того чтобы перетащить файл с изображением с панели Список папок, прямо на страницу надо:
во FrontPage открыть страницу, на которую вы хотите добавить изображение ;
выбрать необходимый файл с картинкой на панели Список папок ;
левой клавишей мыши перетащите выделенную картинку на свою Web-страничку ;
выбранная картинка вставиться в то место, где на странице находился курсор вставки.
Способ 4
Для того чтобы вставить изображение на свою Web-страницу с помощью буфера обмена, надо:
в том приложении, из которого вы хотите скопировать картинку, выделить изображение и при помощи клавиш Ctrl + C скопировать рисунок в буфер обмена;
на своей Web-странице вставить это изображение из буфера обмена при помощи клавиш Ctrl + V
Способ 5
Web-страницу вы решили воспользоваться кнопкой Добавить изображение из файла на панели инструментов Стандартная , то FrontPage откроет диалоговое окно Рисунок .
В данном диалоговом окне укажите тот файл с картинкой, который вы хотели бы добавить на свою Web-страницу и нажмите кнопку Вставить.

Способ 6
Если для вставки изображения на свою Web-страницу вы решили воспользоваться меню Вставка  Рисунок , то FrontPage предложит сделать вам дальнейший выбор:

Картинки … – выбор того пункта меню предоставляет вам возможность воспользоваться готовой библиотекой картинок.
Из файла … – выбор данного пункта меню предоставляет вам возможность самостоятельно указать местонахождение файла с картинкой, который вы хотите добавить на свою Web-страницу (использование этого пункта приведет к открытию диалогового окна Рисунок , работа с которым была описана выше).
Создать фото коллекцию … - при помощи этого пункта меню можно создать коллекцию изображений в определенном стиле. Для это в открывшемся окне Свойства коллекции фотографий при помощи кнопки Добавить на вкладке Рисунки выбрать изображения, а на вкладке Макет выбрать формат оформления.
Добавление файлов мультимедиа.

Помимо простой графики, как – изображения в форматах *.gif, *.jpg, *.png и т.д. FrontPage позволяет размещать на ваших Web-страницах файлы мультимедиа. К ним относятся: видеоклипы, звуки…

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

Откроется диалоговое окно Видео , в нем будут отображаться видеоклипы в формате *.avi, *.asf, *.ram, *.ra .

Добавить звук на Web-страницу можно на вкладке Общие диалогового окна Свойства страницы .

Работа с таблицами.

Таблица - одно из наиболее мощных инструментов используемых при создании сайтов.
Изначально таблицы применялись только для представления структурированных данных. Однако постепенно они превратились в мощное универсальное средство для компоновки Web-страниц.

Создание таблиц

Самый простой способ создания таблицы – использовать кнопку Добавить таблицу , расположенную на панели инструментов Стандартная.
Еще один способ – при помощи пункта меню Таблица  Вставить  Таблица .
А так же таблицу можно нарисовать и вставить при помощи буфера обмена.

Ввод данных и навигация по таблице.

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

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

Однако более удобно для перемещения между ячейками использовать комбинации клавиш:
Сочетания клавиш: Действие:

Tab в любом месте таблицы,кроме конца последней строки перейти в соседнюю ячейку и выделить ее содержимое
Tab в конце последней строки добавить новую строку в низ таблицы
Shift +Tab перейти в предыдущую ячейку и выделить ее содержимое
Enter начать новый абзац
Enter в начале первой ячейки добавить текст перед таблицей в начале документа

Создание и применение форм.

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

Давай познакомимся с тобой - пожалуйста, заполни следующие поля:
Твое имя:

Твоя фамилия:

Дата твоего рождения: год месяц число

Спасибо! А теперь - в путь!
1. Мала, а проворна.
Где бывает, там повелевает.
В шатер зайдет -
Богатыря перевернет.
Кто это?
Муха Блоха Капризный ребенок
2. Выпуча глаза сидит,
По-французски говорит,
По-блошьи прыгает,
По-человечьи плавает.
О ком идет речь?
Кот Лягушка Попугай

3. Чем дышит тюлень, нырнув под лед?

4. Почему плачут большие черепахи?

5. Какую одежду может и селедка носить?
Шубу Пальто Тельняшку
6. Кого называют «речной лошадью»?
Выдру Бегемота Крокодила

7. Какие птицы не высиживают птенцов?

8. Какие птицы не умеют летать?

Если вам необходимо выберать несколько ответов - нажмите и не отпускайте клавишу Ctrl и щелкайте левой клавишей мыши по нужному ответу

Но создание форм на самой страничке это только половина работы. Так как обязательно должна существовать программа, которая сможет обработать данные, введенные пользователем с помощью форм.
Такая программа может быть расположена на сервере; она может находиться в вашем Web-сайте в виде отдельного файла, а может быть просто прописана в коде html на вашей Web-страничке .
Именно она определяет - что же произойдет с той информацией, которую ввел пользователь:

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

В отношении форм существует несколько основных правил:

1. Каждая форма занимает определенный участок Web-страницы . На одной Web-страничке может быть расположена одна или несколько форм.
2. Внутри каждой формы должен размещаться, по крайней мере, один из элементов форм (хотя, как правило, их несколько).
3.Каждый элемент формы имеет имя и значение. Имя идентифицирует поле для ввода информации, а значение приравнивается к значению, выбранному пользователем.
4. Один из элементов формы (им может быть обычная кнопка или любой рисунок) должен выполнять функцию кнопки Отправить.

Создание форм во FrontPage .
Чтобы добавить форму на Web-страницу , надо:

Установить курсор в то место, где вы хотите вставить форму.
В меню Вставка выбрать пункт Форма , в открывшемся меню снова выбрать пункт Форма . Форма будет помещена на вашу Web-страницу - появиться область, помеченная пунктирной рамочкой, с двумя кнопками: Отправить и Сброс .
Пользуясь все тем же пунктом меню Вставка  Форма последовательно вставить необходимые вам элементы форм , выбирая их из раскрывающегося каскадного меню (при этом необходимо помнить, что все элементы формы вставляются внутри области формы, помеченной пунктирной рамочкой).
После того, как форма создана, остается только наполнить ее содержанием - элементами форм , текстом, изображениями, таблицами… (при этом размеры формы будут меняться автоматически).
Добавлять содержание форм можно обычным образом. Например, текст можно набирать, а можно вставлять из буфера обмена… Все действия с добавленными объектами аналогичны.
Однако создание формы - это только начало работы. После ее создания необходимо настроить свойства, как самой формы , так и ее элементов.

Настройка свойств формы.

Для обработки или сохранения данных, вводимых посетителями Web-странички , необходимо либо воспользоваться возможностями, предоставляемыми FrontPage Server Extensions , либо какой-нибудь другой программой, работающей на Web-сервере .
Но какую бы программу вы не выбрали, вам все равно придется настроить свойства формы и элементов в ней.
Чтобы открыть окно свойств формы, надо:
в меню Вставка выбрать пункт Форма , а затем -
или
вызвать контекстное меню к форме и в открывшемся контекстном меню выбрать пункт Свойства формы .
В результате откроется диалоговое окно Свойства формы .

1. В поле Сохранение результатов необходимо указать, что надо будет сделать с данными, введенными в форму . Вы можете выбрать следующие варианты:
o Отправка Имя файла - данные будут помещены в указанный файл на Web-сервере . Этот файл может быть Web-страницей , которая со временем будет становиться все длиннее и длиннее, или файлом данных, который потом можно будет обработать в Excel, Access или любой другой программой;
o Отправка Адрес почты - в этом случае каждый раз при нажатии посетителем Web-странички кнопки Отправить на форме будет генерироваться электронное сообщение, которое будет отправляться по указанному вами адресу. В этом сообщении будут содержаться все данные, которые были введены пользователем на Web-страничке.
o В базе данных - в этом случае данные формы будут отправлены в базу данных. База должна находиться на Web-сервере (или быть доступной для него).
2. В поле Свойства формы необходимо указать имя формы
Режимы просмотра во FrontPage .
FrontPage предлагает шесть различных режимов для просмотра содержимого Web-сайта:

Страница,
Папки,
Отчеты,
Переходы,
Гиперссылки,
Задачи.
Для выбора нужного режима можно воспользоваться панелью Представления , расположенной в левой части экрана, или в меню Вид на панели инструментов Стандартная выбрать соответствующий пункт меню.

Страница
В этом режиме осуществляется создание и редактирование Web-страниц. Здесь можно создавать пустые Web-страницы и страницы, базирующиеся на шаблонах, назначать страницам темы (набор стилей представления страницы на экране). В этом режимы можно добавлять и форматировать текст, оформлять страницы с использованием графических и видеоизображений (поддерживается преобразование ряда графических форматов в форматы *.gif, *.jpg и *.png ), добавлять к странице звуковое сопровождение, представлять информацию в таблицах, кадрах и формах и, наконец, создавать гиперссылки. Таков далеко не полный перечень возможностей FrontPage по редактированию содержимого Web-страниц .
Папки
В этом режиме можно просматривать структуру Web-узла (файлы и папки) и управлять ею аналогично тому, как вы это делаете в Windows , данный режим дает возможность получить более подробные сведения о файлах и папках, чем это предусмотрено в режиме просмотра Страница.
Отчеты
Предоставляет вашему вниманию более десятка отчетов, содержащих разнообразную информацию о Web-узле , открытом во FrontPage.
Переходы
Предназначен для просмотра иерархии сайта. В этом режиме можно управлять иерархией, перетаскивая прямоугольники (каждый из которых представляет определенную Web-страницу ).
Гиперссылки
Демонстрирует систему гиперссылок, которыми связаны между собой страницы Web-узла (а также систему гиперссылок на другие узлы), обеспечивает проверку их целостности и возможность изменения.
Задачи
Этот режим предназначен для управления задачами Web-узла (добавления, удаления, выполнения, установления приоритета выполнения, а также отслеживания состояния задач).

Скачать БЕСПЛАТНО FrontPage можно по следующей ссылке:

http://letitbit.net/download/28576.28615a37d4f2a575882748541adf3bf00/Microsoft_Office_FrontPage_2003.rar.html

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

При создании Web-страниц вы можете использовать графические изображения из библиотеки Clip Art, входящей в состав Microsoft Office, файлы, разработанные с использованием графических редакторов (например, CorelDraw, Adobe Photoshop), а также применять изображения, полученные со сканера. FrontPage позволяет импортировать файлы следующих форматов:

  • JPEG (JPG)
  • BMP (Windows или OS/2)
  • TIFF(TIF)
  • WMF (Метафайлы Windows)
  • SUN Raster (RAS)
  • EPS (Инкапсулированный Postscript)
  • PCX (Paintbrush)
  • TGA(Targa)
  • PCD (Kodak PhotoCD)

По умолчанию импортируемые форматы, за исключением форматов GIF и JPEG, преобразовываются FrontPage в формат GIF.

Если вы решили в качестве фона Web-страницы использовать графическое изображение и оно уже подготовлено, то для облегчения размещения поместите его в папку images вашего Web-узла, так как программа FrontPage именно там и начнет его искать. После этого можете приступать к созданию фона страницы, выполнив следующие действия:

1. Откройте созданный сайт.

2. Откройте домашнюю страницу, дважды щелкнув мышью на панели Список папок (Folder List) на файле index.htm.

3. В меню Файл (File) выберите команду Свойства (Properties) или выберите команду контекстного меню страницы Свойства страницы .

Свойства страницы (Page Properties) перейдите на вкладку Фон (Background).

5. Установите расположенный в верхней части диалогового окна флажок Фоновый рисунок (Background picture).

6. Установите также флажок Подложка (Watermark). Если он установлен, то при перемещении по Web-странице с помощью полосы прокрутки не происходит смещения рисунка фона относительно объектов, расположенных на странице.

7. Для указания имени и расположения графического файла, содержимое которого будет использовано в качестве фона, нажмите кнопку Обзор (Browse). На экране открывается диалоговое окно Выбрать фоновый рисунок (Select Background Picture) (рис. 15.5), в списке Папка (Look in) которого указано имя открытого Web-узла.

Рис. 15.5. Диалоговое окно для выбора графического изображения фона страницы.

8. Если вы поместили графический файл в папку images, откройте ее, выберите подготовленный для фона страницы файл и нажмите кнопку ОК .

9. В случае если вы заранее не позаботились о размещении файла в папках Web-узла, для его поиска воспользуйтесь кнопками, расположенными слева в диалоговом окне Выбрать фоновый рисунок. Кнопки Журнал (History), Мои документы (My Document), Рабочий стол (Desktop), Избранное (Favorites), Мое сетевое окружение (My Network Places) позволяют искать файл в папках Recent , Мои документы , Рабочий стол , Избранное и Мое сетевое окружение , соответственно. Кнопка Найти в Интернете (Search the Web) запускает обозреватель для поиска в Интернете файла, который может быть использован в качестве фона Web-страницы.

Выбрав необходимый файл, нажмите кнопку ОК Выбрать фоновый рисунок .

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

На рис. 15.6 показана Web-страница, для которой в качестве фонового изображения использован файл из библиотеки Windows.

Рис. 15.6. В качестве фона использовано графическое изображение

Вы можете использовать единое графическое изображение на нескольких страницах Web-узла в качестве фона, устанавливая в диалоговом окне Свойства страницы флажок Получить сведения о фоне с другой страницы (Get background information from another page). В этом случае, если вы решите изменить фон, нет необходимости менять его на всех страницах, использующих одинаковое изображение, - достаточно сделать это на одной единственной странице. Рассмотрим последовательность действий при использовании этого флажка:

1. Откройте сайт.

2. Откройте домашнюю страницу, дважды щелкнув на панели Список папок (Folder List) на имени файла index.htm.

3. В меню Формат (Format) выберите команду Фон (Background).

4. В открывшемся диалоговом окне Свойства страницы на вкладке Фон (Background) установите флажки Фоновый рисунок (Background picture) и Подложка (Watermark).

5. Нажмите кнопку Обзор , расположенную рядом с полем, в котором будет размещено имя графического файла.

6. В открывшемся диалоговом окне Выбрать фоновый рисунок (Select Background Picture) выберите графический файл, который хотите использовать в качестве фона страницы, и нажмите кнопку ОК .

7. Нажмите кнопку ОК для закрытия диалогового окна Свойства страницы .

8. Сохраните Web-страницу с размещенным фоновым изображением и исходный графический файл в папке images .

9. Откройте в режиме редактирования вторую страницу Web-узла.

10. Откройте для этой страницы диалоговое окно Свойства страницы .

11. На вкладке Фон (Background) установите флажок Получить сведения о фоне с другой страницы (Get background information from another page).

12. Нажмите расположенную рядом с флажком кнопку Обзор .

13. В открывшемся диалоговом окне Текущий веб-узел (Current Web) (рис. 15.7) выберите из папки images сохраненную Web-страницу с фоновым графическим изображением и нажмите кнопку ОК .

14. Нажмите кнопку ОК для закрытия диалогового окна Свойства страницы .

Рис. 15.7. Диалоговое окно "Текущий веб-узел"

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

1. Поместите новое графическое изображение в папку images Web-узла.

2. Откройте окно свойств страницы, размещенной в папке images , для которой вы установили графическое фоновое изображение.

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

4. Закройте окно свойств страницы.



 

Возможно, будет полезно почитать: