Методический электронный образовательный центр Министерства образования Оренбургской области и Оренбургского государственного университета

Учителю
  • Быстрый поиск
  • Расширенный поиск
Тип материала:
Разделы:
Темы:

Тип материала

Урок 29 Технологии создания сайта [Корнякова Н.В.]

Текст урока

  • Конспект урока Технологии создания сайта

     Название предмета «Информатика»
    Класс 9 
    УМК: Информатика ФГОС, Л.Л.Босова, А.Ю.Босова, 2013г.
    Уровень обучения базовый
    Тема урока «Технологии создания сайта»
    Общее количество часов, отведенное на изучение темы – 2  часа
    Место урока в системе уроков по теме: Данный урок  является первым в данном разделе
    Цель урока 
    Обучающая: Осмысление и усвоение алгоритмического подхода к построению собственной деятельности по созданию Web-сайта. Иметь представление об особенностях оформления информационных блоков страницы. Освоить требования к созданию веб-страниц. Познакомиться с инструментальными средствами создания сайтов. Научиться создавать HTML – файлы. 
    Развивающая: формирование умений применять алгоритмы создания сайтов в конкретных ситуациях, развитие мыслительной деятельности  при проектировании, анализе, синтезе и структурировании материала.
    Воспитательная: формирование информационной грамотности ученика, способствовать  расширению информационного кругозора, трудолюбия и навык самостоятельности при выполнении практической  работы, воспитывать ответственность за результат  своего труда.
    Задачи урока 
    развитие познавательного интереса и творческой активности учащихся;
    формирование коммуникативных умений учащихся посредством нестандартной формы проведения урока - деловой игры.
    Планируемые результаты
    Личностные способность  и  готовность  к  принятию  ценностей здорового  образа  жизни  за  счет  знания  основных  гигиенических, эргономических  и  технических  условий  безопасной  эксплуатации средств ИКТ 
    Метапредметные представления  о  компьютерных  сетях распространения  и  обмена  информацией,  об  использовании информационных ресурсов общества с соблюдением соответствующих правовых  и  этических  норм,  требований  информационной безопасности
    Предметные наличие  основных  представлений  об  организации  и функционирования  компьютерной  сети  Интернет;  общие представления о технологии создания сайтов
    Техническое обеспечение урока компьютерный класс, мультимедийный проектор, ОС Windows XP, пакет прикладных программ MS Office.
    Дополнительное методическое и дидактическое обеспечение урока мультимедийная презентация;  сайт: https://sites.google.com/site/drofa3320121/
    Содержание урока 
    №
    Этап урока
    Название используемых ЭОР
    Деятельность учителя 
    (с указанием действий с ЭОР, например, демонстрация)
    Деятельность ученика
    Время
    (в мин.)
    1
    2
    3
    5
    6
    7
    1
    Организационный момент
    
    
    Здравствуйте, ребята. Сегодня мы с вами переходим к изучению новой темы «Web-страницы и Web-сайты. Структура Web-страницы. Форматирование текста на Web-странице». Открываем тетради, записываем  дату и тему урока. 
    Внимательно слушают учителя, записывают дату и тему урока в тетрадь
    2
    2
    Актуализация знаний
    
    Тема «Разработка Web-сайтов» – одна из наиболее практически значимых, востребованных, так как умение создавать web-сайты становится все более актуальным навыком пользователя интернета. 
    Давайте с Вами подумаем какое назначение может быть у сайта, для чего он может быть создан?
    Реклама  Коммерция Образование
    Размещение личной информации, статей, материалов
    2
    3
    Объяснение нового материала
    Технология WWW
    
    
    
    
    
    
    
    
    
    
    Web-страницы. Web-страницы создаются с использованием языка разметки гипертекстовых документов HTML (Hyper Text Markup Language). В обычный текстовый документ вставляются управляющие символы - HTML-тэги, которые определяют вид Web-страницы при ее просмотре в браузере. Основными достоинствами Web-страниц являются:
    - малый информационный объем;
    - возможность просмотра в различных операционных системах.
    Для создания Web-страниц используются простейшие текстовые редакторы, которые не включают в создаваемый документ управляющие символы форматирования текста самого редактора. В качестве такого редактора в Windows можно использовать стандартное приложение Блокнот. Создание Web-страниц с использованием HTML-тэгов требует больших усилий, времени и знания синтаксиса языка. Применение специальных инструментальных программных средств (Web-редакторов) делает работу по созданию Web-сайтов простой и эффективной. Процесс создания и редактирования страниц в Web-редакторах очень нагляден, так как производится в режиме WYSIWYG (от англ. "What You See Is What You Get" - "Что видишь, то и получишь").
    Web-сайты. Публикации во Всемирной паутине реализуются в форме Web-сайтов, которые обычно содержат материал по определенной теме или проблеме. Государственные структуры и организации (правительство, дума, школа и т. д.) обычно создают официальные Web-сайты своих организаций, на которых размещают информацию о своей деятельности. Коммерческие фирмы на своих Web-сайтах размещают рекламу товаров или услуг и предлагают их приобрести в Интернет-магазине. Любой пользователь Интернета может создать свой тематический сайт, на котором может разместить информацию о своих разработках, увлечениях и т. д. Как журнал состоит из печатных страниц, так и Web-сайт состоит из компьютерных Web-страниц. Сайт должен содержать систему гиперссылок, которая позволяет пользователю перемещаться по Web-страницам. Прежде чем разместить свой Web-сайт на сервере в Интернете, его необходимо тщательно протестировать, так как потенциальными посетителями вашего сайта будут являться десятки миллионов пользователей Интернета.Для публикации Web-сайта необходимо найти подходящее место на одном из серверов Интернета. Многие провайдеры предоставляют своим клиентам возможность бесплатного размещения Web-сайтов на своих серверах (бесплатный хостинг).
    Внимательно слушают учителя, отвечают  на его вопросы, делают записи в тетради
    18
    
    
    
    
    
    Презентация «Структура Web-страницы»
    Структура Web-страницы.
    HTML-код страницы помещается внутрь контейнера <HTML></HTML>. Без этих тэгов браузер не в состоянии определить формат документа и правильно его интерпретировать. Web-страница разделяется на две логические части: заголовок и отображаемое в браузере содержание.
    Заголовок Web-страницы заключается в контейнер <HEAD></HEAD> и содержит название документа и справочную информацию о странице (например, тип кодировки), которая используется браузером для правильного отображения. Тэги заключаются в угловые скобки и могут быть одиночными или парными. Парные тэги содержат открывающий и закрывающий тег (такая пара тэгов называется контейнером).
    Закрывающий тэг содержит прямой слэш (/) перед обозначением. Тэги могут записываться как прописными, так и строчными буквами.
    Название страницы помещается в контейнер <TITLE></TITLE> и при просмотре отображается в верхней строке окна браузера.
    Отображаемое в браузере содержание страницы помещается в контейнер <BODY></BODY> (рис. 6.26):
    <HTML>
    <HEAD>
    <ТITLE>Компьютер</ТITLE>
    </HEAD>
    <BODY>
    Компьютер и ПО
    </BODY>
    </HTML>
    
    Заготовка Web-страницы "Компьютер"
    Созданную Web-страницу необходимо сохранить в виде файла под именем index.htm. В качестве расширения файла Web-страницы можно также использовать html. Рекомендуется создать для размещения сайта специальную папку и сохранять все файлы разрабатываемого сайта в этой папке. Необходимо различать имя файла index.htm, под которым Web-страница хранится в файловой системе, и имя Web-страницы (например, "Компьютер"), которое высвечивается в верхней строке окна браузера. Имя Web-страницы должно соответствовать ее содержанию, так как оно в первую очередь анализируется поисковыми системами.
    
    
    
    
    
    
    
    
    
    
    
    
    Технология  создания Web-сайта
    
    
    
    
    Форматирование текста на Web-странице
    Пока наша страница выглядит не слишком привлекательно: мелкий шрифт черного цвета на белом фоне. С помощью тэгов молено задать различные параметры форматирования текста.
    Заголовки. Размеры шрифтов заголовков задаются парами тэгов от <Н1></Н1> (самый крупный) до <Н6></Н6> (самый мелкий).
    Шрифт. Некоторые тэги имеют атрибуты, которые являются именами свойств и могут принимать определенные значения. С помощью тэга FONT и его атрибутов можно задать параметры форматирования шрифта. Атрибут FACE позволяет задать гарнитуру шрифта (например, FACE="Arial"), атрибут SIZE - размер шрифта (например, SIZE=4).
    Атрибут COLOR позволяет задавать цвет шрифта (например, C0L0R="blue"). Значение атрибута COLOR можно задать либо названием цвета (например, "red", "green", "blue" и т. д.), либо его шестнадцатеричным значением.
    
    
    4
    Физкультминутка
    
    Физкультминутка 
    Выполняют упражнения для глаз
    1
    5
    Практическая работа
    Создание     простейшей Web-страницы
    Проведение практической работы «Создание начальной страницы сайта».  
    Выполняют практическую работу
    15
    6
    Закрепление пройденного материала
    
    Создание     простейшей Web-страницы
    А теперь закрепим знания, полученные на уроке (используется ЭОР Создание     простейшей Web-страницы)
    Учащиеся работают с модулем
    5
    7
    Рефлексия
    
    Ребята, сегодня мы с вами познакомились с созданием простейших web-страниц. Возникали ли у Вас трудности при работе? Определите и выберите листочки, на каком уровне вы находитесь:
    -  знаю и объясню другому
    -  знаю
    -  сомневаюсь, что знаю
    -  не знаю
    Говорят, что нового узнали на уроке; высказываются о трудностях, возникших по ходу работы.
    1
    8
    Подведение итогов и домашнее задание
    
    Выставление оценок, задание на дом п. 4.4.1, контрольные вопросы в конце каждого пункта.
    Слушают учителя, записывают домашнее задание
    1
    Разработка сайта с использованием языка разметки текста HTML
    Аппаратное и программное обеспечение. Компьютер с установленной операционной системой Windows или Linux, подключенный к Интернету.
    Цель работы. Научиться создавать Web-сайты с исполь­зованием языка разметки текста HTML в простейшем тек­стовом редакторе Блокнот.
    Задание. В операционной системе Windows или Linux создать сайт с использованием языка разметки текста HTML в простейшем текстовом редакторе Блокнот. Сайт «Компьютер» должен содержать начальную страницу и страницы «Программы», «Словарь» и «Анкета». Сохранить их в файлах с именами index.htm, software.htm, glossary.htm и anketa.htm в папке сайта.
    Начальная страница сайта. Создадим начальную стра­ницу Web-сайта «Компьютер».
    В операционной системе Windows или Linuх запустить простейший текстовый редактор Блокнот.
    Ввести тэги, определяющие структуру Web-страницы. Ввести заголовок Web-страницы: «Компьютер». Ввести заголовок текста, отображаемый в браузере: «Всё о компьютере».
    <HTML> 
    <HEAD>
    <ТIТLЕ> Компьютер </ТIТLЕ>
    </HEAD>
    <BODY>
    Всё о компьютере
    </BODY>
    </HTML
    Просмотреть получившуюся Web-страницу в браузере.
    На начальной странице сайта обычно размещается текст, кратко описывающий его содержание. Поместим на началь­ную страницу текст, разбитый на абзацы с различным выравниванием.
    <Р ALIGN="left">Ha этом сайте вы сможете получить различную информацию о компьютере, его программном обеспечении и ценах на компьютерные комплектующие.</Р>
    <Р ALIGN="right" Терминологический словарь познакомит вас с компьютерными терминами, а также вы сможете заполнить анкету.</Р>
    Пусть начальная страница сайта «Компьютер» будет со­держать центрированный крупный заголовок синего цвета, отделенный горизонтальной линией от двух по-разному вы­ровненных абзацев.
    <FONT COLOR«"blue"> 
    <Н1 ALIGN="center"> Все о компьютере </Н1>
    </FONT> 
    <HR> 
    <Р ALIGN=" left">На этом сайте...</Р>
    <Р ALIGN="right">Терминологический словарь _.</Р>
    На начальной странице сайта «Компьютер» логично разместить изображение компьютера.
    Создадим папку сайта «Компьютер» и добавим в сайт пустые страницы «Программы», «Словарь» и «Анкета». Сохраним их в файлах с именами SOftware.htm, glossary.htm и anketa.htm в папке сайта. Такие пустые страницы должны иметь заголовки, но могут пока не иметь содержания.
    <HTML> 
    <HEAD>
    <ТIТLЕ>Заголовок страницы</ТIТLЕ> 
    </HEAD> 
    <BODY> </BODY> 
    </HTML>
    Создадим панель навигации по сайту «Компьютер». На начальной странице сайта разместим указатели гиперссы­лок на страницы сайта. В качестве указателей гиперссылок удобнее всего выбрать названия страниц, на которые осуще­ствляется переход.
    Разместим указатели гиперссылок внизу страницы в но­вом абзаце в одну строку, разделив их пробелами. Такое размещение гиперссылок часто называют панелью навигации.
    Созданная начальная страница Web-сайта «Компью­тер» содержит заголовок, изображение компьютера, два аб­заца текста, панель навигации и ссылку на адрес электронной почты.
    
     

    Автор(ы):

    Скачать: Информатика 9кл - Конспект урока Технологии создания сайта.docx