Теоретичний матеріал:
1. Підручник "Інформатика" (8 кл.) Автори: О. О. Бондаренко, В. В. Ластовецький, О. П. Пилипчук, Є. А. Шестопалов
2. https://sites.google.com/view/schoolratusha/%D0%BF%D1%80%D0%BE%D1%84%D1%96%D0%BB%D1%8C%D0%BD%D1%96-%D1%81%D0%BF%D0%B5%D1%86%D0%BA%D1%83%D1%80%D1%81%D0%B8/%D1%821-%D0%B2%D0%B5%D0%B1-%D1%82%D0%B5%D1%85%D0%BD%D0%BE%D0%BB%D0%BE%D0%B3%D1%96%D1%97/%D1%82%D0%B5%D0%BC%D0%B0-2-%D0%BF%D1%80%D0%BE%D0%B5%D0%BA%D1%82%D1%83%D0%B2%D0%B0%D0%BD%D0%BD%D1%8F-%D0%B2%D0%B5%D0%B1-%D1%81%D1%82%D0%BE%D1%80%D1%96%D0%BD%D0%BE%D0%BA-%D0%BE%D1%81%D0%BD%D0%BE%D0%B2%D0%B8-html-%D1%82%D0%B0-css/2-1-%D0%BC%D0%BE%D0%B2%D0%B0-%D0%B3%D1%96%D0%BF%D0%B5%D1%80%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%BE%D0%B2%D0%BE%D1%97-%D1%80%D0%BE%D0%B7%D0%BC%D1%96%D1%82%D0%BA%D0%B8-%D0%B3%D1%96%D0%BF%D0%B5%D1%80%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%BE%D0%B2%D0%B8%D0%B9-%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82-%D1%82%D0%B0-%D0%B9%D0%BE%D0%B3%D0%BE-%D0%B5%D0%BB%D0%B5%D0%BC%D0%B5%D0%BD%D1%82%D0%B8
Конструктор уроків
- Всеосвіта›
- Бібліотека уроків›
- Інформатика›
- Мова гіпертекстової розмітки
Урок:
Мова гіпертекстової розмітки
14.10.2024
Вміст уроку:
1
2
3
1
Опрацюйте теоретичний матеріал:
Звичайний текст можна пристосувати для відображення браузером за допомогою спеціальних позначок — тегів, сукупність яких разом із правилами їх використання називають мовою розмітки гіпертексту.
HTML (англ. HyperText Markup Language — мова розмітки гіпертексту) — це набір тегів та правила їх застосування для створення гіпертекстових документів.
Вебсторінка — це текстовий документ, розмічений тегами HTML, відображений у вікні браузера.
HTML не є мовою програмування.
HTML-документ (HTML-файл) є текстовим документом, тому створити його можна в будь-якому текстовому редакторі.
Наприкінці 1991 року Тім Бернерс-Лі опублікував перший загальнодоступний опис мови розмітки HTML, відомий як документ «HTML-теги». В ньому були описані 20 елементів відносно простої схеми розмітки HTML.
Тім Бернерс-Лі (нар. 8 червня 1955, Лондон) — британський спеціаліст з інформатики, творець HTTP, HTML, URI і автор інших розробок в галузі інформаційних технологій, засновник та голова консорціуму W3C, головний розробник Всесвітньої павутини (спільно з Робертом Кайо), автор концепції семантичної павутини. Лауреат премії Тюрінга 2016 року.
Тег — це записана в кутових дужках < > позначка мови HTML, яку опрацьовує браузер.
Структуру HTML-документа визначають такі теги:
<html> | Початок документа |
<head> | Початок заголовка — службової частини коду |
<title> | Назва, що виводитиметься на вкладці браузера |
</title> | Кінець назви |
</head> | Кінець заголовка |
<body> | Початок «тіла» документа, яке виводить браузер |
</body> | Кінець «тіла» документа |
</html> | Кінець документа |
Приклад:
Один із варіантів структури вебсторінки:
Контейнери — це парні теги.
Контейнери позначають початок і кінець області дії відповідної вказівки. Між цими тегами може міститися текст та інші теги. Тег, що закриває область дії, порівняно з тим, що відкриває, має додаткову косу риску одразу після «кутової» дужки.
Oпис властивостей контейнера записують у першому дескрипторі контейнера через пропуск після назви контейнера або з нового рядка. Нечислові значення параметрів прийнято записувати у лапках.
Елементи гіпертекстового документа мають таку структуру:
2
2 з 12 балів
Виконайте інтерактивні вправи.
Скріни виконаних вправ прикріпіть до цього завдання.
.png)
3
10 з 12 балів
Практичне завдання:
Для створення HTML-розмітки документа використовують будь-який текстовий редактор.
Для перегляду HTML- документа використовується браузер.
Створення простої веб-сторінки
Створіть папку "Web_розробка.
Ваше прізвище" для збереження завдань модуля.У цій папці створіть папку Урок_1, в якій буде зберігатися веб-сторінка.
Запустіть Notepade++ (Блокнот, Атом) - редактори.
У вікні редактора наберіть стандартний код HTML-розмітки:
Збережіть сторінку з розширенням .html
В голові документа прописується теги, які не відображаються браузером, в тілі - ті, які браузер відображає.
Рефлексія від 24 учнів
Сподобався:
0
Так: 22
Ні: 2
Зрозумілий:
0
Так: 21
Ні: 3
Потрібні роз'яснення:
0
Ні: 22
Так: 2