Конспект урока «Основы создания HTML - страниц» по информатике

Урок по теме «Основы создания HTML - страниц»

Урок № 3 «Создание и форматирование таблиц».

Тема урока: Создание и форматирование таблиц в НTML-документе.

Тип урока: урок-практикум.

Время проведения: третий урок, отведенный на изучение темы «Основы создания HTML - страниц » (ба­зовый курс 8 класс).

Формы организации учебной деятельности: индивидуальная.

Цели урока:

• повторить знания о способах создания WEB-страниц;

• изучить способы создания и форматирования таблиц с помощью НTML – кода;

• развитие познавательного интереса, творческой активности учащихся;

• развитие у школьников умения излагать мысли, моделировать ситуацию;

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

1. Воспитательная — развитие познавательного интереса, логического мышления.

2. Учебная — повторение знаний по теме, изучение нового материала.

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

Этапы урока:

1. постановка цели урока и мотивация учебной деятельности;

2. актуализация знаний по изучаемой теме;

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

4. практическое закрепление изученной темы;

5. подведение итогов урока.

Ход урока.

1. Организационная часть:

• приветствие;

• проверка отсутствующих.

2. Актуализация деятельности учащихся:

• объявление плана урока;

• повторение основных вопросов изученной темы (фронтальный опрос с дублированием основных моментов повторения на сладах презентации):

1. вопрос. Что такое HTML – документ?

Слайд презентации 1. HTML – документ - это файл, содержащий текст и команды форматирования, предназначенный для размещения на web-серверах в сети Интернет. HTML – документ создается с помощью языка гипертекстовой разметки или HTML – кода. Основным элементом разметки HTML – кода является ТЭГ. Тэги выделяются угловыми скобками и могут быть одиночными или парными. Тэги могут содержать внутри себя атрибуты, которые задают определенные параметры форматирования.

2. Вопрос. Какую структуру должен иметь HTML – документ?

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

Заголовок страницы помещается в парный тег Head>Head>, который в свою очередь содержит название страницы – парный тег title> title>, а так же одиночные служебные теги и BASE>. Отображаемое в браузере содержание страницы помещается внутри парного тэга body> body>.

3. Вопрос. С помощью, какой программы создается и просматривается HTML – документ?

HTML – код страницы может быть создан с помощью текстового редактора Блокнот в фале с расширеним .HTM или .HTML и затем просмотрен с помощью любого браузера. При внесении изменений в HTML – код страницы необходимо сохранить эти изменения в файле, а содержание браузера – обновить.

3. Объяснение нового материала: Создание и форматирование таблиц. (По презентации):

Слайд презентации 3. При работе с таблицами в офисных приложениях они у нас задаются количеством строк и столбцов. При создании таблицы с помощью HTML – кода порядок действий иной:

1. описание таблицы;

2. описание строки;

3. описание ячейки;

4. ввод текста ячейки

Слайд презентации 4. Вставка таблицы - парный тэг

По умолчанию текст выравнивается по левому краю, ширина столбца - по наиболее длинному элементу.

Слайд презентации 5. Атрибуты к тэгу

BORDER– толщина границы таблицы в пикселях;

WIDTH – ширина таблицы в пикселях или процентах, относительно окна браузера

Пример:

Слайд презентации 6. Вставка строки таблицы - парный тэг tr> tr>

Атрибуты:

Align = (left, center, richt) – горизонтальное выравнивание

Valign = bottom, middle, top) – вертикальное выравнивание

Пример:

tr>

Слайд презентации 7. Вставка ячейки таблицы - парный тэг

Атрибуты:

Align = (left, center, richt) – горизонтальное выравнивание

Valign = (bottom, middle, top) – вертикальное выравнивание

Пример:

Тема доклада

Слайд презентации 8. Пример кода таблицы:

№ пп

ФИО

Тема доклада

Демонстрация отображения полученной таблицы в браузере (гиперссылка на слайде № 8).

4. Практическое закрепление изученной темы: выполнение практической работы «Создание Web-страницы, содержащей таблицу». (Практическое задание и справочный материал по теме выдаются каждому ученику.) Время работы на компьютере 20минут.

2-я страница docl.html

Докладчики

Заголовок браузера

Список докладчиков | заголовок 2 уровня

№ п\п

ФИО	Тема доклада
1	Иванова Е.И.	«Этапы проектирования курса обучения»
2	Петрова Н.С.	«Гуманизация образовательного процесса»
3	Семенова Е.И.	«Методика преподавания программирования.

5. Подведение итогов урока. Итак, сегодня на уроке мы познакомились с приемами вставки в HTML-документ таблиц. Давайте повторим основные моменты новой темы.

• Назовите алгоритм вставки и форматирования таблиц.

• Назовите теги, которые мы использовали для создания таблицы.

• Назовите атрибуты, которые можно использовать при создании таблиц.

Выполненные вами работы будут проверены, оценки я объявлю на следующем уроке.

Какие будут вопросы по проведенному уроку.

Домашнее задание: Записать HTML- код страницы, содержащей таблицу из 5 столбцов и 3 строк. Для каждого столбца установите свое выравнивание текста.

<получить код>   

скачать материал

Скачивание материала начнется через 51 сек.

Нравится материал? Жми!

Твитнуть

---

Ещё документы из категории информатика:

Конспект урока по теме "Информатика"

Конспект урока на тему "Виды компьютерных сетей"

Конспект урока для 8 класса "Обработка текстовой информации. Ввод текста"

Урок по информатике в 5 классе по теме: «Метод координат»

Тест на тему «Архитектура персонального»

Разработка урока по кибербезопасности для учащихся коррекционной школы 8 вида

Тесты "Основы логики"

22573225452248822485224832246722458

X Код для использования на сайте:

Ширина блока px

Скопируйте этот код и вставьте себе на сайт

X

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

После чего кнопка «СКАЧАТЬ» станет доступной!

Кнопочки находятся чуть ниже. Спасибо!

Кнопки:

Скачать документ

КОНКУРСЫ по 27 ПРЕДМЕТАМ ВИДЕОУРОКИ на USB ВЕБИНАРЫ ДЛЯ УЧИТЕЛЕЙ