Создание Web-страниц в прикладной программе FrontPage - Создание сайта
Создание новой пустой Web-страницы
Если при открытии окна программы FrontPage в нем отображается пустая страница, то разработку веб - страницы можно осуществлять на базе этой страницы. Если при открытии редактора FrontPage, отображается пустое главное окно, то для создания новой пустой страницы необходимо выполнить команду Файл/Создать и выбрать в области задач Пустая Страница. В окне приложения появится пустая страница. Далее необходимо осуществить разработку страницы, т. е. выполнить разметку (структуру) страницы, ввести текст, рисунки и т. д.
Создание веб-страницы на основе шаблонов FrontPage
Создать новую страницу можно также на базе одного из шаблонов. Для этого необходимо выбрать команду "Другие Шаблоны Страниц" в области задач. На экране будет отображаться окно диалога Шаблоны страниц, в котором представлены различные шаблоны страниц по категориям.
Создание веб-страницы на основе имеющихся Web-страниц в ПК
Создать веб-страницу можно и на базе имеющихся, на компьютере веб-страниц. Для этого необходимо в области задач выбрать команду "Из Имеющейся Страницы" и в появившемся окне диалога выбрать требуемую страницу. Далее можно произвести необходимые изменения на странице и сохранить ее под другим именем.
Обучение созданию Web - страниц
Создание новой пустой Web - страницы
Если при открытии окна приложения FrontPage в нем отображается новая пустая страница, то разработку веб - страницы можно осуществлять на базе этой страницы. Если при открытии редактора, отображается пустое главное окно, то для создания новой пустой страницы необходимо выполнить команду Файл/Создать и выбрать в области задач "Пустая Страница".
Попытаемся создать Главную страницу нашегоWeb - сайта!
В окне приложения появится новая пустая страница. Сохраняем страницу, но перед тем, как сохранить страницу в окне "Сохранить" создаем папку serverЛичные папкиФамилия ИмяСайт "Динас", в которой создаем вложенную папку Рисунки для рисунков, а затем сохраняем страницу в папке Сайт "Динас". Имя страницы назначаем - index, что означает домашняя или главная страница. Редактор сохраняет страницу с расширением. htm. Таким образом, в папке Сайт "Динас", будет находиться вложенная папка Рисунки и файл index. htm.
Рисунки для веб - страницы должны быть заранее подготовлены и вставлены в папку Рисунки. Скопируем в папку Рисунки рисунок Офис ООО Динас для создания веб - страницы, посвященной ООО "Динас".
Чтобы созданный вами документ везде корректно определялся как написанный на русском языке, проделайте следующее:
Выберите команду Файл Свойства. Откроется диалог Свойства страницы.
На вкладке Язык в выпадающем меню Пометить Текущий Документ, Указав: группы настроек Язык страницы выберите пункт Русский. В выпадающем меню Сохранить Документ, Используя группы настроек Набор Знаков выберите пункт Кириллица. Ок!
Фон страницы
Чтобы станица выглядела более красочно попробуем добавить к нашей странице Фон,. Сделать это можно двумя способами:
1. Зайти в меню Формат Фон и в окне Свойства страницы выбрать через кнопку Обзор необходимый рисунок.
В итоге наша страница примет следующий вид:
Попробуйте выполнить это, но по окончании Отмените это действие!
2. В качестве Фона нашей страницы можно использовать уже готовые Темы. Зайдите в меню Формат Тема. Выберите двойным щелчком Тему Волны.
Таблица в качестве каркаса Web - страницы
Далее необходимо осуществить разработку страницы. Разработка страницы начинается с ее разметки. Для разметки страницы используются таблицы. Можно применить Макеты Страницы, которые расположены на панели задач "Макеты Таблицы И Ячейки" в области задач. Для этого необходимо зайти в меню Таблицы Макетные Таблицы И Ячейки. Таким образом, у нас появилась прекрасная возможность выбрать готовые макеты таблиц, но ведь может так получиться, что данные макеты не удовлетворяют нашим требования. Поэтому мы подробно рассмотрим использование Таблиц в качестве каркаса нашей страницы.
Выберите команду Таблица Вставить таблица. Появится диалог Вставка Таблицы, позволяющий настроить параметры создаваемой таблицы. (рис.10)
Џ В полях ввода со счетчиком Строк и Столбцов группы элементов настройки Размер задается количество строк и столбцов, которые будет содержать таблица.
Џ В группе элементов управления Положение находятся элементы управления расположением таблицы на странице и положение содержимого ячеек внутри таблицы.
Џ В открывающемся списке Выравнивание можно выбирать способ выравнивания содержимого ячеек. Впоследствии для каждой конкретной ячейки можно отдельно настроить параметры выравнивания ее содержимого.
Џ Список Обтекание задает способ обтекания таблицы текстом и другими элементами страницы.
Џ Поле ввода со счетчиком Поля Ячеек определяет расстояние между границами ячеек и их содержимым.
Џ В поле ввода со счетчиком Интервал Ячеек задает расстояние между соседними ячейками таблицы.
Џ Установив флажок Задать Ширину, Вы сможете это сделать в поле, находящемся чуть ниже.
Џ Поле Задать Высоту аналогично предыдущему.
В группе элементов управления Границы располагаются настройки, связанные с отображением границ таблицы.
Џ Поле ввода со счетчиком Размер задает толщину границы таблицы в точках.
Џ Выпадающий список Цвет позволяет выбирать цвет, которым будет отображена граница.
Џ Если установить флажок Свернуть Границу Таблицы, то граница будет отображаться в виде одиночной линии, иначе она будет принимать псевдо-объемный вид.
В группе Фон собраны элементы, управляющие фоновым изображением таблицы.
Џ Список Цвет позволяет выбрать цвет фона таблицы.
Џ Если установлен флажок Использовать Фоновый Рисунок, то вы сможете задать таблице в качестве фона изображение.
Если установить флажок По Умолчанию для новых таблиц группы элементов По Умолчанию, то все параметры, которые вы установили для этой таблицы, станут настройками по умолчанию для всех следующих таблиц.
Впоследствии, если у вас возникнет необходимость изменит параметры уже созданной таблицы, щелкните внутри ее - появится контекстное меню, в котором необходимо выбрать пункт Свойства Таблицы.
Имеется возможность изменять параметры как отдельно взятой ячейки, так нескольких ячеек сразу. Для этого необходимо выделит одну или несколько ячеек, вызвать контекстное меню и выбрать в нем пункт Свойства Ячейки.
В группе элементов управления Положение находятся элементы управления расположения содержимого ячейки.
- - В открывающихся списках Выровнять По Горизонтали И По Вертикали, вы сможете выбрать способ выравнивания содержимого ячейки. - В группе элементов управления Границы, располагаются настройки, связанные с отображением границ таблицы. Список Цвет позволяет выбрать цвет границы ячейки. - В группе Фон собраны элементы, управляющие фоновым изображением ячейки. Список Цвет выбирает цвет ее фона. Флажок Использовать Фоновый Рисунок задает в качестве фона изображение.
Имеется также дополнительные возможности: Добавить И Удалить Столбцы, Разбить И Объединить Ячейки. Все эти команды можно найти тоже в контекстном меню при выделении ячеек. Аналогичные команды вы уже встречали в программах Word и Eхcel, поэтому описывать их нет смысла.
Используя полученный выше теоретический материал, попытайтесь создать две таблицы.
Должно получиться нечто подобное!
Настало время написать на нашем сайте название фирмы, которой он принадлежит. Но делать мы это будем не в виде обычного текста, а при помощи объекта WordArt (Мы надеемся, что вы знаете, как это сделать!) Таким же образом вставьте слово Акция в третью ячейку нижней таблицы и Вакансия в первую ячейку.. А теперь отделите название фирмы Горизонтальной Линией: Вставка Горизонтальная линия.
Текстовое оформление сайта
Существует множество вариантов оформления текстов на Web - страницах. Использование потенциала текстового форматирования позволяет делать тексты более приятными визуально, оформлять их в согласии с вашими авторскими задумками, дает возможность явно подчеркивать важные слова и мысли.
Поскольку вы решили заняться изучением такого непростого продукта, как создание Web - сайтов, то мы просто уверены в том, что вы знаете, как форматируется текст ну, например, в такой программе, как Microsoft Word. Так вот редактирование текстов в программе FrontPage аналогично этому, поэтому, естественно на этом останавливаться мы тоже не будем.
Скажем только, что для этого используется панель форматирования либо строка меню Формат Шрифт Абзац.
Самостоятельно введите весь текст, который вы видите на рисунке15.При его редактировании можете немного пофантазировать. НО Не Переусердствуйте!!!
Вставка иллюстраций
Невозможно представить себе HTML - страницу без элементов графики, рисунков и т. д. Умело подобранная графика привлечет внимание посетителей на страницу, акцентирует их внимание на тех или иных моментах нашей страницы. Поможет выделить логические подразделы и придаст нашей странице особую неповторимость, но при этом при подборе изображений следует учесть следующие моменты. Во-первых, не надо использовать в качестве фона изображение, которое затрудняет чтение текста документа. Например, слишком пестрые, яркие и т. д. Не надо использовать большие изображения, которые затянут до бесконечности время загрузки. Если все - - таки надо вставить изображение на страницу, то лучше создать его маленькую копию, и после этого назначить ссылку на страницу с исходным большим изображением, чтобы пользователь мог сам решить, если он очень хочет загрузить изображение в исходном виде. А так размер одного файла изображения не должен превышать 20-25 кб. На Web - страницах обычно помещают изображения двух форматов GIF и JPG. Такие изображения корректно отображаются во всех браузерах, поддерживающих показ графики. Конечно, можно вставить и файлы с другими форматами, например BMP, TIF, но при этом надо учесть, что при записи на диск FrontPage их автоматически превратит в один из двух базовых форматов.
Рассмотрим преимущества и недостатки этих форматов. GIF - это стандартный формат для небольших графических изображений, таких, как кнопки, пиктограммы. Он не поддерживает теней и полутонов и в его основе лежит палитра из 256 цветов. JPG по сравнению с GIF, поддерживает гораздо больше цветов - более 16 млн., что делает его наиболее выгодным для отображения графических изображений с плавными переходами полутонов. Кроме того, размер JPG файла можно уменьшать с различной степенью сжатия, но надо помнить, что в отличии от файлов GIF, сжатие файлов JPG производится с потерей их качества. Чем больше сжатие, тем больше потеря, но надо принять во внимание, что JPG это достаточно хороший формат: он дает высокую степень сжатия при довольно маленьких потерях, практически не видных на глаз.
Все, что касается график более подробно мы рассмотрим чуть дальше, пока скажем только, что вставить картинку можно опять же также, как и в других программах.
Давайте попробуем вставить в страницу фото Каталог из папки рисунки.
Подготовка графики с помощью Adobe PhotoShop и Adobe ImageReady
Внешний вид и привлекательность сайта в значительной мере зависят от наполняющей его графики. Графика - это визуальное средство подчеркивания и выделения информации, раскрываемой текстом Web-страницы, которое в то же время не должно отвлекать внимание посетителя от самого текста. Поэтому подготовке графики следует уделить самое серьезное внимание.
Среди программ профессиональной подготовки растровых изображений пожалуй нет программы более совершенной и более популярной, чем Adobe PhotoShop.
Adobe PhotoShop и Adobe ImageReady хорошо дополняют друг друга. В Adobe PhotoShop обрабатываются фотографии, создаются графические кнопки, баннеры и другие изображения для Web-сайта. А в ImageReady полученные изображения оптимизируются, разрезаются на фрагменты и т. д.
Похожие статьи
-
Окно прикладной программы FrontPage - Создание сайта
После запуска программы FrontPage (Пуск - программы - Microsoft Office - FrontPage ) на экране появится окно программы, в котором отображается новая...
-
Знакомство с программой FrontPage - Создание сайта
Прикладная программа FrontPage 2003 - это визуальный html-редактор для быстрого создания сайта. Язык HTML является основным языком программирования Web -...
-
Структура сайта в виде блок-схемы (Рисунок 1) Рисунок 1 - Структура сайта в виде блок-схемы Mockup главной страницы Макет сайта (Рисунок 2) был выполнен...
-
Center Выравнивание текста по центру. Текст помещается по центру горизонтали окна браузера или контейнера, где расположен текстовый блок. Left...
-
Adobe Dreamweaver Adobe Dreamweaver - это HTML-редактор от компании Adobe, который на сегодняшний день очень известный. Первая его версия была выпущена в...
-
Система Windows NT не является дальнейшим развитием ранее существовавших продуктов. Ее архитектура создавалась с нуля с учетом предъявляемых к...
-
Сервисы сайта - Создание сайта
Сервисы сайта направлены на облегчение использования сервисов компании. Так, например, онлайн-консультация позволяет пользователю быстро получить ответ...
-
Создание заголовков - Создание сайта
Заголовки - отличный инструмент структурной организации содержимого Веб-страницы. Стандарт HTML предусматривает возможность использования заголовков...
-
Во введении актуализируется необходимость создания вашего электронного средства обучения (педагогический подход, используемая методика). Автор дает...
-
Знакомство с Microsoft FrontPage - редактором web-сайтов. Работа в редакторе должна начинаться с создания нового или открытия уже существующего сайта....
-
Программы (ресурсы) для создания презентаций - Структура презентации
1.Microsoft PowerPoint Говоря "программа для презентаций" большинство подразумевают PowerPoint, аналогично и с другими программами пакета Microsoft...
-
Задание 3. Создание Web-страниц в PowerPoint - PowerPoint и презентация
Программа PowerPoint, входящая в состав Microsoft Office, позволяет на профессиональном уровне подготовить слайды для проведения презентаций. Благодаря...
-
Структура web-документа - Создание сайта
Каждый HTML-документ, отвечающий спецификации HTML какой-либо версии, должен начинаться со строки объявления версии HTML <!DOCTYPE...>, которая обычно...
-
Проектирование и разработка сайта Средства разработки Язык гипертекстовой разметки HTML В Интернете сосредотачивается и передается достаточно большое...
-
Что такое Flash? Flash (от англ. Flash - "вспышка", произносится "флэш") Flash - это технология веб-мультипликации и создания интерактивного контента от...
-
Широкое распространение в операционной системе Windows имеет множество стандартных программ обеспечивающих работу устройств компьютера и служащих для...
-
Компонент TPanel является несущей конструкцией для размещения на ней других элементов управления, являясь в этом случае родителем для размещенных на ней...
-
Для того, чтобы создать страницу сайта достаточно в текстовом редакторе, в блокноте сделать следующую надпись: Первая страница сайта создана. После...
-
Технология создания баз данных в программе Microsoft Access
Введение Базы данных играют особую роль в современном мире. Любой из нас многократно начиная с детства, сталкивался с "базами данных". Это - всевозможные...
-
Системная архитектура проекта Архитектура данных При организации любой управленческой работы, в том числе и работы по управлению заказами клиентов, очень...
-
Общие сведения о тестировании Данный раздел посвящен проведению тестирования клиентского приложения. Тестирование для серверной части системы не...
-
Алгоритм для определения силы комбинации - Программа построения равновесных стратегий для игры
В играх типа Omaha для определения силы комбинации необходимо учитывать 9 карт: 4 стартовых карты игрока и 5 общих карт. По стандартным правилам покера...
-
Практическое решение примеров в программе Macromedia Flash (скриншоты примеров) Пример анимационная баннер сайта. Пример баннер сайта состоит 227 кадров...
-
Для создания трехмерной реконструкции сцены или объекта необходимо создать его трехмерную модель и вычислить цвет ее вершин. Для геометрической...
-
Инвестиционная привлекательность рынка - Создание сайта
К настоящему времени наблюдается устойчивый тренд роста числа белорусских потребителей, использующих Интернет для получения всевозможной информации. По...
-
Организация связи в Internet - Создание сайта
При организации связи между вычислительными машинами, используется специальный набор правил, которые называются протоколом связи. Схема связи: клиент -...
-
Оформление сайта, Язык HTML - Создание сайта
Оформление или дизайн - это внешний вид сайта. Эта та оболочка, которую вам придется надевать на ваш сайт, как этикетку на коробку с товаром. От этой...
-
Шаблоны сайта Bootstrap3 Веб-дизайн является одним из основных элементов в процессе создания сайта. Именно от него зависит, насколько удобно и комфортно...
-
Автоматизированное извлечение текстов для корпуса политических статей сайта Lenta. ru Для создания полезного обучающего корпуса требуется постоянное...
-
Физическая модель базы данных определяет способ размещения данных в среде хранения и способ доступа к этим данным, которые поддерживаются на физическом...
-
ОСНОВНЫЕ ПРОГРАММЫ АРХИВАТОРЫ И ИХ ФУНКЦИИ - Архивация информации и программы-архиваторы
Назначение программ-архиваторов заключается в экономии места на диске за счет сжатия (упаковки) одного или нескольких файлов в архивный файл....
-
Разработка сайта, Среда разработки web-сайта - Разработка сайта для компании
Среда разработки web-сайта При разработке web-сайта используются: - HTML - язык разметки web-страниц; - CSS - формальный язык описания внешнего...
-
Для создания нового сайта используем пункт меню "ФайлСоздатьСтраница или веб-узел". При этом появляется окно для выбора типа сайта (см. рис.). Кроме...
-
Для вызова ЛЕКСИКОНа следует набрать LEXICON или LEXICON имя редактируемого - файла Если в команде вызова ЛЕКСИКОНа указано имя файла, которого нет на...
-
Поиск и замена текста При работе с длинными документами иногда приходится вносить в них повторяющиеся изменения. ПрограммаWriterимеет специальные...
-
Настройка Adobe Photoshop - Adobe Photoshop CS6
Графический редактор Adobe Photoshop содержит огромное число опций и настроек, позволяющих сконфигурировать программу так, чтобы оперировать с ней было...
-
Анализ целевой аудитории. - Создание сайта
Пользовательская аудитория - преимущественно мужчины (80%), а так же женщины (20%) в возрасте от 18 до 50 лет. Можно разделить на четыре (4) основные...
-
Выводы и рекомендации к сайту - Создание сайта
Хотя полного аналога проекта компании "Музыкальная компания BOOM", найти на белорусском рынке не удалось, все же были выведены общие критерии, актуальные...
-
Функциональное назначение программы Основной функцией программы "AdressBook. exe" является ведение справочника. Имеется возможность добавлять и удалять...
-
Реальный проект состоит из многих (часто десятков) форм (окон), каждое из которых активируется в виде реакции на некоторое событие (нажатие кнопки...
Создание Web-страниц в прикладной программе FrontPage - Создание сайта