1516995
столько раз учителя, ученики и родители
посетили официальный сайт проекта «Инфоурок»
за прошедшие 24 часа
Добавить материал и получить бесплатное
свидетельство о публикации
в СМИ №ФС77-60625 от 20.01.2015
Инфоурок Информатика КонспектыКонспект урока на тему "Основы HTML"

Конспект урока на тему "Основы HTML"

IV Международный дистанционный конкурс «Старт» Идёт приём заявок Для дошкольников и учеников 1-11 классов 16 предметов ОРГВЗНОС 25 Р. ПОДАТЬ ЗАЯВКУ
библиотека
материалов

Тема: Основы HTML.


Цель: Познакомить учащихся со структурой HTML-документа.


Задачи:

  1. формировать умение создавать простейший HTML-документ, используя редактор текста;

  2. развивать внимание, творческие способности обучающихся;

  3. воспитывать умение работать самостоятельно.


План:

  • Орг. Момент, вступительное слово;

  • Основной этап: раскрытие темы;

  • Подведение итогов, заключение.

Этапы, время.

Деятельность учителя

Деятельность учеников

Орг-ый:

Здравствуйте ребята!

Сегодня мы начнем изучать новый раздел – основы HTML.

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

HTML-документа.

Внимательно слушают


Основной

- Начнем с того что же такое HTML.

HTML (Hyper Text Markup Languger) – язык гипертекстовой разметки, т.е. – это специальные инструкции к браузеру с помощью которых создаются

веб-страницы.

- Специальные программы к браузеру называются тегами

(<тег>…. тег>). Тэг – это команда языка HTML, которую выполняет браузер.

- Тип файла (расширение) — *.htm или *.html.

- Имя файла HTML-документа не должно содержать кириллицу (т.е. русские буквы), пробел (вместо пробела рекомендуется использовать либо тире, либо знак подчеркивания).

- Теперь рассмотрим структуру документа. Запишите в тетрадях: Структура документа:

  1. начало документа;

  2. <head> начало страницы (голова программы);

  3. название страницы ;

  4. тело документа.






- Сейчас запишите структура :



Background=” имя рисунка”>


Link= цвет гиперссылки

Vlink= цвет активной гиперссылки

Alink= цвет гиперссылки

VLINK=green>

- Название цвета можно писать как по английски, так же можно использовать шестнадцатеричные коды.

- При выборе картинки в качестве фона нужно учитывать, чтобы выбираемый цвет фона сочетался с текстом.

- Существует всего 6 уровней заголовочного шрифта.

Им соответствуют теги <H1>,<H2>, <H3>, <H4>, <H5>,

<H6>. Первый уровень самый крупный. Если вы хотите выбрать другой уровень, то тег нужно закрыть H1>.


- Запишите след.заголовок: Тэги форматирования:

абзац

(лево) >

Center ( по центру)

Right ( по правой стороне)

Justify ( по ширине)

<BR> принудительный разрыв строки

цвет face=”название шрифта”>

после чего нужно закрыть FONT>


жирный

<I> курсив I>

<U> подчеркнутый U>

<S> зачеркнутый S>

<center> центрированный center>

<sup> верхний индекс sup>

<sub> нижний индекс sub>

<HR> разделитель, горизонтальная линия идущая через весь экран.

20 сл.



…. MARQUEE> бегущая строка

<BIG>….BIG> текст будет отображаться шрифтом чуть большего размера, чем основной.

<SMALL>….<SMALL> текст будет отображаться шрифтом чуть меньшего размера, чем основной.


- И последний тег - вставка рисунков:

<IMG SRC=”имя.jpgALT=”имя”>

- Форматы картинок вставляются следующее: .jpg ,

. gif , .bmp.

- Теги должны располагаться строго один внутри другого по принципу хорошо вам известной матрешки.

Например:

Верная запись Неверная

… …

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

Запускаем Блокнот и составляем структуру HTML-документа.


2 урок

- Садитесь за компьютеры и создайте HTML-документ.

