Добавить материал и получить бесплатное свидетельство о публикации в СМИ
Эл. №ФС77-60625 от 20.01.2015
Инфоурок / Информатика / Конспекты / Открытый урок по информатике на тему "Создание связанных Web-страниц средствами языка HTML"

Открытый урок по информатике на тему "Создание связанных Web-страниц средствами языка HTML"

  • Информатика

Поделитесь материалом с коллегами:

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


Тема урока «Создание связанных Web-страниц средствами языка HTML»

Цели урока:

  • закреплять и систематизировать знания, умения и навыки форматирования текста и вставки графических объектов при создании Web-страниц средствами языка HTML;

  • развивать познавательный интерес, логическое мышление, творческую активность при выполнении практических заданий;

  • воспитывать внимательность, усидчивость, информационную культуру обучающихся;

  • закрепить на представляемом материале знания по географии о природных зонах России (установить межпредметные связи).


Оборудование: текстовый редактор Блокнот, браузер Internet Explorer, доска, компьютер, компьютерная презентация, папка общего доступа с заготовками для создания страницы(графические изображения для фона, текст в формате MS Word); файл, содержащий страницу, созданную на прошлом уроке, карточки с практической работой.


План урока:
I. Организационный момент. (1 мин)
II. Актуализация знаний. (12 мин)
III. Теоретическая часть. (12 мин)
IV. Д/з (2 мин)

V. Физкультминутка (3 мин)

VI. Практическая часть. (15 мин)

VII. Итог урока. Рефлексия. (5мин)


Ход урока:

I. Орг. момент.
Приветствие, проверка присутствующих. Объяснение хода урока.


II. Актуализация знаний.
Как видно из текста на слайде (Слайд 1), сегодня мы с вами продолжаем знакомиться с основными приемами разработки
Web-страницы с применением языка гипертекстовой разметки HTML. На прошлых уроках вы уже создавали свои странички, применяя различные стили форматирования текста и добавляя на них графические объекты. Давайте с вами вспомним основные понятия, пройденные нами ранее.

  1. Что такое Web-сайт? (Web-сайт - группа Web-страниц, принадлежащих одному автору или одному издателю и взаимосвязанных общими гиперссылками, образующих структуру)

  2. С помощью какого языка создаются Web-страницы? (Языка Hyper Text Markup Language - HTML)

  3. С помощью каких технологий можно создавать сайты? (Сайты могут быть созданы при помощи любого текстового редактора или специализированных HTML-редакторов. Выбор редактора, который будет использоваться для создания HTML-документов, зависит исключительно от понятия удобства и личных пристрастий каждого автора)

  4. Как называются управляющие команды, заключенные в угловые скобки, задающие вид web-страницы? (Теги)

  5. Какие виды тегов вам известны? (Парные и одиночные)

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


Вольф Анне было задано индивидуальное задание, заключающееся в разработки Web-сайта, содержащего тестирование по теме «Основы языка гипертекстовой разметки HTML».


А теперь вам предлагается выполнить следующее задание. Необходимо Исправьте ошибки, допущенные в программном коде:


Информатика < TITLE>

NG="center">

Файлы и файловая система

D>

;

Файл - это определенное количество информации (программа или данные), имеющее имя и хранящееся в долговременной памяти.

Файловая система - это часть операционной системы, назначение которой состоит в том, чтобы обеспечить пользователю удобный интерфейс при работе с данными, хранящимися на диске, и обеспечить совместное использование файлов несколькими пользователями и процессами. <>

FONT><FONT FACE=рисунок.png" ALIGN="right">

Программы

BODY>

HTML


Посмотрите внимательно на программный код и скажите, все ли использованные теги вам известны?

Что еще нужно научиться делать, чтобы создать полноценный сайт? (Научиться делать гиперссылки)


III. Теоретическая часть.

Вот мы и подошли к теме урока «Создание гиперссылок на Web-страницах»

Гиперссылка - это ссылка, расположенная в тексте страницы сайта и дающая возможность перехода на другую страницу или ресурс.

На Web- страницу гиперссылки размещаются с помощью тега:

<A href=“адрес перехода”>текст-ссылкаA>

Если Web- страница размещена на локальном компьютере в одной папке вместе с Web- страницей, то вместо адреса указывается имя файла.

href=“FileName.htm”>текст-ссылка

Если в Интернете, то прописываем полностью Интернет-адрес.

<A href=“http://www.server.ru/Web-сайт/FileName.htm”>текст-ссылкаA>


Во время практической части урока мы будем учиться создавать гиперссылки на Web-страницах. А сейчас немного расслабимся и проведем зарядку для глаз.


IV. Физкультминутка.

Зарядка для глаз: ребята встаньте, пожалуйста,  и выполните упражнения

  1. Упражнение выполняется только глазами. Посмотрите вверх, влево, вниз, вправо. Повторить еще 2 раза

  2. Зажмурили сильно глаза, окрыли, удивились! Повторить еще 2 раза

  3. Упражнение «ракушка»: помассировали ушки, немного потянули и прижали и отжали

  4. Ленивая восьмерка: вытянули левую руку перед собой и смотрим на большой палец. Начинаем движение в левый верхний угол. Рисуем рукой ленивую восьмерку – знак бесконечности, а за движением руки смотрим глазами до ощущения «хватит». Повторить аналогично правой рукой. Продолжить двумя руками.

  5. Посадили на нос воображаемую бабочку и начинаем рисовать глазами туже восьмерку влево вверх


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

1. Выучить параграф 3.7.5.

2. Найти информацию о природных зонах России: тайга, степь и лесостепь.


VI. Практическая часть.


Практическая работа по теме

«Создание связанных Web-страниц средствами языка HTML»


Цель работы: научиться создавать Web-сайты с использованием языка разметки текста HTML в простейшем текстовом редакторе Блокнот.


Ход работы:

  1. Откройте текстовый редактор Блокнот.

  2. Создайте Web-страницу «Арктика», разместив на ней текст из файла Тексты для сайта (Рабочий стол\Практическая работа\Тексты для сайта.doc). Для этого в Блокноте введите следующий программный код:

Арктика

арктика.jpg" text="#0000AA" top; ">

Арктика

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

Среди полярных льдов и ледников встречаются своеобразные оазисы растительности — на небольших изолированных участках растут накипные мхи и лишайники, а также осоки и некоторые злаки.


В условиях арктической пустыни встречаются и

некоторые виды цветковых растений: полярный мак, лисохвост, лютик, камнеломка и др.

Из животных здесь обитают лемминг, песец и белый медведь. На скалистых берегах летом гнездятся морские птицы, образуя «птичьи базары».

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

  2. Откроем начальную страницу сайта (файл Природа.htm). Далее необходимо установить ссылку из основного файла Природа.htm на вновь созданную страницу с помощью тэга A с атрибутом HREF, который мы сегодня рассмотрели. Для страницы «Арктика» это выглядит так:

арктика.htm" style="color:#0000FF"> Арктика

  1. Сохраните изменения в файле Природа.htm выполнив команду [Файл-Сохранить].

  2. Посмотрите получившуюся Web-страницу в браузере.

  3. Создайте Web-страницу «Тундра» аналогично Web-страницу «Арктика», выполнив пункты № 2 – 5.


VII. Итог урока.

- Что нового узнали на уроке?

Рефлексия.

Выставление оценок.





Автор
Дата добавления 09.10.2015
Раздел Информатика
Подраздел Конспекты
Просмотров536
Номер материала ДВ-045873
Получить свидетельство о публикации
Похожие материалы

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