- Преподавателю
- Информатика
- Методические рекомендации по созданию сайта с помощью визуального редактора сайтов Web Page Maker
Методические рекомендации по созданию сайта с помощью визуального редактора сайтов Web Page Maker
Раздел | Информатика |
Класс | - |
Тип | Другие методич. материалы |
Автор | Гафурова И.Г. |
Дата | 05.02.2014 |
Формат | doc |
Изображения | Есть |
Методические рекомендации по созданию сайта с помощью визуального
редактора сайтов Web Page Maker
Цель: Научиться работать в визуальном редакторе создания сайтов, научиться создавать тематические HTML сайты из нескольких страниц.
Web Page Maker - это простой визуальный инструмент для создания веб - страниц. С его помощью вы сможете создать свой сайт не обладая никакими знаниями HTML. Просто перетаскивайте мышкой на рабочее пространство программы изображения, текст, музыку и видео. Во время работы с лёгкостью можно передвигать объекты по всей странице.
Для создания сайта необходимо : придумать тему и цель будущего сайта, продумать структуру сайта, определить количество страниц, продумать разметку страницы и общие для каждой страницы элементы (заголовок, панель навигации, фреймы), сделать макет страницы, подобрать материал для наполнения страниц
(Заранее создайте папку с необходимыми для сайта рисунками, музыкой, видео, текстом и т. д )
Рассмотрим пример:
Тема, цель - Мой личный сайт для размещения
информации о себе и общения с
ровесниками .
Структура сайта - это организация его страниц
Количество страниц - 9
Макет страницы
1. Создание новой страницы
Новую страницу можно создать либо из готового шаблона, либо с нуля. Шаблоны, естественно, хороши, но их использование сразу лишает вас права притязания на уникальность дизайна своего проекта.
ВАРИАНТЫ :
А) Выберем Файл-Новый сайт из шаблона
В результате у вас появятся несколько шаблонных страниц, которые можно изменять по своему вкусу, наполнять своей информацией.
Б) Выберем Файл - Новый сайт, в результате получим пустую страницу, дизайн придумываем сами, оформляем по своему вкусу и здесь очень пригодится умение работать
в графическом редакторе, например Photoshop.
Рассмотрим создание страницы из шаблона , пункт А)
ВНИМАНИЕ ! Первая страница всегда называется index
2. Действия со страницами Страницы можно: Добавлять
Клонировать
Удалять
Импортировать html страницу
Передвигать
Добавьте (клонируйте) нужное количество страниц, переименуйте их по-своему.
3. Изменение объекта на странице
Для изменения любого объекта (текст, рис и т.д) на странице, достаточно щелкнуть по нему два раза Левой кнопкой мыши :
1) При изменении текста, появляется текстовый редактор (Меняем текст и нажимаем ОК)
2) При изменении рисунка, появляется окно выбора рисунка.(Выбираем рисунок из своей папки)
4. Добавление новых объектов
Для добавления новых объектов на страницу служит меню Вставка
5. Свойства страницы
В меню ФОРМАТ можно задать СВОЙСТВА СТРАНИЦЫ ( заголовок, цвет фона, ключевые слова и т.д.)
-
Заголовок
Определяет название документа, оно появляется в строке заголовка браузера (в самом верху). -
Автор
Определяет имя автора документа, либо другую информацию, связанную с авторскими правами. -
Ключевые слова
Можно вводить слова, разделяя их запятой. Эти слова используются поисковыми машинами (напр. Google, Yandex и т.п.), которые относят документ к той или иной категории. -
Описание
Здесь могут быть заданы краткое описание содержания документа для поисковых машин интернета. -
Фон выберите фоновый рисунок для вашей страницы. Также можно задать фоновую музыку, которая будет звучать при просмотре гостем вашей веб-странички.
Задайте свойства страницы
6. Создание второй страницы
Есть несколько путей создания второй странички:
А)
1. Нажмите кнопку Добавить новую страницу в панели
Содержание сайта с правой стороны экрана. (Чтобы скрыть
или отобразить панель, нажмите F8.)
2. Появится новый пустой файл. По умолчанию
Web Page Maker назовёт его "page2".
Б)
-
Нажмите кнопку Клонировать страницу в панели
Содержание сайта с правой стороны экрана.
2.Появится копия этого файла. По умолчанию Web Page Maker назовёт его "page2".
Удалите содержимое, которое не должно находиться на этой странице и добавьте новое.
7. Переименование веб-страницы:
1. Выберите страницу, которую вы хотите переименовать
в панели Содержание сайта .
2. Кликните правой на имени файла и нажмите
Переименовать страницу.
3. Введите новое имя страницы.
8. Ссылка на другую страницу вашего сайта
Теперь на вашем сайте уже есть не менее двух страниц, и вам следует создать между ними гиперссылки
Для создания ссылки на другую страницу вашего сайта:
1. Выделите текст или изображение на "первой" странице.
-
Для выделения изображения - кликните по нему один раз.
-
Для выделения текста, кликните дважды по текстовому полю,
и с помощью курсора выберите необходимый вам диапазон текста в Текстовом редакторе.
2.Нажмите кнопку "Задать гиперссылку" на панели инструментов. Появится диалог "Гиперссылка ".
3. Выберите "Страница на моём сайте "
из выпадающего меню Тип.
4.Для создания гиперссылки на другой
сайт выберите Тип - Другой сайт и
запишите URL адрес другого сайта.
Примечание1: В рабочем окне программы ссылки не функционируют, они работают только в браузере.
Примечание2: Имена файлов(страниц) должны содержать только латинские буквы, цифры и знаки подчёркивания - никаких пробелов . Не используйте заглавные буквы
С помощью Web Page Maker'а вы можете создать веб-сайт, содержащжно любое угодное вам количество веб-страниц. Каждый сайт начинается с первой страницы.
9. Просмотр страниц в браузере
"Просмотр в браузере" покажет вам, как будет выглядеть веб -страница после опубликования её в интернете
Для просмотра веб-страниц в браузере:
1. Нажмите кнопку Просмотр (F5) в панели инструментов.
-
По окончанию просмотра просто закройте страницу в браузере.
Примечание3: при просмотре ваших страниц в виде HTML вы можете проверить работоспособность всех локальных ссылок на своём сайте, просто пройдитесь по ссылкам и удостоверьтесь в том, что все они работают
10. Сохранение документа
Чтобы сохранить ваш сайт :
1. Выберите"Сохранить как" из меню Файл .
2. Появится диалоговое окно "Сохранить как ". Введите имя вашего сайта в соответствующее окно (без расширения).
3. Нажмите кнопку Сохранить . Расширение (.wss) будет добавлено автоматически.
Примечание4: эта команда сохраняет текущий сайт в файл .wss. Это значит, что все странички вашего сайта сохранены в один единый файл.
11. Публикация сайта
Чтобы получить формат Html, выберите меню Файл-Опубликовать. Программа автоматически преобразует ваши страницы в формат .html. и поместит их в выбранную вами папку или на вашем компьютере или на веб - сервере.