Проект «Разработка сайта» 11 класс

Проект урока

«Разработка web- страницы на тему «Кем быть?»

Урок Подготовка индивидуальных проектных заданий.

Раздел программы: Телекоммуникационные технологии.

Тема урока: Разработка web- страницы на тему «Кем быть?»

Класс 11

Тип урока: Итоговый. (Закрепление полученных знаний)

Вид урока: Защита индивидуальных заданий.

Технология: Проблемно – исследовательская.

Оборудование: Компьютерный класс, оснащенный современными компьютерами и лицензионным программным обеспечением. ОС Windows, Microsoft office, Adobe Photoshop, доступ в сеть Интернет.

Цель урока.

1. Формирование умений и навыков, носящих в современных условиях общенаучный и общеинтеллектуальный характер.

2. Развитие творческого мышления, формирование операционного мышления, умения выбрать оптимальное решение.

3. Научить учащихся применять современное программное обеспечение.

4. Знакомство с профессиями, которые можно получить в нашем регионе. Востребованность профессий на рынке труда.

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

1. Воспитательная – развитие познавательного интереса, воспитание информационной культуры.

2. Учебная – изучить и укрепить навыки работы с современным программным обеспечением.

3. Развивающая – развитие логического мышления, расширение кругозора.

Этапы урока.

1. Подготовительный( домашнее задание)

• Учащиеся класса делятся на группы по 2 – 3 человека.

• Группа определяется в выборе темы web-страницы «Кем быть?».

• Собирается материал для web-страницы.

• Делаются заготовки: тексты, таблицы, рисунки, фотографии.

Вступительное слово учителя. (3 мин) Учитель определяет тему урока и ставит перед учащимися цели и задачи. Проверяет готовность домашнего задания – заготовки для проекта.

Учитель: Здравствуйте ребята! У нас сегодня очень ответственный урок. Этот учебный год последний в вашей школьной жизни. И каждый из вас сегодня стоит перед сложным жизненным выбором: Кем быть? Очень важно не ошибиться в своем выборе, и я надеюсь, что наш урок поможет вам хотя бы немного разобраться в разнообразии современных профессий, их востребованности на рынке труда. А также узнать в каких учебных заведениях нашего города можно получить данную профессию. Каждый из вас сам выбрал тему своего индивидуального проектного задания. Вы подготовили материалы, которые вам понадобятся для создания web- страницы о выбранной вам профессии.

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

На экране презентация: «Основные теги HTML» (слайд 1-7)

После просмотра слайдов с повторением материала открываем слайды с тестом.

На экране тест (слайд 8-13)

Учащиеся выполняют тест, состоящий из пяти вопросов:

1. Создание web- страницы.

Учащиеся занимают места за компьютерами. (25 мин). Приступают к выполнению индивидуальной практической работы. Если учащимся домашних заготовок недостаточно, то они могут найти информацию в сети Интернет. Учитель во время работы учащихся проводит индивидуальные консультации и оказывает помощь тем ученикам класса, которые менее подготовлены или слабо знают материал по подготовке web-сайта. Учащиеся работают над проектом до конца первого урока пары.

1. Защита проектов.

Второй урок пары посвящен защите проектов. Проекты представляются на интерактивной доске (5 – 6 проектов). Каждая группа демонстрирует свой проект, рассказывает о выбранной профессии и о методах создания страницы. Учащиеся в классе задают выступающим вопросы. Время защиты проекта 5 мин.

1. Оценка работы.

Каждая группа оценивает проект своих одноклассников по оценочной таблице, но не оценивает свой проект.

Оценочная таблица:

Лучший проект – это проект набравший большее количество баллов. Учитель оценивает проект, используя критерии оценки.

Критерии оценки WEB-страницы:

1. Владение технологией создания web-страницы.

2. Эффективность приемов выполнения основных операций редактирования.

3. Владение навыками структурирования текста и дизайна.

4. Умение задавать параметры графических объектов и анимации.

5. Рациональное использование площади страницы.

1. Подведение итогов. Заключительное слово учителя.

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

1. Домашнее задание. Создать проект web-страницы об одном из учебных заведений нашего города (Нижнего Новгорода).

Приложение №1. Проекты учащихся (частично).

«Профессия журналист»

«Профессия программист»

«Профессия менеджер»

Использованная литература.

1. учебник- Информатика. 10кл. Баз. уровень_Семакин и др_2015

2. М.Г. Гилярова. Информатика. Проектная деятельность. Пособие для учителя. Издательство Коррифей. 2008г.

3. О. Богомолова. Web- дизайн. Практикум. Издательство БИНОМ. 2008 г.

4. Электронные ресурсы: http://www.ucheba.com

Анализ урока.

