Презентация к уроку по теме Способы создания сайтов. Понятие о языке HTML. Структура HTML-документа 10 класс (профильный)
Здравствуйте!
Вспомним…Определите понятие «Интернет»?Какие вы знаете службы сети Интернет?Какая из услуг Интернет является самой популярной?Как называют все документы службы WWW?Что такое Web-сайт?
Сайт – это группа взаимосвязанных Web-страниц. Каждая Web-страница представляет собой HTML-документ, т.е. документ, написанный в специальном формате HTML (HyperText Markup Language)
Тема урока: Способы создания сайтов. Понятие о языке HTML. Структура HTML-документа
HTML (HyperText Markup Language) – этоязык разметкигипертекста rrrrstyle.color
Язык разметки гипертекста HTML позволяет создавать Web-страницы, которые можно разместить в сети Интернет.
Для загрузки и просмотра веб-страниц используются специальные программы — браузеры (англ. browser).
Самые используемые веб-браузеры по состоянию на январь 2013Зелёный:Google ChromeСиний:Microsoft Internet ExplorerОранжевый:Mozilla FirefoxКрасный: Opera
ТЕГ - инструкция браузеру, указывающая способ отображения информации.
Атрибут - компонент тега, содержащий указания о том, как браузер должен воспринять и обработать тег. Синтаксис тега с атрибутом:<тег атрибут= “значение”>
ОДИНОЧНЫЙ (ПРИМЕР, <BR>- переход на новую строчку, <HR>-разделительная линия)ПАРНЫЙ (ПРИМЕР, <html> </html>, <body> </body> )
Контейнеры - это парные теги, содержащие открывающий и закрывающий тег.
Задание Даны теги, определить парные и одиночные теги: <H1> </H1>, <Br>, <Hr>, <Head> </Head>Теги пишутся с использованием, какого алфавита? При написании тегов используются только буквы?
СТРУКТУРНЫЕ ТЕГИ<html> </html> - начало и конец страницы<head> </head> - содержит теги со служебной информацией, например, тег <title> </title> - заголовок документа<body> </body> - непосредственное содержание документа.
Способы создания сайтов«ручное» написание кода на языке разметки гипертекста HTMLс помощью конструкторов сайтов (движков), размещенных в Интернете и доступных в режиме on-lineиспользование специальных программных продуктов
Конструктор сайтов – это система услуг, позволяющая пользователям создавать сайт из набора графических элементов и различных шаблонов отдельных модулей (панели навигации, ленты новостей, форм регистрации и т.д.)
Использование программных продуктов для создания и управления сайтом. Например, визуальные HTML-редакторы Microsoft Front Page, Macromedia Dreamweaver или профессиональные системы для разработки сайтов 1C-Битрикс, MODx и др.
Язык HTML является основой любого гипертекстового документа, даже если документ был создан в одном из конструкторов сайтов или визуальном редакторе. Просто в этом случае код на языке HTML генерируется автоматически либо движком, либо программой.
Знание языка HTML позволит лучше разобраться в структуре сайта и в случае необходимости внести в него коррективы вручную.
В каталоге «Мои документы» создайте папку SITE. Откройте текстовый редактор Блокнот (Пуск - Все программы - Стандартные) и наберите текст, представленный далее.
<HTML> <HEAD> <TITLE>Первое знакомство с тэгами HTML </TITLE> </HEAD> <BODY> Это моя первая WEB- страница </BODY></HTML>
Выполните команду [Файл - Сохранить]. В разделе Тип файла укажите «Все файлы». В разделе Имя файла укажите index.html. В качестве места сохранения выберите папку SITE. Нажать кнопку «Сохранить». Запустите созданный и сохраненный файл (он должен запустится в браузере).
Для внесения изменений можно выделить (однократным нажатием левой кнопки мыши) созданный файл, и в контекстном меню (запускается однократным нажатием правой кнопки мыши) выбрать команду Открыть с помощью-Блокнот. После изменения или дополнения файл сохранить и заново запустить или просто обновить (если WEB-страница не была закрыта) в окне браузера.
Что нового узнали на уроке?Что такое HTML? Для чего он нужен?Что такое тег?Приведите примеры тегов…
Домашнее задание:Выучить конспект, читать параграф 4.3.1.; устно отвечать на вопросы со стр. 216-217