Инструментальные средства создания сайта

Урок №43

Тема урока: Методы создания. Инструментальные средства создания Web-сайта.

Цели и задачи урока:

общеобразовательные:

• познакомить учащихся со способами создания сайтов;

• научить использовать типовые инструментально-технологические средства и эффективно работать в командах, что необходимо для личностного развития и профессионального самоопределения;

• закрепление навыков создания Web-страниц;

• закрепить навыки структуризации и систематизации информации и отработать навыки оптимизации информационной деятельности

воспитательные:

• восприятие компьютера как инструмента информационной деятельности человека;

• воспитывать уважение и умение сотрудничать с окружающими людьми;

• воспитание информационной культуры учащихся.

развивающие:

• формирование системного мышления, способности к анализу и обобщению;

• освоение способов эффективного взаимодействия в процессе учебной коммуникации.

Тип урока: комбинированный.

Методы обучения: объяснительно-иллюстративный (рассказ с элементами беседы в сопровождении презентации) и практический (самостоятельная работа учащихся).

Оснащение урока: проектор и доска, программа презентаций Microsoft Office PowerPoint, MS FrontPage, презентация к уроку, ЦОР, Интернет -браузер, раздаточный материал, опорный конспект к уроку.

План урока:

1. Организационный момент (1 мин)

2. Актуализация опорных знаний (14 мин)

3. Объяснение нового материала (30 мин)

4. Закрепление нового материала путём выполнения практического задания (40 мин)

5. Рефлексия. Итоги урока (4 мин)

6. Домашнее задание (1 мин.)

Ход урока:

1. Организационный момент (приветствие, проверка готовности к уроку)

2. Актуализация опорных знаний

   1. Выполнение электронного теста по теме «Microsoft Office»

   2. Прежде чем приступить к изучению новой темы, давайте вспомним некоторые понятия и сведения.

• Определите понятие «Интернет»? (Глобальная компьютерная сеть, в которой локальные, региональные и корпоративные сети соединены между собой многочисленными каналами передачи информации.)

• Какие вы знаете службы сети Интернет? (электронная почта, интернет-магазины, чаты, интернет-телефония, интернет-радио, интернет-телевидение, телеконференции, служба World Wide Web)

• Какая из услуг Интернет является самой популярной? (WWW – всемирная паутина)

• Как называют все документы службы WWW? (Web-документами, Web-страницами, HTML-документами)

Что такое Web-сайт? (Сайт – это группа взаимосвязанных Web-страниц, объединённых или единой тематикой, или единым авторством, или единым владельцем.)

1. Разгадывание кроссворда.

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

1. Объяснение нового материала

И тема нашего сегодняшнего урока – «Методы создания. Инструментальные средства создания Web-сайта.». Запишите себе в тетради сегодняшнее число и тему (учащиеся делают запись в тетради).

Итак, сайт – это группа взаимосвязанных Web-страниц, объединённых или единой тематикой, или единым авторством, или единым владельцем. Сайт состоит из Web- страниц. Каждая Web-страница представляет собой HTML-документ, т.е. документ, написанный в специальном формате HTML (HyperText Markup Language)

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

Одним из способов написания сайта является – ручной.

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

И еще один из существующих способов – использование специальных программных продуктов для создания и управления сайтом (например, визуальные HTML-редакторы Microsoft Front Page, Macromedia Dreamweaver или профессиональные системы для разработки сайтов 1C-Битрикс, MODx и др.)

Назначение и основные возможности Microsoft Front Page?(просмотр видео материала из подборки ЦОР):

В состав Microsoft Office входят Microsoft Word, Excel, PowerPoint и Access и др. Microsoft Office — это самый популярный сегодня на рынке пакет офисных приложений. Весь пакет программ обладает похожим интерфейсом, так что это очень облегчает наш труд по освоению Frontpage и дает нам непревзойденные возможности конструирования Web-сайтов.

Рабочее окно программы очень похоже на рабочие окна других программ входящих в состав Microsoft Office:

• заголовок окна,

• панели,

• область задач,

• рабочая область,

• панель свойств (нижняя строка над панелью рисования).

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

В зависимости от необходимости способа просмотра страниц и работы с ними можно использовать один из четырех режимов представления страницы:

1. Конструктор. Веб - страницы можно разрабатывать и редактировать по умолчанию в режиме Конструктор. Этот режим предоставляет практически все возможности по изменению формы и содержания будущего сайта.

2. Код. Позволяет самостоятельно просматривать, записывать и редактировать теги HTML, также упрощается процедура удаления ненужного кода.

3. С разделением. Проверять и редактировать содержимое веб-страницы можно в формате с разделением экрана, предоставляющем одновременный доступ к режимам Код и Конструктор.

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

Этапы работы:

• Запустить программу Microsoft Front Page.

• Создать новый Web-сайт или открыть уже созданный.

• Организовать структуру Web-сайта в режиме "Навигация".

• Отредактировать страницы Web-сайта в режиме "Страница" (в любом порядке):

  • перейти в режим редактирования конкретной страницы;

  • проверить настройки страницы;

  • ввести или вставить текст и отформатировать его;

  • вставить фон, звуковое сопровождение, общие области, таблицы, графические изображения, гиперссылки, панели навигации;

  • добавить анимационные эффекты и компоненты;

  • сохранить страницу и просмотреть ее в браузере Internet Explorer;

  • продолжить редактирование или перейти к редактированию другой страницы.