В новом тысячелетии мы вступили в новую эпоху, которую по праву называют «информационной эпохой». Она ставит перед школьным образованием новую проблему – подготовить учеников к жизни и профессиональной деятельности в высокоразвитой информационной среде, к возможности получения дальнейшего образования с использованием современных информационных технологий обучения. Использование на уроках проблемно – исследовательских технологий в совокупности с современными техническими средствами обучения обеспечивает развитие познавательной деятельности учащихся с помощью проблемных заданий. Учащиеся должны были на уроке подготовить проектное задание – web-страницу на тему «Кем быть?». Такие проектные задания позволяют средствами компьютерных телекоммуникаций реализовать способ уменьшения нагрузки учащихся без ущерба качеству обучения; обеспечить высокий уровень дополнительной подготовки; осуществлять профессиональную ориентацию учащихся; улучшить условия мотивации обучения; усилить самостоятельные виды учебной деятельности. Судя по представленным проектам – мы достигли мотивационной цели. Учащиеся увидели нужность данного предмета в реальной жизни. Они показали хорошие навыки владения компьютером, умение работать с пакетами прикладных программ, находить нужную информацию. На нашем уроке они узнали информацию о наиболее востребованных профессиях на рынке труда и о том, в каком учебном заведении нашего города можно получить образования по данной профессии. Так как работа велась по группам, то на уроке все учащиеся получили оценку за работу, при этом они смогли оценить работу и своих одноклассников.

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

Web-сайт это:

• Набор страниц, посвященных определенной тематике и связанных между собой гиперссылками

Этапы разработки веб-сайтов:

• Анализ и проектирование сайта
• Информационное наполнение сайта
• Креатив, или визуальная составляющая сайта
• Написание кода
• Тестирование
• Публикация
• Поддержка

2 способа

С использованием конструктора

Ручной

С помощью языка разметки HTML

С помощью специальных программ

С помощью online-сервисов

• На Web – страницах находится информация: текстовая, графическая, звуковая, видео. Для того, чтобы создать Web – страницу нужно написать программу на языке HTML.
• Слово «HTML» представляет собой сокращение от «HyperText Markup Language» - «язык разметки гипертекста». Основным понятием языка HTML является понятие тег.
• ТЕГ – инструкция браузеру, указывающая способ отображения информации заключенный в угловые скобки . .

Одиночные

Парные

Пример:

Пример:  

… .

• Даны теги, определить парные и одиночные теги:
• ;
• 
  ;
• ;

Парные теги бывают:

Пример:   ….  

открывающиеся

закрывающиеся

Название Web-страницы

Приветствую тебя, посетитель моего сайта.

Меня зовут Петя.

Это моя первая Web-страница.

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

• В настоящее время имеется большое количество различных инструментальных средств разработки Web-страниц и Web-сайтов, от простейших HTML -редакторов до систем с использованием технологии WYSIWYG (" What You See Is What You Get" - "Что видишь, то и получишь "). Такие редакторы (визуальные веб-редакторы) входят в состав некоторых офисных пакетов и некоторых интегрированных приложений для работы в Интернете:

• Front Page Express  
• Kompozer  
• Web-мастер
• AdobeDreamweaver
• 1st Page 2000
• Microsoft Front Page
• AceHTML 4

Визуальный редактор

Kompozer

• - программа рассчитанная на работу в Windows, Linux,Mac Os.
• Для начала мы должны определиться с тематикой Веб- сайта, продумать дизайн, количество ссылок.

Интерфейс визуального редактора Kompozer

Оформление страницы

• Установка фоновой заливки страницы
• В главном меню редактора необходимо выбрать:

• Формат Цвета и фон страницы

Заголовок страницы

• Для изменения заголовка веб-страницы необходимо в главном меню выбрать :

• Формат Заголовок и свойства страницы

Наполнение веб-страницы

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

Добавление гиперссылок

• На панели инструментов существует иконка, с помощью которой добавляем гиперссылку, указывающую на расположенный в Интернете сайт

Добавление изображений

• Необходимо щелкнуть по иконке « Изображение » на панели инструментов и выбрать картинку из папки локального или съемного диска

Результат

Подведение итогов

• Чему научились? Что узнали нового? Что понравилось?
• Чему хотели бы научиться?
• Что было самым трудным ?

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

С использованием языка гипертекстовой разметки документа HTML

подчеркнутый Моя страница Привет! … Абзац Заголовок Выравнивание Начертание" width="640"

Основные теги языка HTML

Переход на новую строку

Имя файла

index.html

Горизонтальная линия

текст

Align=center;left;right;justify

текст заголовка

..........

текст заголовка

полужирный

курсив /i

подчеркнутый

Моя страница

Привет!

…

Абзац

Заголовок

Выравнивание

Начертание