Гусева Надежда Борисовна,
преподаватель информатики и ИКТ в ГБОУ СПО ПСК СПБ ЦПС
Невского района г. Санкт-Петербурга
Методическая разработка практического занятия
«Работа в программах по созданию Web-страниц.
Создание сайта с помощью конструктора сайтов на Google»
в курсе: «Информационные технологии в профессиональной деятельности»
в разделе: «Глобальная сеть Интернет»
(На освоение данного материала планируется 2 часа практического занятия, и для более глубокой проработки 2 часа самостоятельной работы)
Цель работы:
- Научить студентов создавать, наполнять и корректировать личные сайты с помощью конструктора сайтов.
Порядок выполнения работы:
- Зарегистрируйте свой почтовый ящик на Google: https://mail.google.com
- Закройте почту. Наберите в адресной строке https://sites.google.com/site/
- На открывшейся странице нажмите кнопку Создать и перейдите к процессу создания главной страницы:
- Придумайте название сайта, например: «Портфолио студента ПСК Иванова». Если такое название уже существует, то измените его или припишите к нему любое слово на латинице, либо добавьте какие-нибудь значимые для Вас цифры. Поставьте общий доступ.
- Выберите любой шаблон, из представленных ниже. Его можно будет потом изменить, используя меню: Еще-дополнительные действия — Действие на сайте - управление сайтом. Слева (в самом низу появится меню), выберите тему, например: «Грифельная доска» - далее предварительный просмотр и сохранить. Можете поэкспериментировать и выбрать другую тему, для этого нужно войти в меню: Посмотреть другие темы и изменить выбранный шаблон, например на: Личные и семейные или на любой другой.
- Измените макет сайта. Выберите Макет сайта — Изменить макет сайта. В горизонтальной панели навигации установите ширину 180.
- В меню Навигация поставьте галочки: (V Автоматически генерировать дерево навигации; V Карта сайта)
- Шаблон сайта создан, теперь работаем со страницами:
- Нажмите на кнопку + (создать страницу). Введите название первой страницы «Анкета», затем аналогично создайте еще 3 страницы: «Моя достижения», «Фотогалерея» и «Полезные ссылки». Эти вкладки должны отобразиться в навигации страницы.
9. Начните заполнять первую страницу "Анкета"
- Кликните по кнопке: Изменить страницу (Редактор похож на Word).
- В строке заголовка полностью напишите свою ФИО (выберите соответствующий шрифт и цвет)
- Вставьте личное фото (200х300) - это будет ваша Ава.
- Все фотографии перед размещением на сайте должны быть обработаны в специальной программе по обработке изображений для улучшения качества и уменьшения размера, например в Диспетчере рисунков MicrosoftOffice:
Используя меню Рисунок, последовательно примените следующие опции:
- Яркость контрастность – Автоматический подбор яркости – подобрать яркость
- Изменить размер – Параметры изменения размера. Кнопка: Стандартные ширину и высоту (например, вкладка: веб-мелкий 448х336 точек). Нажмите ОК.
- Сжать рисунки - Параметры сжатия рисунков. Выберите для: веб-страниц (размер должен существенно уменьшиться и быть не более 50 кб). Нажмите ОК.
- Можно также поработать с эффектом красных глаз, обрезать фотографию или ее повернуть.
- Напишите слово Анкета и начните ее заполнять. Анкета должна содержать заголовок «Личные данные» и далее в столбик:
Место рождения:
Образование:
Специальность:
Группа:
Курс:
Общественная нагрузка:
- После редактирования сохраните страницу (вкладка Сохранить).
10. Откройте поочередно, созданные Вами страницы: Достижения, Фотогалерея и Полезные ссылки.
- На странице Достижения, вставьте отсканированные и обработанные в Диспетчере Рисунков, грамоты. А также подгрузите какой-нибудь файл, например: «Копия зачетки» (Внизу есть окошко для загрузки файлов).
- На странице Фотогалерея, вставьте Ваши фотографии, желательно по конкретным темам (для каждой темы создайте свою подстраницу). Фотографии можно также вставлять в таблицу, созданную на странице заранее.
- На странице Полезные ссылки, создайте как минимум три ссылки:
- создайте ссылку на главную страницу колледжа, напишите анкор (текст ссылки), например: (Пожарно-спасательный колледж) и вверху нажмите Ссылка, в появившемся окне напишите адрес скопированной ссылки и готово.
- Аналогично добавьте еще 2 любые ссылки на сайты своих друзей.
11. Перед сохранением воспользуйтесь кнопкой предпросмотра.
12. Сохраните свой сайт.
13. Предъявите работу преподавателю