Конспект урока по информатике по теме "Web - страницы и Web - сайты"

Цель урока: Научить технологии создания и сохранения Web – страницы.

Задачи:

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

1. Продолжить формирование навыков работы на компьютере.

2. Повторить понятия гипертекстовый документ, Язык разметки HTML, Web – редакторы, Web – страницы, теги.

3. Познакомить со структурой HTML-документа.

4. Объяснить учащимся технологию создания Web - страницы.

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

1.    Продолжить формирование логического мышления через совершенствование навыков применения текстового редактора Блокнот для создания Web - документа.

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

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

1.    Продолжить развитие культуры речи через пояснения последовательности работы на компьютере.

2.    Развивать умение работать в парах (доброжелательное отношение).

Ход урока:

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

Тема нашего урока «Web – страницы и Web – сайты». На сегодняшнем уроке мы продолжим формировать навыки работы на компьютере, научимся создавать Web – страницы в текстовом редакторе Блокнот. Познакомимся со структурой HTML - документа. Чтобы приступить к работе, необходимо повторить пройденный материал.

2. Актуализация знаний.

Учитель: Что такое Гипертекст?

Ученик: Гипертекст – текст, содержащий связи с другими текстами, графической, видео- или звуковой информацией).

Учитель: Что такое WWW?

Ученик: WWW (Word Wide Web) – cсистема навигации, поиска и доступа к мультимедийным средствам с помощью средств гипертекста.

Учитель: Что такое браузер?

Ученик: Браузер – программа просмотра гипертекстовых страниц WWW.

Учитель: Что вы понимаете под НТМL?

Ученик: HTML (Hypertext Markup Language) – язык разметки гипертекста. HTML-документы представляют собой текстовые файлы, в которые встроены специальные команды.

Учитель: Что такое тэги?

Ученик: Тэги (tags) – команды языка HTML.

3. Изучение нового материала.

Учитель: В классе есть группа учеников, которые уже научились создавать Web – сайты, теперь мы должны научить остальных учащихся. Уже созданные Web – сайты мы представим на Всероссийском конкурсе «Компьютерного творчества». Данные ученики будут являться моими помощниками на уроке.

Ученик: Котенев Алексей представляет Web – страницу по теме: «История мяча».

Представление основной структуры HTML – документа. Объяснение тегов.

Основная структура HTML – документа начинается с парного тега <НТМL>. Который обозначает, что мы создаём Web – страницу, с помощью языка разметки гипертекста HTML. В парных тегах существуют: открывающий и закрывающие теги. Их отличие состоит в том, что в закрывающем теги мы используем слеш. Cам Web документ располагается между парными тегами.

Ученик: Соломоник Александр представляет Web – страницу по теме: «Тунгусский заповедник».

Полную информацию смотрите в файле. 

Тема урока: Web – страницы и Web – сайты.

Цель урока: Научить технологии создания и сохранения Web – страницы.

Задачи:

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

1. Продолжить формирование навыков работы на компьютере.

2. Повторить понятия гипертекстовый документ, Язык разметки HTML, Web – редакторы, Web – страницы, теги.

3. Познакомить со структурой HTML-документа.

4. Объяснить учащимся технологию создания Web - страницы.

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

1. Продолжить формирование логического мышления через совершенствование навыков применения текстового редактора Блокнот для создания Web - документа.

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

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

1. Продолжить развитие культуры речи через пояснения последовательности работы на компьютере.

2. Развивать умение работать в парах (доброжелательное отношение).

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

1. Проектор, экран, компьютеры.

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

Методы обучения: объяснение, практическая работа.

ПЛАН УРОКА.

Ход урока:

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

Тема нашего урока «Web – страницы и Web – сайты». На сегодняшнем уроке мы продолжим формировать навыки работы на компьютере, научимся создавать Web – страницы в текстовом редакторе Блокнот. Познакомимся со структурой HTML - документа. Чтобы приступить к работе, необходимо повторить пройденный материал.

2. Актуализация знаний.

Учитель: Что такое Гипертекст?

Ученик: Гипертекст – текст, содержащий связи с другими текстами, графической, видео- или звуковой информацией).

Учитель: Что такое WWW?

Ученик: WWW (Word Wide Web) – cсистема навигации, поиска и доступа к мультимедийным средствам с помощью средств гипертекста.

Учитель: Что такое браузер?

