Методические рекомендации по созданию сайта с помощью визуального редактора сайтов Web Page Maker
Методические рекомендации по созданию сайта с помощью визуального
редактора сайтов 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. и поместит их в выбранную вами папку или на вашем компьютере или на веб - сервере.
Данный шаблон имеет 4 страницы