kopilkaurokov.ru - сайт для учителей

Создайте Ваш сайт учителя Курсы ПК и ППК Видеоуроки Олимпиады Вебинары для учителей

  1. Главная
  2. Информатика
  3. Презентации
  4. «Web – технологии. Основы языка HTML »

«Web – технологии. Основы языка HTML »

Нажмите, чтобы узнать подробности

Большинство  информационных  ресурсов  сети  Интернет  представлено  в виде  веб-страниц,  которые  объединяются  в  веб-сайты.  Благодаря  развитию телекоммуникационных  технологий  размещенная  на  веб-страницах информация доступна множеству людей. В отличие от бумажных носителей, например, книг, она может оперативно изменяться и практически мгновенно доставляться в любое место по запросу пользователя. 

Данная презентация сопровождает лекцию в 9 классе по теме "Основы языка HTML". Урок направлен на формирование понятий и знаний о  HTML - документе, о структуре Web траницы, на освоение правил записи тэгов  HTML - документа.

Презентация содержит теоретический материал теоретический материал, примеры HTML - документа, практические дадания.

Аудитория 9 класс

Учитель МБОУ СОШ № 55 городского округа Самара   Тимакова Татьяна Александровна

Вы уже знаете о суперспособностях современного учителя?
Тратить минимум сил на подготовку и проведение уроков.
Быстро и объективно проверять знания учащихся.
Сделать изучение нового материала максимально понятным.
Избавить себя от подбора заданий и их проверки после уроков.
Наладить дисциплину на своих уроках.
Получить возможность работать творчески.

Просмотр содержимого документа
««Web – технологии. Основы языка HTML »»

Муниципальное бюджетное общеобразовательное учреждение средняя общеобразовательная школа № 55 городского округа Самара «Web – технологии. Основы языка HTML » Учитель информатики МБОУ СОШ № 55 Тимакова Татьяна Александровна 5 марта 2015 г.

Муниципальное бюджетное общеобразовательное учреждение

средняя общеобразовательная школа № 55 городского округа Самара

«Web – технологии.

Основы языка HTML »

Учитель информатики МБОУ СОШ № 55

Тимакова Татьяна Александровна

5 марта 2015 г.

Основы языка HTML Лекция Тимакова Т.А.«Web – технологии как инструмент образовательного процесса» 1

Основы языка HTML

Лекция

Тимакова Т.А.«Web – технологии как инструмент образовательного процесса» 1

Понятие гипертекста Создание Web-сайтов реализуется с использованием специального языка гипертекстовой разметки – HTML (Hyper Text Markup Language). Термин

Понятие гипертекста

Создание Web-сайтов реализуется с использованием специального языка гипертекстовой разметки – HTML (Hyper Text Markup Language).

Термин "гипертекст" впервые был введён

Тедом Нельсоном в 1969 году.

Гипертекст – электронный иерархический документ, содержащий в себе ссылки на другие документы (ресурсы).

Тимакова Т.А. «Web – технологии как инструмент образовательного процесса» 2

Главные причины популярности HTML: HTML текст – это обычный текстовый файл в формате ASCII Открытый код Отсутствие необходимости сжатия данных. Простота. Переносимость. Иерархичность (связность) документов (ресурсов) Наличие гиперссылок – основа для «плетения паутины» Интернет. 8. HTML-документ – это гипертекст. Тимакова Т.А. «Web – технологии как инструмент образовательного процесса» 3

Главные причины популярности HTML:

  • HTML текст – это обычный текстовый файл в формате ASCII
  • Открытый код
  • Отсутствие необходимости сжатия данных.
  • Простота.
  • Переносимость.
  • Иерархичность (связность) документов (ресурсов)
  • Наличие гиперссылок –

основа для «плетения паутины»

Интернет.

8. HTML-документ –

это гипертекст.

Тимакова Т.А. «Web – технологии как инструмент образовательного процесса» 3

Тимакова Т.А. «Web – технологии как инструмент образовательного процесса» 3

Тимакова Т.А. «Web – технологии как инструмент образовательного процесса» 3

World Wide Web и ее место в мировой сети Сеть W orld W ide W eb представляет собой глобальный мировой ресурс информации, доступ к которому открыт для всех пользователей Интернет Приложения Microsoft Office позволяют сохранять текстовые документы, электронные таблицы, реляционные БД, презентации в формате Web-страницы Тимакова Т.А. «Web – технологии как инструмент образовательного процесса» 3