Ученик: Браузер – программа просмотра гипертекстовых страниц WWW.

Учитель: Что вы понимаете под НТМL?

Ученик: HTML (Hypertext Markup Language) – язык разметки гипертекста. HTML-документы представляют собой текстовые файлы, в которые встроены специальные команды.

Учитель: Что такое тэги?

Ученик: Тэги (tags) – команды языка HTML.

3.Изучение нового материала.

Учитель: В классе есть группа учеников, которые уже научились создавать Web – сайты, теперь мы должны научить остальных учащихся. Уже созданные Web – сайты мы представим на Всероссийском конкурсе «Компьютерного творчества». Данные ученики будут являться моими помощниками на уроке.

Ученик: Котенев Алексей представляет Web – страницу по теме: «История мяча».

Представление основной структуры HTML – документа. Объяснение тегов.

Основная структура HTML – документа начинается с парного тега L. Который обозначает, что мы создаём Web – страницу, с помощью языка разметки гипертекста HTML. В парных тегах существуют: открывающий и закрывающие теги. Их отличие состоит в том, что в закрывающем теги мы используем слеш. Cам Web документ располагается между парными тегами BODY.

Ученик: Соломоник Александр представляет Web – страницу по теме: «Тунгусский заповедник».

Чтобы задать фон Web – страницы используется Атрибут BACKGROUND

Например:

BODY BACKGROUND = “имя файла.расширение”

Позволяет использовать в качестве фона изображение из файла.

Для задания шрифта на странице документа HTML служит команда font:

face = "Monotype Corsiva" size = 7 color =yellow

текст

В этой команде могут использоваться следующие атрибуты:

• face вид шрифта;

• size размер шрифта;

• сolor цвет шрифта.

Ученица: Юриста Валерия представляет Web – страницу по теме: «Озёра Красноярского края».

Для перевода строки на странице HTML используется команда:

br

Чтобы разбить текст на абзацы, будем использовать команду:

Текст

Принято текст выравнивать по ширине. Вид выравнивания задаётся атрибутом align. Могут быть использованы следующие виды выравнивания для текста:

• justify по ширине;

• left по левому краю;

• right по правому краю;

• center по центру.

В отличие от команды br между абзацами будет пропущена пустая строка.

Вставка графических изображений

IMG SRC=“имя файла. расширение“

вставка картинки из файла.

4.Закрепление пройденного материала.

Практическая работа в электронном виде. При выполнении практической работы будет использоваться работа консультантов (Котенев А., Шамов Р., Юриста В., Саломоник А.)

5. Подведение итогов, оценивание учащихся.

Итак, на сегодняшнем уроке вы создавали Web - страницы.

Учитель: С какого парного тега начинается основная структура HTML – документа?

Ученик: С парного тега L.

Учитель: Между какими парными тегами располагается сам Web – документ?

Ученик: Между тегами BODY.

Учитель: Какая команда служит для задания шрифта на странице HTML документа? Учитель: команда font.

Оценивание.

Домашнее задание: Выучить основную структуру HTML – документа.

(Основная структура HTML – документа начинается с парного тега L. Который обозначает, что мы создаём Web – страницу, с помощью языка разметки гипертекста HTML. В парных тегах существуют: открывающий и закрывающие теги. Их отличие состоит в том, что в закрывающем теги мы используем слеш. Cам Web документ располагается между парными тегами BODY.

Чтобы задать фон Web – страницы используется Атрибут BACKGROUND

Например:

BODY BACKGROUND = “имя файла.расширение”

Позволяет использовать в качестве фона изображение из файла.

Для задания шрифта на странице документа HTML служит команда font:

face = "Monotype Corsiva" size = 7 color =yellow

текст

В этой команде могут использоваться следующие атрибуты:

• face вид шрифта;

• size размер шрифта;

• сolor цвет шрифта.

Для перевода строки на странице HTML используется команда:

br

Чтобы разбить текст на абзацы, будем использовать команду:

Текст

Принято текст выравнивать по ширине. Вид выравнивания задаётся атрибутом align. Могут быть использованы следующие виды выравнивания для текста:

• justify по ширине;

• left по левому краю;

• right по правому краю;

• center по центру.

В отличие от команды br между абзацами будет пропущена пустая строка.

Вставка графических изображений

IMG SRC=“имя файла. расширение“

вставка картинки из файла.