Група №12
12.03.2020р.
Урок №31
Поняття гіпертекстового
документа
Мета уроку:
ü навчальна: сформувати поняття про мову розмічання гіпертекстового документа;
ü розвивальна: розвивати логічне мислення, пам’ять; формувати вміння узагальнювати;
ü виховна: виховувати інформаційну культуру, формування бережливого ставлення до обладнання комп’ютерного кабінету, виховання уміння працювати в групі; формування позитивного ставлення до навчання.
1.1. Що таке «HTML» і для чого це потрібно?
Hypertext
Markup Language (HTML) - (Мова розмітки гіпертекстових
документів) —стандартна мова розмітки для створення веб-сторінок і веб-додатків. З Cascading Style Sheets (CSS)
і JavaScript,
вона утворює тріаду основних технологій для World Wide Web.
Веб-браузери отримують HTML-документи
з веб-сервера або з локальної пам'яті і передають документи
в мультимедійні веб-сторінки. HTML описує структуру веб-сторінки семантично і спочатку включені сигнали для
зовнішнього вигляду документа.
Елементи HTML є будівельними блоками
сторінок HTML. За допомогою конструкцій HTML, зображення та інші об'єкти, такі
як інтерактивні форми, можуть
бути вбудовані у візуалізовану сторінку. HTML надає засоби для створення структурованих документів,
позначаючи структурну семантику тексту, наприклад
заголовки, абзаци, списки, посилання, цитати та інші елементи.
Елементи HTML окреслені тегами , написаними з використанням кутових
дужок . Теги, такі як і безпосередньо вводять вміст на сторінку. Інші теги,
такі як<img /> <input /> <p>оточують і
надають інформацію про текст документа і можуть включати інші теги як під-елементи.
Браузери не показують теги HTML, але використовують їх для інтерпретації вмісту
сторінки.
HTML
може вбудовувати програми, написані на мові сценаріїв, наприклад JavaScript,
що впливає на поведінку та вміст веб-сторінок. Включення CSS визначає вигляд і
компонування вмісту. World Wide Web Consortium (W3C), які супроводжують як
HTML і CSS стандартів, заохочує використання CSS над явним презентаційним HTML
з 1997 року.
HTML впроваджує засоби для:
створення
структурованого документа шляхом позначення структурного складу тексту:
заголовки, абзаци, списки, таблиці, цитати та інше;
отримання
інформації із Всесвітньої мережі через гіперпосилання;
створення
інтерактивних форм;
включення
зображень, звуку, відео, та інших об'єктів до тексту.
1.2. Які основні теги мови HTML
використовуються для написання коду будь-якої сторінки?
Очікувана
відповідь. <html></html> - елемент <html>. Цей
елемент загортає весь контент на всій сторінці. Також його називають кореневим
елементом (root element).
<head></head> -
елемент <head>. Цей елемент слугує контейнером для всієї інформації,
яку потбірно додати до своєї сторінки, але яка не є власне контентом сторінки, який будуть переглядати користувачі. Це, ключові
слова, опис сторінки, який буде з'являтися в пошукових результатах, CSS
для стилів контенту, набір символів (кодування) тощо.
<body></body> -
елемент <body>. Цей елемент містить увесь контент, який потрібно показати користувачам, коли вони
відвідують сторінку: текст, зображення, відео, ігри, аудіо тощо.
<title></title> -
елемент <title>. Цей елемент містить заголовок сторінки, який буде
відображатися у вкладці браузера при завантаженні сторінки. Також текст у цьому
елементі буде відображатися в закладках, якщо додати сторінку до закладок.
1.3. Як встановити колір фону web-сторінки або
ж зробити фоновою картинку?
Очікувана
відповідь. Тег body, як і практично будь-який HTML-тег має свої атрибути. До
атрибутів тега body відносяться:
bgcolor
- визначає колір фону для сторінки;
background
- дозволяє задати картинку в якості фону web-сторінки.
За
допомогою саме цих тегів можна зробити фон креативним.
1.4. Як задати заголовок на
сторінці?
Очікувана
відповідь. Елементи "Heading" дозволяють вказати, що певні
частини контенту сторінки є заголовками або підзаголовками. HTML має заголовки
шістьох рівнів: <h1>–<h6>, але зазвичай використовуються перші
3-4.
<h1>Мій головний заголовок</h1>
<h2>Мій
важливий заголовок</h2>
<h3>Мій
підзаголовок</h3>
<h4>Мій
менш важливий підзаголовок</h4>
1.5. Для
чого використовують графіку на web-сторінках?
Очікувана
відповідь. Зображення можуть нести певну інформацію, а також просто надають web-сторінці привабливого
вигляду.
Найбільш
поширені випадки застосування зображень: логотип компанії на діловій сторінці, графіка
для рекламного оголошення, зображення чи колір, як фон web-сторінки, малюнки,
діаграми і графіки, художні шрифти, підпис автора сторінки, застосування
графічного рядка як горизонтальна розділова лінія, застосування графічних маркерів
для створення красивих маркованих списків.
1.6. Як створити посилання ?
Очікувана
відповідь. <a></a> - це парний тег - якір. Між тегами пишеться
слово (слова, речення, тег для розміщення малюнка), на яке потрібно клікнути
мишкою.
Обов'язковий
атрибут:
href="адреса
web -сторінки, на яку потрібно перейти"
<a
href=″адреса web -сторінки, на яку потрібно перейти">Слово, речення,
тег для розміщення малюнка, на яке потрібно клікнути мишкою</a>
<a
href=″шлях і назва файлу на комп'ютері, на який потрібно перейти">Слово,
речення, тег для розміщення малюнка, на яке потрібно клікнути мишкою</a>.
Отже,
за результатами проведеного опитування хочу підкреслити, що матеріал засвоєно
на середньому та достатньому рівнях.
Відштовхуючись
від обраного варіанту нам потрібно створити головну web – сторінку та
5 додаткових. На головній сторінці потрібно розмістити заголовок, який
відображає суть Вашої теми, зміст , який складається з гіперпосилань на
додаткові web –
сторінки, графічну та текстову інформацію і все естетично оформити.
Допоміжна
сторінка повинна виглядати відповідно розданого зразка, а саме заголовок,
кілька зображень та текстова інформація
(опис до картинок). Вкінці сторінки потрібно розмістити гіперпосилання
на головну сторінку.
Домашнє завдання Підручник Н.В. Морзе, О.В. Барна ст. 213
Немає коментарів:
Дописати коментар