World Wide Web и ее место в мировой сети

Сеть W orld W ide W eb представляет собой глобальный мировой ресурс информации, доступ к которому открыт для всех пользователей Интернет

Приложения Microsoft Office позволяют сохранять текстовые документы, электронные таблицы, реляционные БД, презентации в формате Web-страницы

Тимакова Т.А. «Web – технологии как инструмент образовательного процесса» 3

Браузеры – универсальное клиентское приложение для Web-сервера Тимакова Т.А. «Web – технологии как инструмент образовательного процесса» 4

Браузеры – универсальное клиентское приложение для Web-сервера

Тимакова Т.А. «Web – технологии как инструмент образовательного процесса» 4

Единый интерфейс представителей программ одного класса – одна из фундаментальных основ ИТ Тимакова Т.А.«Web – технологии как инструмент образовательного процесса» 5

Единый интерфейс представителей программ одного класса – одна из фундаментальных основ ИТ

Тимакова Т.А.«Web – технологии как инструмент образовательного процесса» 5

Понятие «тег» HTML-документ – это обычный текстовый документ, содержащий специальные разметочные указатели (тэги) . Тег (иногда тэг , англ.  tag  — «ярлык, этикетка, бирка; метить») — метка как ключевое слово, в более узком применении идентификатор для категоризации, форматирования, описания, поиска данных и задания внутренней структуры. HTML - файл имеет расширение .htm или .html Тимакова Т.А. «Web – технологии как инструмент образовательного процесса» 6

Понятие «тег»

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

Тег (иногда тэг , англ.  tag  — «ярлык, этикетка, бирка; метить») — метка как ключевое слово, в более узком применении идентификатор для категоризации, форматирования, описания, поиска данных и задания внутренней структуры.

HTML - файл имеет расширение .htm или .html

Тимакова Т.А. «Web – технологии как инструмент образовательного процесса» 6

