СДЕЛАЙТЕ СВОИ УРОКИ ЕЩЁ ЭФФЕКТИВНЕЕ, А ЖИЗНЬ СВОБОДНЕЕ

Благодаря готовым учебным материалам для работы в классе и дистанционно

Скидки до 50 % на комплекты
только до

Готовые ключевые этапы урока всегда будут у вас под рукой

Организационный момент

Проверка знаний

Объяснение материала

Закрепление изученного

Итоги урока

Презентация к уроку: "Инструменты создания информационных объектов для Интернета. Создание Web - страниц с помощью HTML"

Категория: Информатика

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

Презентация к уроку: "Инструменты создания информационных объектов для Интернета. Создание Web -  страниц с помощью HTML"

Просмотр содержимого документа
«Презентация к уроку: "Инструменты создания информационных объектов для Интернета. Создание Web - страниц с помощью HTML"»

Инструменты создания информационных объектов для Интернета. Создание Web - страниц с помощью HTML.

Инструменты создания информационных объектов для Интернета.

Создание Web - страниц с помощью HTML.

«План урока» Основные понятия языка гипертекстов.   Инструментарий для создания Web – страниц.   Структура Web – страницы.   Обязательные метки HTML.   Практическое задание.

«План урока»

  • Основные понятия языка гипертекстов.
  • Инструментарий для создания Web – страниц.
  • Структура Web – страницы.
  • Обязательные метки HTML.
  • Практическое задание.
Основные понятия языка гипертекстов Задание Даны теги, определить парные и одиночные   теги. Web – страницы находятся на Web – сервере.  Web – сервер  - компьютер в сети Internet, хранящий  Web-страницы и соответствующие программы для работы с ними. Информация на Web – сервере представлена в виде Web – сайта. Web – сайт  – это объединение Web – страниц одной темой.  ... ; ;  ... ;  ;     Основным понятием языка HTML является понятие тег.  ^ ТЕГ – инструкция браузеру,  указывающая способ отображения информации.

Основные понятия языка гипертекстов

Задание

Даны теги, определить парные и одиночные теги.

Web – страницы находятся на Web – сервере. Web – сервер - компьютер в сети Internet, хранящий Web-страницы и соответствующие программы для работы с ними.

Информация на Web – сервере представлена в виде Web – сайта.

Web – сайт – это объединение Web – страниц одной темой.

... ;
;

... ; ;

Основным понятием языка HTML является понятие тег.

^ ТЕГ – инструкция браузеру, указывающая способ отображения информации.

Инструментарий для создания Web – страниц.   1 .Любой браузер, т.е., программа, пригодная для просмотра HTML-файлов. 2.Любой редактор текстовых файлов, поддерживающий русский язык в выбранной Вами кодировке, вполне подойдет Notepad или обычная программа блокнот. 3. WYSIWYG редакторы. Программы для создания web – страниц и сайтов WYSIWYG редакторы (сокращение фразы « What You See Is What You Get» - «Что видишь, то и получаешь ») позволяют создавать web – страницы, даже ни имея никакого понятия о языке HTML, путем визуального редактирования на экране дисплея.   1 3 2

Инструментарий для создания Web – страниц.

1 .Любой браузер, т.е., программа, пригодная для просмотра HTML-файлов.

2.Любой редактор текстовых файлов, поддерживающий русский язык в выбранной Вами кодировке, вполне подойдет Notepad или обычная программа блокнот.

3. WYSIWYG редакторы. Программы для создания web – страниц и сайтов WYSIWYG редакторы (сокращение фразы « What You See Is What You Get» - «Что видишь, то и получаешь ») позволяют создавать web – страницы, даже ни имея никакого понятия о языке HTML, путем визуального редактирования на экране дисплея.

1

3

2

Структура Web – страницы. Обязательные метки HTML.

Структура Web – страницы.

Обязательные метки HTML.

Обязательные метки HTML.

Обязательные метки HTML.

п/п

1

Объяснение

...

2

Метка должна открывать HTML-документ. Аналогично, метка должна завершать HTML-документ.

...

3

4

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

...

Все, что находится между метками и , толкуется браузером как название документа. Netscape Navigator, например, показывает название текущего документа в заголовке окна и печатает его в левом верхнем углу каждой страницы при выводе на принтер. Рекомендуется название не длиннее 64 символов.

...

5

... — ...

6

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

Метки вида (где i — цифра от 1 до 6) описывают заголовки шести различных уровней. Заголовок первого уровня — самый крупный, шестого уровня, естественно — самый мелкий.

...

7

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

и

, воспринимается как один абзац. Метки и

могут содержать дополнительный атрибут ALIGN (читается "элайн", от английского "выравнивать"), например: Выравнивание заголовка по центру или

Образец абзаца с выравниванием по правому краю

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

Сохранение документа При сохранении необходимо давать название документу латинскими буквами и указывать расширение html. Например : stranica. Html В разделе «Тип файла» указать - все файлы

Сохранение документа

При сохранении необходимо давать название документу латинскими буквами и указывать расширение html.

Например : stranica. Html

В разделе «Тип файла» указать - все файлы

Практическая работа       Пример 2         Привет!   Это чуть более сложный пример HTML-документа   Теперь мы знаем, что абзац можно выравнивать не только влево,    но и по центру или по правому краю.

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

Пример 2 Привет!

Это чуть более сложный пример HTML-документа

Теперь мы знаем, что абзац можно выравнивать не только влево,

но и по центру

или по правому краю.

Домашнее задание Придумать оформление главной станицы на любую из тем: Мое любимое занятие (урок), Моя семья, Моя школа. Подобрать материал для страницы.

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

Придумать оформление главной станицы на любую из тем:

  • Мое любимое занятие (урок),
  • Моя семья,
  • Моя школа.

Подобрать материал для страницы.

Рефлексия Мне было легко ___________________________________ Мне было трудно ___________________________________ Я научился (научилася) ___________________________________

Рефлексия

Мне было легко

___________________________________

Мне было трудно ___________________________________

Я научился (научилася) ___________________________________

Спасибо за урок!

Спасибо за урок!