• Закрыть Microsoft Front Page, открыть Web-сайт в браузере Internet Explorer и протестировать его.

1. Закрепление нового материала путём выполнения практического задания

1. Подготовка к проектной работе

Работая над проектом, уч-ся должны определить цель, задачи, этапы реализации.

1. Работа в группах

Данная часть занятия предполагает самостоятельное выполнение практической работы, используя основные алгоритмы работы с Web-редактором FrontPage и собранный самостоятельно материал по предложенным темам (см приложение).

4.3 Проверка работ

1. Рефлексия. Итоги урока.

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

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

Проведем рефлексию. Давайте посмотрим, добились ли мы целей, поставленных в начале занятия

(по пунктам просматриваются все цели и задачи).

Попробуем подвести итоги, ответив на следующие вопросы:

• Что нового для себя узнали вы на уроке?

• Где могут пригодиться эти знания?

• Знаниями, из каких предметов вы пользовались при выполнении заданий?
  
  

6. Домашнее задание: выучить конспект, подготовить материал для собственного сайта

Тематика сайтов

Вариант 1

О курортных городах России

1. Сочи

2. Ялта

3. Анапа

Вариант 2

О выдающихся хоккеистах

1. Владислав Третьяк

2. Борис Михайлов

3. Валерий Харламов

Вариант 3

Об истории Олимпиады-80

1) Олимпиада 80

1. Виды соревнований на 0лимпиаде-80

2. Фотохроника

Вариант 4

О киноартистах

1. Анатолий Папанов

2. Андрей Мягков

3. Андрей Миронов

Вариант 5

О компьютерах

1. Ноутбуки

2. КПК и смартфоны

3. Настольные ПК

Вариант 6

О видах спорта

1) Плавание

2) Легкая атлетика

3) Бокс

Вариант 7

55 лет освоению космоса

1) Ю.А. Гагарин – первый космонавт

2) А. Леонов – первый человек, совершивший выход в открытый космос

3) В.Терешкова – первая женщина космонавт

Вариант 8

55 лет освоению космоса

1) Первый искусственный спутник Земли

2) Запуск космического аппарата «Луна-2»

3) Запуск космического корабля «Аполлон-11»

Вариант 9

55 лет освоению космоса

1) Живые существа в космосе

2) Люди в космосе

3) Первые пилотируемые полёты и конспирология

Вариант 10

55 лет освоению космоса

1) Первый искусственный спутник Марса

2) Первый аппарат, преодолевший притяжение Солнца

3) Первый пролёт около Юпитера и Меркурия

Что такое хостинг и где взять место под страницу.

Если нужно разместить страницу/сайт – надо найти для нее место (как для книги на полке), в Интернете такие места предоставляют специальные службы – хостеры. Они предоставят место для страницы/сайта на своем сервере – машине, на которой установлены специальные программы, и которая постоянно подключена к сети. Как известно, Интернет и состоит из множества таких машин объединенных между собой.

Итак, нужно найти «дом» для сайта – хостинг. «Квартиру» в таком «доме» можно купить, а можно «поселиться» в таком «доме» бесплатно. Однако, следует понимать, что за бесплатно возможности будут сильно ограничены: нельзя будет пользоваться скриптами (установить свою гостевую книгу, голосование, форум, чат и прочие скрипты), могут обязать вешать на странице рекламу (баннеры), ограничения местом (как правило не больше 3-10 мегабайт отводится под страницу), и бесплатные хостеры не несут обязательств, и можно «без суда и следствия» лишиться своей «квартиры» в любой момент.

Однако, если страничка домашняя, и пока не планируется серьезный проект, то бесплатный хостинг - это то, что нужно на первых порах. Бесплатный хостинг предоставляют Ucoz.ru, Narod.ru, By.ru, Boom.ru и многие другие, они легко находятся с помощью любой поисковой системы, достаточно ввести в строке поиска “бесплатный хостинг”.

Как зарегистрировать место под страницу, что такое домен, и как завести уникальное имя для сайта.

Допустим, решено зарегистрироваться на Narod.ru. Ищем на Народ.ру ссылку на раздел Регистрация (Создать страницу, Зарегистрировать сайт - это может называться по-разному), читаем внимательно правила и соглашение с пользователем, заполняем внимательно предложенную форму (анкету).

После регистрации адрес вашего сайта будет, допустим, vasya.narod.ru – это называется домен третьего уровня.

Что такое домен: разработчики решили, что цифровой адрес не удобен для пользователей интернет, что гораздо удобнее набрать vasya.ru, а не 197.84.789.10, но это было удобнее для людей, а не для машин. И тогда придумали следующее: человек набирает буквенный адрес, компьютер сверяет его с базой, и проверяет, какой цифровой адрес соответствует буквенному, и открывает страницу, соответствующую домену. Буквенный адрес назвали доменом. Каждой стране был присвоен адрес из 2-3 букв – например, .ru – был присвоен России, и назвали такой адрес – доменом первого уровня, и дали его каждой стране.

Соответственно, теперь каждая организация могла купить в зоне какой-либо страны себе домен – например, firma.ru – это домен второго уровня. На своем домене второго уровня каждая фирма может создать сколько угодно доменов третьего уровня, что и делают бесплатные хостеры.