15.06.20г

Тема: Современные технологии создания Web-сайтов.

 Сегодня мы продолжим с вами изучать одну из интересных тем информатики «Создание Web-сайтов». К сегодняшнему дню мы уже знаем с вами, что представляют собой Web-сайты и для каких целей они создаются. Знаем, какими способами можно создавать Web-сайты. И выбрали для себя один из способов — язык разметки гипертекста HTML. Так как, не зная кодов HTML, нам трудно будет внести какие-либо изменения в уже готовый Web-сайт. Технология HTML позволяет создать нам простые и небольшие Web-сайты. И если мы захотим научиться создавать качественные по стилю и содержанию Web-сайты, то нам нужно изучить не только язык HTML, но и рассмотреть элементы каскадных стилей CSS, визуальные Web-редакторы MS Front Page или Adobe Dreamweaver. А также в дополнение к ним изучить программы для обработки графических изображений - Adobe Photoshop и программы для создания различного рода анимации - Macromedia Flash.
Кто разрабатывает Web-сайты? Web-сайты могут разрабатываться как web-программистами и web-дизайнерами, так и обычными пользователями Интернета, так как вопрос создания сайтов становится в наше время всё более актуальным. Интернет всё прочнее входит в нашу жизнь и предоставляет возможности дополнительного заработка тем, кто владеет собственными сайтами, и тем, кто занимается профессиональным их созданием.

А сложно ли создавать сайты? Нам предстоит выяснить это на данном практическом занятии. Каждый из вас продолжит создание персонального Web-сайта, в котором можно будет разместить информацию о себе, своей семье и друзьях, о своих интересах и увлечениях, фотографии, формы и т.д. Для этого на предыдущих уроках мы разработали с вами проект вашего будущего сайта, который представлен на доске и в учебных пособиях. Некоторые из Web-страниц сайта мы уже с вами заполнили на предыдущем уроке. На дом вам было дано задание подобрать соответствующую информацию о себе, фотографии, рисунки и всё то, что вы хотели бы представить на своём сайте.

Каждому из вас предоставляется возможность проявить все свои творческие и дизайнерские способности при создании и оформлении сайта. В конце урока мы вместе оценим ваши проекты, выделим среди них самые лучшие и «не очень», обсудим трудности, с которыми вы, может быть, столкнетесь при создании сайта.       

3. Актуализация знаний. Повторение пройденного материала. Индивидуальный (фронтальный) теоретический опрос обучающихся.

Учитель: Для проверки вашей готовности к созданию сайтов проведем небольшой тест на проверку знаний основных понятий по созданию Web-сайтов. Для этого я вам подготовила несколько вопросов с вариантами ответами, среди которых вы выбираете правильный. И подготовила интерактивное задание на знание основных тэгов языка HTML, в котором нужно будет установить соответствие указанного тэга на совершаемое им действие.

Учитель открывает соответствующие слайды презентации (сценария) урока и проводит индивидуальный (фронтальный) теоретический опрос обучающихся.

1) Тестовый контроль на знание основных понятий по созданию Web-сайтов.

Вопрос: Web-редактор - это программа для ...

Укажите правильный вариант ответа:

o    Просмотра Web-страниц

o    Создания Web-страниц

o    Создания гиперссылок на Web-странице

Вопрос: Публикации во Всемирной паутине реализуются с помощью...

Укажите правильный вариант ответа:

o    Языка HTML

o    Web-сайтов

o    Тэгов

Вопрос: Web-страница имеет расширение:

Укажите правильный вариант ответа:

o    xls

o    txt

o    html

Вопрос: Web-страницы сайта объединяются между собой с помощью...

Укажите правильный вариант ответа:

o    Гиперссылок

o    Браузера

o    Сервера

Вопрос: Язык HTML - это ...

Укажите правильный вариант ответа:

o    Школьный алгоритмический язык

o    Язык разметки гипертекста

o    Язык программирования

Вопрос: Web-сайт можно создать с помощью языка...

Укажите правильный вариант ответа:

o    QBasic

o    Turbo Pascal

o    HTML

Вопрос: Для создания Web-страниц используются Web-редакторы:

Укажите правильный вариант ответа:

o    DreamWeaver

o    Word

o    Paint

Вопрос: Что такое гиперссылка?

Укажите правильный вариант ответа:

