Открытый урок по информатике на тему "Разработка Web-сайтов с использованием языка разметки гипертекста HTML"
методическая разработка по информатике и икт (11 класс) по теме

Раздел программы: Разработка Web-сайтов с использованием языка разметки гипертекста HTML (11 класс)

Цели урока:

Повторение основных принципов построения сайтов, структуры HTML-документа.

Стимулирование познавательного интереса учащихся к предмету “Информатика”.

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

Научить школьников применять современное программное обеспечение.

Задачи урока:

Учебная –  Повторение основных понятий раздела программы.

Развивающая –  развитие приемов умственной деятельности (обобщение, анализ, синтез, сравнение), памяти, творческой активности.

Воспитательная – стимулирование познавательного интереса учащихся, развитие уверенности в собственных силах.

Тип урока:  урок обобщения и систематизации знаний по теме «Разработка Web-сайтов с использованием языка разметки гипертекста HTML»

Вид урока: защита  проектов

Время проведения: Данная тема рассчитана на 1 урок, как подведение итогов по теме «Разработка Web-сайтов с использованием языка разметки гипертекста HTML»

 Оборудование:  компьютерный класс, проектор.

 План урока:

Орг. момент – 5 мин.

Обобщение изученного материала– 10 мин.

Разработка проекта – 15 мин

Защита проекта  - 5 мин

Подведение итогов – 5 мин

Ход урока

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

 Здравствуйте! Мы изучили большую тему «Создание Web-сайтов с использованием языка разметки гипертекстовых документов HTML». К сегодняшнему дню мы уже знаем, что такое сайт и чем он отличается от обычного текстового документа. Знаем, что Web-сайт можно создавать с помощью специальных программ и с помощью языка гипертекстовой разметки HTML. Вы знаете, что команды HTML задаются с помощью специальных элементов – тэгов, которые бывают парные и непарные. Знаете, что программы, написанные на языке HTML, имеют определенную стандартизированную структуру.

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

2. Обобщение изученного материала:

Первый шаг

 Теперь вспомним основную структуру HTML-документа на примере создания страницы Сайт о нашем классе”  на рабочем столе папка Класс, создать  файл «наш  класс.html. Необходимо выйти к доске открыть просмотр HTML кода проговорить основную структуру документа и выполнить следующие задания:

1.Задать цвет фона страницы и цвет текста.

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

2.Сделать заголовок 1 уровня поставить его по центру, задать цвет заголовка. Выделить список класса полужирным и курсивом.  (Один ученик выходит к компьютеру  прописывает команды и объясняет их значение.)

- уровень заголовка;                

- полужирным;                                      

- курсив.

3.Сделать маркированный список во втором абзаце текста.

 Давайте вспомним,  как сделать маркированный или нумерованный список, какие теги для этого используются. (Один ученик выходит к компьютеру  прописывает команды и объясняет их значение.)

- нумерация;
- маркирация;
1. .

   4.Необходимо разбить текст,  который стоит после маркированного списка по смыслу на 3 абзаца.

   - с новой строки  (он не обязательно закрывающий тег)

   
   - новый абзац

   Второй шаг

    Прекрасно!  Это все была работа с текстом. Следующий шаг очень важный при создании сайтов – это вставка рисунка. Попробуем в нашу заготовку вставить несколько картинок.

   5.Необходимо вставить flash-картинку «Это мы» по бокам от заголовка. Поставить выровненную по левому краю картинку «Наш классный руководитель» и по центру после текста картинку«Наши учителя».

   (Один ученик выходит к компьютеру  прописывает команды и объясняет их значение.)

    Тег   - вставка картинки,     атрибут   - выравнивание

   Третий шаг

    Теперь нас интересует,  как можно соединять между собой готовые Web-страницы. И  покажем  это на примере организации гипертекстовой разметки между  файлом  «Наш класс.htm», который мы только что сделали  и уже готовой web  – страницей (заготовкой) под названием «http://tuluganovka.edusite.ru/».  (Наша школа)

   (Один ученик выходит к компьютеру  прописывает команды и объясняет их значение)

    6.Сделать ссылку,  используя  для этого картинку «Наш класс»  на страницу «http://tuluganovka.edusite.ru/».

    Тег

   3. Создание самостоятельного проекта

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

   Время ограниченно 15 мин.

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

   5. Подведение итогов:

    Подведем итоги нашей работы. Мы просмотрели выполненный вами проект. Вы показали высокий уровень знаний по данной теме. Хочется отметить, что ни кто из учащихся не отнесся к работе равнодушно, и если у кого-то не все получилось – не огорчайтесь!  Дорогу осилит идущий!