пермаркет Знань>>Інформатика 8 клас>>Інформатика>> Інформатика: Поняття комп'ютерної графіки
План-конспект уроку з курсу «Інформатика 8 клас» з теми «Знакомство с языком разметки гипертекстовых документов HTML»
Тема: «Знакомство с языком разметки гипертекстовых документов HTML»
Цели урока:
• Обобщить знания по теме «Коммуникационные технологии»; • Научиться разрабатывать документы, предназначенные для публикации в; Интернете; • Отработать навыки редактирования веб-страниц в кодах HTML; • Восприятие компьютера как инструмента обработки и создания информационных объектов; • Формирование целостного восприятия окружающего мира.
Ход урока
I. Оргмомент. (проверка готовности учащихся класса и доски к уроку) II. Проверка знаний.
Тест по теме «Информационные технологии», с использование перфокарт 1. Интернет-адрес - это?
А) адрес сервера; Б) почтовый адрес; В) адрес Интернета; Г) адрес который имеет каждый компьютер подключенный к Интернету;
2. Интернет – это?
А) сводка меню программных продуктов; Б) документ в котором хранится вся информация по сети; В) глобальная компьютерная сеть, в которой локальные, региональные и корпоративные сети; соединены между собой многочисленными каналами передачи информации; Г) соединение нескольких компьютеров в одну локальную сеть.
3. Сервер – это?
А) сетевая программа, которая ведет диалог одного пользователя с другим; Б) мощный компьютер, к которому подключаются остальные компьютеры; В) компьютер отдельного пользователя, подключенный в общую сеть; Г) стандарт, определяющий форму представления и способ пересылки сообщения.
4. Модем – это?
А) мощный компьютер, к которому подключаются остальные компьютеры; Б) устройство, преобразующее цифровой сигналы компьютера в аналоговый телефонный сигнал и обратно; В)программа, с помощью которой осуществляется диалог между несколькими компьютерами; Г) персональная ЭВМ, используемая для получения и отправки корреспонденции.
5. Скорость передачи данных – это?
А) количество информации, передаваемой в одну секунду; Б) количество байт информации, передаваемой за одну минуту; В) количество байт информации, передаваемой с одного компьютера на другой; Г) количество битов информации, передаваемой через модем в единицу времени.
6. Адресация – это?
А) способ идентификации абонентов в сети; Б) адрес сервера; В)почтовый адрес пользователя в сети; Г) количество бод (символов/сек), пересылаемой информации Вашим модемом.
7. Локальные компьютерные сети – это?
А) сеть, к которой подключены все компьютеры Вашего села; Б) сеть, к которой подключены все компьютеры Вашей страны; В) сеть, к которой подключены компьютеры Вашего офиса, или кабинета информатики, или одного здания; Г) сеть, к которой подключены все компьютеры.
8. Сетевой адаптер – это?
А) специальная программа, через которую осуществляется связь нескольких компьютеров; Б) специальное аппаратное средство для эффективного взаимодействия персональных компьютеров сети; В) специальная система управления сетевыми ресурсами общего доступа; Г) система обмена информацией между различными компьютерами.
9. Домен – это?
А) часть адреса, определяющая адрес компьютера пользователя в сети; Б) название программы, для осуществления связи между компьютерами; В) название устройства, осуществляющего связи между компьютерами Г) единица измерения информации.
10. Всемирная паутина - это?
А) компьютер отдельного пользователя, подключенный в общую сеть; Б) перенесение информации с одного компьютера на другой с помощью дискет В) передача информации между пользователями о состоянии работы компьютера; Г) сотни миллионов Web-серверов Интернета, содержащих большое количество Web – страниц, в которых используется технология гипертекста.
(сразу проверяются работы и выставляются оценки)
III. Изучение нового материала.
(на доске новые ключевые термины: Тэги, браузеры, контейнеры)
Использование инструментальных средств создания Веб-страниц недостаточно, если мы хотим создать качественные по стилю и содержанию документы, предназначенные для публикации в сети Интернет. Часто приходится форматировать введенные данные непосредственно в Блокноте, где представлена программа языка гипертекстовой разметки HTML (Hyper Text Markup Language). Если даже нет необходимости создавать страницы на языке HTML надо знать основные тэги для внесения необходимых изменений в уже готовую программу.
Для работы с HTML документом необходимо пройти подготовительный этап:
1. Создать персональную папку, где обязательным требованием является использование для имени папки английские буквы; 2. Создать текстовой документ блокнот; 3. Открыть документ и сохранить его под новым именем с расширением html или htm. 4. Закрыть документ; 5. Открыть html –документ; 6. Открыть блокнот, выполнив команду Вид/в виде html.
В папке должны находится два
Текстовой файл можно будет удалить после создания html-документа. Основными элементами документа являются тэги (или дескрипторы).
Тэги – управляющие символы, которые определяют вид Web-страницы при её просмотре в браузере.
Браузерами называются специальные программы для просмотра и создания Web-страниц. (Примеры программ браузеров на стр. 189)
Контейнеры – это парные тэги содержащие открывающий и закрывающий тэг.
Каждый тэг ограничен угловыми скобками, и технология предполагает использование открытых и закрытых тэгов, указывающих на начало и конец форматирования определенного блока. Программа состоит из двух частей. В первой части задается заголовок страницы, которая отображается в заголовке окна и первая загружается, при просмотре страницы. Выбор названия заголовка имеет большое значение, т.к. именно по заголовку индексируется страница в поисковых системах. Название заголовка должно отражать суть информационного наполнения страницы.
(С помощью проектора на экран выводится общий вид программы)
Общий вид программы:
<html> <head> <title>Моя персональная страница</title> </head> <body> Моя страница </body> </html>
Основное содержание программы помещается между тэгами <body></body>. Рассмотрим основные тэги.
(Каждому ученику раздается данная таблица и проектируется на экран).
Таблица основных тэгов языка HTML
ТЭГИ
| НАЗНАЧЕНИЕ
|
<html></html>
| Указывает программе просмотра страниц, что это HTML документ. Данные тэги обрамляют документ
|
<head></head>
| Определяет место, где помещается различная информация, не отображаемая в теле документа. Здесь располагается тэг названия документа и тэги для поисковых машин
|
<title></title>
| Помещает название в оглавление программы просмотра страниц
|
<body></body>
| Определяет видимую часть документа
|
<body bgcolor=…>
| Устанавливает цвет фона документа, используя значение цвета в виде RRGGBB – пример: FF0000 – красный цвет
|
<body text=…>
| Устанавливает цвет текста документа, используя значение цвета в виде RRGGBB – пример: 000000 – черный цвет
|
<body link=…>
| Устанавливает цвет гиперссылок, используя значение цвета в виде RRGGBB – пример: 00FF00 – зеленый цвет
|
<body vlink=…>
| Устанавливает цвет гиперссылок на которых вы уже побывали, используя значение цвета в виде RRGGBB – пример: 333333 – серый цвет
|
<body alink=…>
| Устанавливает цвет гиперссылок при нажатии
|
Для создания своей первой страницы недостаточно знать основные тэги. Необходимо научиться форматировать текст соответствующим образом. Для этого используются тэги для форматирования текста. Они представлены в следующей таблице:
(Каждому ученику раздается данная таблица и проектируется на экран).
Таблица тэгов для форматирования текста
ТЭГИ
| НАЗНАЧЕНИЕ
|
<hl></hl> … <hl></hl>
| Задает размер заголовка
|
<pre></ pre >
| Обрамляет предварительно отформатированный текст
|
<b></b>
| Жирное начертание шрифта
|
<i></i>
| Начертание Курсив
|
<tt></tt>
| Имитация стиля печатной машинки
|
<cite></cite>
| Используется для цитат, обычно наклонный текст
|
<strong></ strong >
| Используется для выделения наиболее важных частей текста (наклонный и жирный текст)
|
<font size=…></font>
| Устанавливает размер текста в пределах от 1 до 7
|
<font color=…></font >
| Устанавливает цвет текста, используя значение цвета в виде
|
<p>
| Начало нового абзаца
|
<p align=…>
| Выравнивает абзац относительно одной из сторон документа, значения:
|
<br>
| Вставляет перевод строки
|
<blockquote> </ blockquote>
| Создает отступы с обеих сторон текста.
|
<ol></ol>
| Создает нумерованный список
|
<li>
| Определяет каждый элемент списка и присваивает номер
|
<ul></ul>
| Создает ненумерованный список
|
<a href=”URL”></a>
| Создает гиперссылку на другие документы или часть текущего документа
|
Тэги состоят из ключевых слов и могут быть дополнены атрибутами, разделенным пробелами. Описание атрибутов без использования ключевых слов не допускается
IV. Закрепление
Задания выводится на экран.
Задание 1.
Составить программу из готовых тэгов, вставив в неё заголовок страницы и содержание программы.
Задание 2.
Дана программа на языке HTML определите какие тэги в ней используются и каково их назначение <html> <head> <title>компьютер</title> </head> <body> <i>Компьютер и ПО </i> <p><b>комплектующие</b> </p> </body> </html>
Задание 3 (для более сильных учащихся)
Набрать данную программу в браузере Mozilla.
V. Домашнее задание: Практическое задание. Разработать страницу «Мое хобби» с использованием лишь тэгов для форматирования текста.
Виконав: вчитель інформатики СЗШ № 166 Солом’янського району м. Києва Мещерінов Володимир Володимирович
Предмети > Інформатика > Інформатика 9 клас > Поняття комп'ютерної графіки > Поняття комп'ютерної графіки. Конспект уроку і опорний каркас
|