o    Текст, выделенный полужирным шрифтом

o    Указатель на другую Web-страницу

o    Выделенный фрагмент текста

Вопрос: Браузер - это программа для ...

Укажите правильный вариант ответа:

o    Просмотра Web-страниц

o    Создания гиперссылок на Web-странице

o    Создания Web-страниц

Вопрос: Для просмотра Web-страниц в Интернете используют программу:

Укажите правильный вариант ответа:

o    MS Word

o    Блокнот

o    Google Chrome

2) Интерактивное задание на знание основных тэгов языка HTML (установление соответствия указанного тэга на выполняемое им действие).

Тэг

Действие

<BODY>   </BODY>

Содержит основное содержание Web-страницы

<HTML>   </HTML>

Начало и конец Web-страницы

<A HREF=  >   </A>

Создание гиперссылки

<HR>

Горизонтальный разделитель

<UL>   </UL>

Создание маркированного списка

<P>   </P>

Создание абзаца

<TITLE>   </TITLE>

Содержит название Web-страницы

<IMG SRC= “URL”>

Вставка рисунка

 

Тэг

Действие

<FONT COLOR=  >   </FONT>

Цвет шрифта

<B>   </B>

Полужирный шрифт

<FONT SIZE=  >   </FONT>

Размер шрифта

<H?>   </H?>

Размер заголовка

<I>   </I>

Курсивный шрифт

<P ALIGN=  >   </P>

Абзац  с выравниванием

<FORM>   </FORM>

Вставка формы

<BODY BGCOLOR = “цвет”>

Цвет фона

Таблица. Основные критерии оценивания Web-сайтов


Название сайта:

Баллы


полностью


частично


нет

Структура сайта

 

Отражены цели и ход исследования.

 

 

 

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

 

 

 

Описаны использованные информационные ресурсы, программные и аппаратные средства

 

 

 

Содержание представленной информации

 

Представленная информация является ценной и интересной

 

 

 

Стилистически текст построен грамотно

 

 

 

Орфографические ошибки отсутствуют

 

 

 

Текст написан понятным языком

 

 

 

Дизайн сайта

 

Дизайн соответствует тематике сайта

 

 

 

Текст на выбранном фоне хорошо читается

 

 

 

Иллюстрации хорошего качества

 

 

 

Навигация по сайту

 

Представлен широкий спектр средств навигации

 

 

 

Все гиперссылки работают корректно

 

 

 

Внесите свои предложения и пожелания по дальнейшему развитию сайта

 


Примерный план для представления Web-сайта и анализа своей творческой деятельности:

1) Цель и основная идея создания вашего сайта.

2) Из каких информационных блоков состоит ваш сайт?

3) Соответствует ли ваш сайт основным принципам Web-дизайна?

4) Что определяет успех вашего сайта в большей степени — техническая или содержательная сторона, дизайн?

5) С какими трудностями вы столкнулись при создании сайта?

6) Всё ли вам удалось успеть сделать? Каковы перспективы развития вашего сайта?

7) Совпадает ли ваша личная оценка за сайт с оценкой одноклассников и учителя? Считаете ли вы по-другому? И почему?

 

- Создание сайта – дело для вас новое, и, естественно, не всё у всех сразу получается. И в этом нет ничего страшного, так как вы только учитесь этому.

- Мы совместно обсудили и оценили ваши сайты. Высказали свои пожелания по дальнейшему их развитию и обновлению. Хочу выделить наиболее лучшие из представленных вами проектов. Это сайты следующих обучающихся — 1)...., 2)...., 3).... И я думаю, что вы разделяете моё мнение.

- Итак, по результатам практической работы за компьютером вы получаете следующие оценки: ...

- После проведения тестового контроля по пройденному материалу и выполнения заданий на установление соответствия можно отметить работу следующих обучающихся:

- За активное участие на уроке при анализе и обсуждении сайтов можно отметить работу следующих обучающихся: …

- Кто из вас считает, что разработка и создание Web-сайтов — это довольно трудный и непосильный труд? И почему?

- А кто посчитал это очень увлекательным и интересным делом, и при огромном своём желании мог бы заняться в будущем профессиональным созданием Web-сайтов?

- Нарисуйте, пожалуйста, смайлики на стикерах (или на доске), которые изобразят ваше настроение после нашего урока.