- •Конспект лекцій з дисципліни
- •Лекція 1. Принципи організації глобальної мережі Інтернет. Введення в Веб-технології: структура та принципи Веб.
- •Предмет курсу
- •Характеристика Інтернет
- •Стек протоколів tcp / ip
- •Система доменних імен dns
- •Структура і принципи www
- •Проксі-сервери
- •Протоколи Інтернет прикладного рівня
- •Лекція 2. Принципи побудови Веб-сайтів. Структура Веб застосуваннь. Характеристика мови html.
- •Історія розвитку html
- •Принципи гіпертекстової розмітки
- •Групи тегів нтмl
- •Лекція 3. Структура html-документа і елементи розмітки заголовка документа.
- •Призначення заголовка
- •Відображення змісту елемента title
- •Основні контейнери заголовка
- •Елемент розмітки head
- •Елемент розмітки title
- •Елемент розмітки base
- •Елемент розмітки meta
- •Елемент розмітки link
- •Елемент розмітки style
- •Елемент розмітки script
- •Лекція 4. Контейнери тіла документа.
- •Теги тіла документа
- •Тіло документа - контейнер body
- •Теги управління розміткою Заголовки
- •Атрибут аlign
- •Теги управління відображенням символів
- •Теги, що управляють формою відображення
- •Верхні і нижні індекси
- •Атрибут sizе
- •Атрибут соlоr
- •Створення списків в html
- •Атрибути маркерів у ненумерований списку
- •Коментарі в мові html
- •Гіпертекстові посилання
- •Лекція 5. Графіка.
- •Використання графіки в html.
- •Атрибут src
- •Атрибут alt
- •Атрибут аlign
- •Формати графічних файлів
- •Активні зображення
- •Зображення в мініатюрі
- •Лекція 6. Таблиці html.
- •Засоби опису таблиць в html
- •Створення таблиць в html
- •Атрибут nowrap
- •Атрибут соlspan
- •Атрибут rowspan
- •Атрибут widтн
- •Застосування порожніх клітинок
- •Атрибут сеllраdding
- •Атрибути аlign і valign
- •Атрибут border
- •Атрибут cellspacing
- •Атрибут bgcolor
- •Атрибут background
- •Використання таблиць в дизайні сторінки
- •Лекція 7. Використання html-форм
- •Html-Форми
- •Завдання форми - елемент form
- •Атрибут cols
- •Атрибут name
- •Атрибут rows
- •Алгоритм роботи фреймів
- •Створення простої сторінки з фреймами
- •Завдання фреймової структури
- •Підготовка вмісту фрейма
- •Підготовка фрейму main
- •Атрибути rows і соls
- •Атрибут rows
- •Атрибут сols
- •Атрибут nаме
- •Атрибут маrginwidth
- •Атрибут маrginheight
- •Атрибут scrolling
- •Атрибут noresize
- •Атрибут srс
- •Атрибут таrgет
- •Вкладені і множинні кадрові структури
- •Лекція 9. Призначення і застосування каскадних таблиць стилів css
- •Призначення css
- •Способи застосування css
- •Перевизначення стилю
- •Елемент style
- •Посилання на зовнішній опис
- •Імпорт опису стилів
- •Селектор - ім'я елемента розмітки
- •Селектор - ім'я класу
- •Селектор - ідентифікатор об'єкта
- •Спадкування й перевизначення
- •Лекція 10. Блокові і стрічкові елементи css
- •Блокові і стрічкові елементи
- •Елемент div
- •Елемент span
- •Властивості блоків
- •Відступи (margin)
- •Набивання (padding)
- •Рамка (border)
- •Обтікання блоку тексту
- •Лекція 11.Позиціонування у css
- •Координати і розміри
- •Абсолютні координати
- •Відносні координати
- •Лінійні розміри блоку
- •Управління видимістю
- •Порядок накладення і область видимості
- •Порядок накладення блоків. Z-index
- •Область видимості блоку. Clip
- •Лекція 12. Призначення та застосування JavaScript.
- •Метод join ()
- •Метод reverse ()
- •Метод sort ()
- •Оператори мови
- •Лекція 14. Об'єктна модель броузера.
Елемент розмітки meta
Це найбільш популярний елемент розмітки заголовка, більш поширений тільки елемент TITLE. Такий стан справ пояснюється призначенням даного елемента розмітки. META містить керуючу інформацію, яку браузер використовує для правильного відображення і обробки змісту тіла документа.
Вперше контейнер META був задіяний при примусовій перезавантаження документа браузером через заголовок HTTP-повідомлення. У заголовку HTTP-повідомлення можна вказати оператора refresh. Час, заданий як параметр цього оператора, визначає інтервал у секундах, після якого браузер завантажує документ, визначений атрибутом URL даного оператора.
У контейнері META подібний механізм реалізується наступним чином:
<META HTTP-EQUIV = "Refresh" CONTENT = "1;
URL = refresh.htm ">
У даному випадку через одну секунду після завантаження документа браузері мають ініціювати завантаження сторінки refresh.htm.
Використовуючи цей механізм, можна побудувати автоматично перезавантажується послідовність сторінок. Для цього в заголовку кожної сторінки з даної послідовності слід розмістити відповідний контейнер META.
<META HTTP-EQUIV="Refresh" CONTENT="1;
URL=refreshX.htm">
Головна літера "Х" у слові "refreshX.htm" - це цифра номера кадру. На сторінці нульового кадру в цьому місці слід вказати на перший кадр (refresh1.htm), на сторінці першого кадру - на другий (refresh2.htm) і т.д.
Параметр CHARSET дає можливість вказувати тип кодування документа. Для перекодування на стороні клієнта (документ підготовлений в кодуванні cp1251) у заголовок документа необхідно включити META-тег наступного виду:
<META HTTP-EQUIV="Content-type"
CONTENT="text/html;
CHARSET=windows-1251">
Крім Content -type, можна вказати і інші оператори. Наприклад, заборонити кешування документа. Необхідність у цьому виникає при частому оновленні документа або наявність у ньому змінюються SSI-вставок. Для заборони кешування досить вставити в заголовок META-тег виду:
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
Pragma - це спадщина HTTP 1.0. У новій версії протоколу HTTP (HTTP 1.1) управління кешуванням здійснюється через оператора Cache-Control. Для отримання такого ж ефекту, як у випадку з Pragma, в заголовку HTML-документа достатньо вказати:
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
Новий механізм управління кешуванням і зберіганням документа на стороні клієнта набагато більш гнучкий, ніж в HTTP 1.0. Наприклад, можна заборонити зберігання документа після пересилання:
<META HTTP-EQUIV="Cache-Control" CONTENT="no-store">
Точно так само можна задати час останньої модифікації (Last-Modified) або дату закінчення актуальності документа (Expire).
З появою роботів пошукових машин на META-тег була покладена ще одна функція - опис пошукового образу документа.
Власне, для опису документа використовується два META-тега. Один визначає список ключових слів, а другий - реферат (короткий зміст документа), який відображається як пояснення до посиланням на документ у звіті пошукової машини про виконане запиті. Контейнер TITLE тут також використовується в якості назви документа.
<TITLE> Веб-технології </ TITLE>
<META NAME = "description" http-equiv = "description"
content = "Навчальний курс Веб-технології.
Тема: Тема HTML-документа. Елемент
розмітки META. Дається короткий опис
основних способів застосування контейнера META
в заголовку HTML-документа. Розглядається
управління HTTP-обміном та індексування
документів. ">
<META NAME =" keywords "HTTP-EQUIV =" keywords
"CONTENT=" навчальний курс; Веб -технології; веб;
технологія; HTML; мова гіпертекстової розмітки;
заголовок HTML-документа; заголовок; HTML;
документ; контейнер; META; елемент; HEAD;
приклад; розмітка; методика ">
