План-конспект открытого урока "Web-страница, web-сайт. Структура web-страницы"

Учитель: Призовская Алена Валерьевна

Должность: учитель информатики

Тема урока: «Web-страницы и Web-сайты. Структура Web-страницы»

Класс: 8а, 8б

Цель урока:

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

освоение приемов создания Web-страниц и Web-сайтов с помощью языка разметки гипертекста HTML.

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

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

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

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

1.             развитие речи, мышления, памяти;

2.             формирование навыков логического мышления (вывод, анализ, обобщение, выделение главного).

3.             продолжить развитие внимания и памяти у учащихся.

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

1.             продолжить формирование познавательного интереса к предмету;

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

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

Оборудование урока:

1.             учебники;

2.             мультимедийный компьютер с проектором;

3.             персональные компьютеры.

Ход урока:

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

2.             Формирование целей урока.

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

4.             Практическая работа.

5.             Домашнее задание.

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

Здравствуйте, ребята. Сегодня мы с вами переходим к изучению новой темы «Web-страницы и Web-сайты. Структура Web-страницы». Открываем тетради, записываем  дату и тему урока.

2.      Формирование цели урока

Итак, тема «Разработка Web-сайтов» сейчас очень актуальна одна из наиболее практически значимых, востребованных. Как Вы думаете, почему? (Потому что без Интернета сейчас невозможно представить жизнь)

Да, все верно, сейчас мы уже практически все можем сделать/заказать/сообщить через Интернет, на определенных сайтах. Что мы можем делать на сайтах? (Платить, заказывать товары в Интернет-магазинах, записываться на прием к врачу/в консульство, смотрим видео/передачи, слушаем музыку, можем даже купить товары за границей Aliexpress, ebay).

Как Вы считаете – кто создает сайты? (Вебмастер)

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

Изначально это был вебмастер, он должен был знать язык программирования(в нашем случае – это HTML), понимать что этот сайт должен делать, как должен выглядеть (даже фраза такая есть «Жираф – это лошадь, выполненная в точности по всем требованиям заказчика»), следить за содержанием (за контентом) сайта, а так же быть техническим специалистом.

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

Что такое Web – сайт, Web – страница, гиперссылка?

Веб-сайт (Website) - это объединённая под одним адресом (доменным именем) совокупность документов частного лица или организации. По умолчанию подразумевается что сайт располагается в сети Интернет, но он так же может публиковаться в локальной сети компании - в сети Интернет.

Веб-страница - это логическая единица интернета, однозначно определяемая адресом (URL). Можно сказать, что веб состоит из сайтов, а сайты, в свою очередь - из страниц. Веб-страницы могут включать картинки, музыку, видео, скрипты и др.

Гиперссылка (hyperreference)— часть гипертекстового документа, ссылающаяся на другой элемент (команда, текст, заголовок, примечание, изображение) в самом документе, на другой объект (файл, директория, приложение), расположенный на локальном компьютере или в компьютерной сети, либо на элементы этого объекта.

Сейчас есть несколько языков на которых можно создавать Web-страницы – php, java, таблица стилей css, html. Мы с Вами начнем с HTML. И первое что нам надо запомнить что это не совсем язык программирования – это язык гипертекстовой разметки страниц. Гипертекст – система из текстовых страниц, имеющих перекрестные ссылки. В html привычные нам операторы называются тегами. Тег – специальные символы и управляющие слова – метки. Теги бывают одиночные и парные. Парные теги называются контейнером. Т.е. есть закрывающий тег, он пишется так же как и открывающий, но с прямым слешем перед меткой. Все теги заключаются в угловые скобки < >.

Для создания Web-страниц можно использовать простейшие текстовые редакторы, которые не включают в создаваемый документ управляющие символы форматирования текста самого редактора. В качестве такого редактора в Windows можно использовать стандартное приложение Блокнот (Текстовый документ).

Структура Web-страницы.

HTML-код страницы помещается внутрь контейнера <HTML></HTML>. Без этих тэгов браузер не в состоянии определить формат документа и правильно его интерпретировать. Web-страница разделяется на две логические части: заголовок и отображаемое в браузере содержание.

Заголовок Web-страницы заключается в контейнер <HEAD></HEAD> и содержит название документа и справочную информацию о странице (например, тип кодировки), которая используется браузером для правильного отображения.

Название страницы помещается в контейнер <TITLE></TITLE> и при просмотре отображается в верхней строке окна браузера.

4.     Практическая работа

Садимся за компьютеры. Включаем их если выключены. Открываем текстовый редактор «Блокнот». Нажимаем <Файл> -> <Сохранить как> -> Выбираем место сохранения, пусть это будет рабочий стол и называем файл index0.htm

Теперь используя конспет и то что я Вам рассказала пишем разметку страницы.

<html>

<head>

<title> ФИ класс </title>

</head>

<body>

Мой первый сайт

</body>

</html>

5.     Домашнее задание

В учебниках параграф 6.4, страница 130