Для начала создайте свою папку. Затем откройте блокнот и сохраните его как HTML-документ. Чтобы просмотреть затем снова блокнот, нужно правой кнопкой мыши нажать и выбрав «открыть с помощью блокнота» или

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

Практическое задание

1. Разбейте приведенное ниже стихотворение по строчкам.

2. Измените, цвет текста по строчкам стихотворения, а так же измените размер каждой строчки стихотворения.

3. Измените фон страницы.

4. Добавьте название стихотворения, а именно МИШКА.

5. Измените размер шрифта (заголовка) названия стихотворения МИШКА.

6. Используйте все теги форматирования и выравнивания.

7. Вставьте рисунки между столбцами.


Раз морозною зимой

Вдоль опушки лесной

Шел медведь к себе домой

В толстой шубе меховой.


Шел он, шел к своей берлоге

По проселочной дороге

И, шагая через мост,

Наступил лисе на хвост.


Подняла лисица крик.

Зашумел темный лес,

И медведь с испуга вмиг

На сосну большую влез.




На сосне веселый дятел

Белке домик конопатил.

Промолвил: «Ты, медведь,

Должен под ноги смотреть!»


С той поры медведь решил,

Что зимой надо спать,

По тропинкам не гулять,

На хвосты не наступать.


Он в берлоге безмятежно

Спит зимой под крышей снежной

И доволен неспроста

Что родился без хвоста.



записывают











































записывают


























































Выполняют за компьютерами

Завершающий

Дома почитайте параграф 29. Всем спасибо. Досвиданья.



Подпись учителя______________

Курс профессиональной переподготовки
Учитель информатики
Курс профессиональной переподготовки
Учитель математики и информатики
Найдите материал к любому уроку,
указав свой предмет (категорию), класс, учебник и тему:
также Вы можете выбрать тип материала:
Краткое описание документа:

HTML это стандартный язык разметки документов во Всемирной паутине. Все веб- страницы создаются при помощи языка HTML (или XHTML). Язык HTML интерпретируется браузером и отображается в виде документа, удобном для
человека.

Изначально язык HTML был задуман и создан как средство структурирования и форматирования документов без их привязки к средствам воспроизведения (отображения). В идеале, текст с разметкой HTML должен был без искажений воспроизводиться на оборудовании с различной технической оснащённостью.

Язык HTML был разработан британским учёным Тимом Бернерсом-Ли приблизительно в 19861991 годах в стенах ЦЕРНа в Женеве в Швейцарии. HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области вёрстки. HTML успешно справлялся с проблемой сложности SGML путём определения небольшого набора структурных и семантических элементов — дескрипторов. Дескрипторы также часто называют «тегами». С помощью HTML можно легко создать относительно простой, но красиво оформленный документ. Помимо упрощения структуры документа, в HTML внесена поддержка гипертекста.

Общая информация
ВНИМАНИЮ УЧИТЕЛЕЙ: хотите организовать и вести кружок по ментальной арифметике в своей школе? Спрос на данную методику постоянно растёт, а Вам для её освоения достаточно будет пройти один курс повышения квалификации (72 часа) прямо в Вашем личном кабинете на сайте "Инфоурок".

Пройдя курс Вы получите:
- Удостоверение о повышении квалификации;
- Подробный план уроков (150 стр.);
- Задачник для обучающихся (83 стр.);
- Вводную тетрадь «Знакомство со счетами и правилами»;
- БЕСПЛАТНЫЙ доступ к CRM-системе, Личному кабинету для проведения занятий;
- Возможность дополнительного источника дохода (до 60.000 руб. в месяц)!

Пройдите дистанционный курс «Ментальная арифметика» на проекте "Инфоурок"!

Подать заявку
IV Международный дистанционный конкурс «Старт» Для дошкольников и учеников 1-11 классов Рекордно низкий оргвзнос 25 Р. 16 предметов ПОДАТЬ ЗАЯВКУ
Оставьте свой комментарий
Авторизуйтесь, чтобы задавать вопросы.