Создание WEB – страниц в формате HTML
план-конспект урока по теме
Конспект урока Создание WEB – страниц в формате HTML. ЦЕЛИ УРОКА: познакомить студентов с основами HTML программирования, развивать знания студентов в области информационных технологий, оказать важность знаний и умений в сфере информационных компьютерных технологий.
Скачать:
Вложение | Размер |
---|---|
![]() | 63.9 КБ |
Предварительный просмотр:
Государственное автономное образовательное учреждение среднего профессионального образования Калининградской области |
КОНСПЕКТ УРОКА
Преподавателя информатики и ИКТ
Юдиной Людмилы Ильиничны
Тема: Создание WEB – страниц в формате HTML
Калининград 2013г.
ЦЕЛИ УРОКА:
1. Дидактическая: познакомить студентов с основами HTML программирования.
2. Развивающая: Развивать знания студентов в области информационных технологий.
3. Воспитательная: Показать важность знаний и умений в сфере информационных компьютерных технологий.
Вид занятий (тип урока): изучение нового материала.
Организационные формы обучения: лекция.
Вид и формы контроля знаний: фронтальный опрос.
Домашнее задание
Ход занятия
1. Организационный момент.
2. Сообщение темы и цели занятия.
3. Изучение нового материала.
4. Практическая работа
5. Подведение итогов занятия.
6. Домашнее задание.
ТРЕБОВАНИЯ К ЗНАНИЯМ И УМЕНИЯМ:
Студенты должны знать:
- что такое Web-страница;
- как менять фон Web-страницы;
- принципы построения Web-страницы;
- способы форматирования информации в Web-странице.
Студенты должны уметь:
- создавать простейшие Web-страницы;
- просматривать Web-страницы;
- вставлять информацию через буфер обмена;
- вставлять рисунки из файла;
- работать с таблицами;
- делать границы таблицы невидимыми;
ХОД УРОКА
Организационный момент
- Приветствие;
- проверка готовности студентов к уроку;
ОСНОВНЫЕ ПОНЯТИЯ
HTML
Термин HTML (HyperText Markup Language) означает язык маркировки гипертекстов. Первую версию HTML разработал сотрудник Европейской лаборатории физики элементарных частиц Тим Бернерс-Ли.
Прежде чем преступить к созданию своих Web – страниц необходимо познакомиться с основными понятиями и терминами данного раздела.
Сайт - это набор страниц в формате HTML которые лежат на Web – сервере.
Web – сервер – это постоянно подключенный к Интернету компьютер, который передает эти странички по запросу пользователей.
Web – узел – это намного больше чем совокупность Web – страниц. Это и система гиперссылок, связывающая узел в единое целое, и единое стилистическое оформление узла, и своевременное обновление находящейся информации на узле, и скорость загрузки отдельных страниц, и многое другое.
Домашняя страница – это Web – страница, которая передается сервером по запросу пользователя, указавшего в запросе имя Web, но не задавшего имени конкретной страницы.
Язык HTML расшифровывается как «язык гипертекстовой разметки».
Файл HTML – это обычный текстовый файл с расширение htm или html, содержащий текст страницы, который мы видим в нашем браузере, и некоторые управляющие записи – теги.
Интернет страницы можно создавать несколькими способами.
Мы рассмотрим первый способ создания при помощи программ Блокнот
и Internet Explorer.
Запустите программу блокнот и используя специальные коды – теги, запишите программный код для создания своей страницы (в ходе работы студенты пользуются инструкционной картой с тегами).
Обязательные тэги HTML
...
Метка должна открывать HTML-документ. Аналогично, метка должна завершать HTML-документ.
...
Эта пара меток указывает на начало и конец заголовка документа. Помимо наименования документа (см. описание метки
Все, что находится между метками
...
Эта пара меток указывает на начало и конец тела HTML-документа, каковое тело, собственно, и определяет содержание документа.
...
—...
Метки вида
(где i — цифра от 1 до 6) описывают заголовки шести различных уровней. Заголовок первого уровня — самый крупный, шестого уровня, естественно — самый мелкий.
Такая пара меток описывает абзац. Все, что заключено между
...
Такая пара меток описывает абзац. Все, что заключено между
и
, воспринимается как один абзац. Меткии
или
Пример программы записанной в блокноте:
КОЛЛЕДЖ СЕРВИСА И ТУРИЗМА
Внешний вид готового документа в Internet Explorer:
После того как программа была написана в Блокноте сохраняем файл с расширение html, закрываем. Открываем программу Internet Explorer – Файл – Открыть – ищем наш сохраненный текстовый документ – открываем.
могут содержать дополнительный атрибут ALIGN, например:
Выравнивание заголовка по центру
или
Образец абзаца с выравниванием по правому краю
Пример программы записанной в блокноте:
КОЛЛЕДЖ СЕРВИСА И ТУРИЗМА
Внешний вид готового документа в Internet Explorer:
После того как программа была написана в Блокноте сохраняем файл с расширение html, закрываем. Открываем программу Internet Explorer – Файл – Открыть – ищем наш сохраненный текстовый документ – открываем.
ИНСТРУКЦИОННАЯ КАРТА
Теги | Назначение |
Открытие и закрытие документа | |
Начало и конец заголовка | |
Начало и конец документа | |
Перевод строки | |
Горизонтальный разделитель | |
Выравнивание по центру | |
Адрес автора | |
Жирный шрифт | |
Курсив | |
Верхний индекс | |
Нижний индекс | |
Размер шрифта от 1 до 7 | |
Цвет шрифта | |
Гарнитур шрифта | |
| Создание маркированного списка |
| Создание нумерованного списка |
Вставка изображения | |
Фоновое изображение | |
Цвет фона | |
Цвет текста | |
Цвет присмотра ссылки | |
Цвет ссылки | |
Цвет активной ссылки |
ПРАКТИЧЕСКАЯ РАБОТА
Для закрепления темы студенты пробуют создать Web – страницы.
Темы выбираются произвольно.
ИТОГИ УРОКА
Закрепление материала:
- Сколько способов создания HTML – страниц Вы знаете, и какие?
- Какая функциональная кнопка изменяет вводимый текст в Internet Explorer?
- Какие правила дизайна необходимо соблюдать при создании HTML-документа?
- Какова последовательность действий при создании HTML-документа во FrontPage?
- Как осуществляется подготовка текста HTML-документа средствами FrontPage?
ДОМАШНЕЕ ЗАДАНИЕ
По теме: методические разработки, презентации и конспекты

Методические указания к лабораторным работам по созданию сайта "Основы использования HTML"
Все материалы для работы и выполнения контрольной находятся в папке HTML_met в архиве HTML_met.zip.Основная методичка называется Html_posobie.pdf...

План-конспект к открытому занятию «Создание Web-страницы с внутренними ссылками»
· План-конспект открытого занятия «Создание структуры навигации с внутренними ссылками на web-странице».Занятие явля...

Презентация к открытому занятию "Создание web-страницы с внутренними ссылками"
Презентация к открытому занятию "Создание web-страницы с внутренними ссылками" в формате PDF. Рассматривается последовательность создания кода меню с внутренними ссылками для перемещения по соде...

План-конспект открытого урока. Специальность 09.02.05 Прикладная информатика (по отраслям) Тема урока: «Создание сайта с использованием HTML + CSS»
Тема программы: «Создание гипертекстовых документов». Вид занятия: Урок учебной практике.Тип и вид урока: Комбинированный урок обучения умениям и навыка.Методы обучения: нагляд...

Информатика. 2 курс. Методические рекомендации к выполнению практической работы №90. Создание сайта с помощью языка гипертекстовой разметки HTML
Освоение приемов создания и сопровождения сайта...

Создание гиперссылок в HTML
Разработка урока по теме "Создание гиперссылок в HTML " с презентацией....

План-конспект учебного занятия по теме "Создание навигационных карт средствами HTML"
В документе представлен план учебного занятия и все необходимые для его проведения материалы...