ПРАВИЛА ЗАПИСИ ТЭГОВ Тэги всегда заключаются в угловые скобки (т.е. ВСЕГДА начинается со знака «меньше» и оканчивается знаком «больше» Например: ( новая строка, непарный тег) Непарный (одиночный) открывающий ТЕГ парный (контейнер) закрывающий Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 7

ПРАВИЛА ЗАПИСИ ТЭГОВ

Тэги всегда заключаются в угловые скобки (т.е. ВСЕГДА начинается со знака «меньше» и оканчивается знаком «больше» Например: ( новая строка, непарный тег)

Непарный (одиночный)

открывающий

ТЕГ

парный

(контейнер)

закрывающий

Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 7

Структура HTML - страницы начало контейнера HTML-документа начало контейнера заголовка начало контейнера строки – названия страницы … строка названия страницы конец контейнера строки – названия страницы конец контейнера заголовка начало контейнера тела страницы … тело (всё содержимое) страницы конец контейнера тела страницы конец контейнера HTML-документа Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 8

Структура HTML - страницы

начало контейнера HTML-документа

начало контейнера заголовка

начало контейнера строки – названия страницы

…

строка названия страницы

конец контейнера строки – названия страницы

конец контейнера заголовка

начало контейнера тела страницы

…

тело (всё содержимое) страницы

конец контейнера тела страницы

конец контейнера HTML-документа

Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 8

Комментарии - такой полутэг используется для добавления комментариев на страничке, т. е. для полезных пояснений, которые не «транслируются» браузером. Пример: Заголовок Подзаголовок Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 9

Комментарии

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

Пример:

Заголовок

Подзаголовок

Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 9

ПРИМЕР HTML-ДОКУМЕНТА Моя первая HTML-страничка! Это моя первая проба сил в Web-дизайне. Может быть, страничка пока еще получилась не очень красивой, но ведь она работает!!! Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 10

ПРИМЕР HTML-ДОКУМЕНТА

Моя первая HTML-страничка!

Это моя первая проба сил в Web-дизайне.

Может быть, страничка пока еще получилась

не очень красивой, но ведь она работает!!!

Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 10

Создайте свой сайт Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 11

Создайте свой сайт

Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 11

Практическая работа Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 12

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

Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 12

Практическая работа Упражнения для самостоятельной работы Задание 1. «Личная папка» . Создать личную папку в доступном разделе локального компьютера Задание 2. «Структура HTML-страницы». Создать простейшую страницу со значение тега title = « Моя первая страничка» и телом страницы с текстом: «Оказывается, HTML – форматирование не такая уж и сложная вещь! ….». Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 13

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

Упражнения для самостоятельной работы

Задание 1. «Личная папка» . Создать личную папку в доступном разделе локального компьютера

Задание 2. «Структура HTML-страницы». Создать простейшую страницу со значение тега title = « Моя первая страничка» и телом страницы с текстом: «Оказывается, HTML – форматирование не такая уж и сложная вещь! ….».

Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 13

Домашнее задание «Работа с таблицами». Создать таблицу по образцу В этой ячейке можно разместить заголовок сайта В этой ячейке можно разместить новости А в этой ячейке можно разместить меню сайта Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 14

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

«Работа с таблицами». Создать таблицу по образцу

В этой ячейке можно разместить заголовок сайта

В этой ячейке можно разместить новости

А в этой ячейке можно разместить меню сайта

Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 14

Спасибо за работу До новых встреч! Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 14

Спасибо за работу

До новых встреч!

Тимаковы Т.А. «Web – технологии как инструмент образовательного процесса» 14


Получите в подарок сайт учителя

Информатика 10 класс (Россия)

Увлекательная информатика

Информатика 7 класс ФГОС

Информатика и ИКТ 11 класс (к учебнику...

Электронная тетрадь по информатике 8...

Информатика 5 класс ФГОС

Информационная безопасность

Основы алгоритмизации и...

Предмет: Информатика

Категория: Презентации

Целевая аудитория: 9 класс.
Урок соответствует ФГОС

Скачать
«Web – технологии. Основы языка HTML »

Автор: Тимакова Татьяна Александровна

Дата: 15.01.2016

Номер свидетельства: 277094

Похожие файлы

object(ArrayObject)#853 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(29) "Основы языка HTML "
    ["seo_title"] => string(18) "osnovy-iazyka-html"
    ["file_id"] => string(6) "154908"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(5) "uroki"
    ["date"] => string(10) "1421226441"
  }
}

object(ArrayObject)#875 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(158) "Методическая разработка урока по спец технологии по теме "Основы веб конструирования""
    ["seo_title"] => string(96) "mietodichieskaia-razrabotka-uroka-po-spiets-tiekhnologhii-po-tiemie-osnovy-vieb-konstruirovaniia"
    ["file_id"] => string(6) "266514"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(5) "uroki"
    ["date"] => string(10) "1450178859"
  }
}

object(ArrayObject)#853 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(129) "Урок по информатике «Создание web-страниц с помощью HTML. Основы языка HTML»"
    ["seo_title"] => string(80) "urok_po_informatikie_sozdaniie_web_stranits_s_pomoshch_iu_html_osnovy_iazyka_htm"
    ["file_id"] => string(6) "387969"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(5) "uroki"
    ["date"] => string(10) "1486296286"
  }
}

object(ArrayObject)#875 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(133) "Программа Предметного курса по выбору (информатика) 10 класс (профильный) "
    ["seo_title"] => string(73) "proghramma-priedmietnogho-kursa-po-vyboru-informatika-10-klass-profil-nyi"
    ["file_id"] => string(6) "111828"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(12) "planirovanie"
    ["date"] => string(10) "1407949651"
  }
}

object(ArrayObject)#853 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(105) "Поурочный план на тему "Назначение и основные понятия HTML" "
    ["seo_title"] => string(65) "pourochnyi-plan-na-tiemu-naznachieniie-i-osnovnyie-poniatiia-html"
    ["file_id"] => string(6) "229532"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(5) "uroki"
    ["date"] => string(10) "1441781830"
  }
}

Полезное для учителя




Распродажа видеоуроков!
1480 руб.
2110 руб.
1550 руб.
2220 руб.
Смотреть все комплекты
Курсы ПК и ППК для учителей!
Смотреть все курсы
ПОЛУЧИТЕ СВИДЕТЕЛЬСТВО МГНОВЕННО

Добавить свою работу

* Свидетельство о публикации выдается БЕСПЛАТНО, СРАЗУ же после добавления Вами Вашей работы на сайт

Удобный поиск материалов для учителей

Ваш личный кабинет

Восстановить пароль
Регистрация
Проверка свидетельства