- •Модуль 1. Основи html. Лабораторна робота №1 html - основні поняття, структура документа
- •Основні теоретичні відомості.
- •1. Основні поняття
- •2. Правила запису тегів:
- •3. Структура документу
- •4. Визначення й оформлення функціональних розділів документа
- •5. Форматування html – документа Вирівнювання:
- •Індекси:
- •Параметри шрифту:
- •Існують наступні логічні стилі:
- •Існують наступні фізичні стилі:
- •Завдання до лабораторної роботи
- •Лабораторна робота №2 Робота з графічними зображеннями на Web-сторінці. Списки
- •Основні теоретичні відомості
- •1. Використання графічного зображення в якості фону
- •2. Формати графічних файлів для www
- •3. Вставка графічних зображень (елемент img та його атрибути)
- •4. Списки
- •Маркірований
- •Нумерований
- •Список визначень
- •Вкладені списки
- •Завдання до лабораторної роботи
- •Лабораторна робота №3 Робота з редактором web-сторінок Dreamweaver. Посилання. Зв'язок з іншими документами. Використання об'єктів як посилання.
- •1. Основні теоретичні відомості.
- •2. Створення гіперпосилань
- •3. Види посилань
- •4. З'єднання з іншими документами
- •5. Звертання до певних розділів інших документів
- •6. Використання зображення як посилання
- •Завдання до лабораторної роботи
- •Лабораторна робота №4 Створення таблиць. Робота з атрибутами таблиці.
- •Основні теоретичні відомості
- •1. Загальна структура таблиці
- •2. Завдання загальних параметрів таблиці
- •3. Форматування даних у таблиці, оформлення рамок (форматування рядків і комірок)
- •1. Вирівнювання даних у стовпцях таблиці
- •2. Завдання кольору рамок таблиці
- •3. Завдання фонового малюнка для таблиці
- •4. Структурування таблиці
- •Завдання до лабораторної роботи
- •Лабораторна робота №5 Створення фреймів Настроювання атрибутів фреймів. Використання посилань, створення фреймового меню.
- •Основні теоретичні відомості
- •1. Основні поняття
- •2. Елемент завдання фреймів frameset та його атрибути
- •3. Вміст фреймів (елемент frame)
- •4. Вкладені фрейми
- •5. Інші атрибути елемента frameset
- •6. Атрибути елемента frame
- •2. Посилання й навігація
- •3. Плаваючі фрейми (елемент iframe)
- •Завдання до лабораторної роботи
- •Лабораторна робота №6 Карти зображень. Робота зі звуком.
- •Основні теоретичні відомості
- •1. Основні поняття
- •2. Створення карти посилань в html
- •3. Створення карт посилань за допомогою редактора Dreamweaver
- •Робота з мультимедіа
- •Вбудовування звукових файлів в Web-сторінку
- •Фонові звуки
- •Рухомий текст
- •Завдання до лабораторної роботи
- •Модуль 2. Створення інтерактівності. Css. Dhtml. Лабораторна робота №7 Робота з формами
- •Основні теоретичні відомості
- •2. Створення елементів керування
- •Список, що розкривається:
- •Поле - список
- •Список із множинним вибором
- •Завдання до лабораторної роботи
- •Основні теоретичні відомості
- •1. Поняття про аркуші стилів
- •2. Поняття про внутрішні та зовнішні аркуші стилів
- •3. Вбудований стиль (атрибут style)
- •4. Заголовний стиль (елемент style)
- •6. Види селекторів
- •Стильові властивості
- •1. Значення властивостей
- •2. Властивості шрифтів
- •3. Властивості тексту
- •4. Властивості кольору і фону
- •Завдання до лабораторної роботи
- •Лабораторна робота №9 Зовнішні аркуші стилів . Стильові властивості
- •Основні теоретичні відомості
- •2. Звертання до зовнішнього аркуша стилів (елемент link)
- •3. Запис css-правил.
- •Стільові властивості (продовження)
- •1. Властивості блоку
- •2. Властивості списків
- •3. Інші групи стильових властивостей
- •4. Псевдокласи й псевдоелементи
- •Завдання до лабораторної роботи
- •Лабораторна робота №10 Спадкування й каскадуванния. Візуальні ефекти
- •Основні теоретичні відомості
- •1. Правила спадкування властивостей
- •2. Селектори нащадків
- •3. Каскади стилів
- •4. Пріоритети стилів
- •5. Шари й позиціонування елементів
- •6. Вирізання області (властивість clip)
- •Завдання до лабораторної роботи
- •Лабораторна робота № 11. Dhtml.
- •Завдання до лабораторної роботи
- •Вимоги до звіту та критерії оцінювання
- •Критерії оцінювання лабораторних робіт:
- •Критерії оцінювання індивідуальних робіт:
- •Для отримання заліку необхідно виконати 70% завдань і набрати не менше 145 балів. Завдання для індивідуальної роботи.
- •Рекомендована література
- •Фоменко Андрій Вікторович Практикум зі створення
Завдання до лабораторної роботи
Завдання 1.
Створіть теку сайту, в яку вставте будь-який флэш файл. Перейменуйте його як приклад.swf.
Перевірте код програми.
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>пример тегів для flash-ролика</title>
</head>
<body>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase=
width="364" height="153" align="left" hspace="10" vspace="15">
<param name="movie" value="приклад.swf">
<param name="menu" value="false">
<param name="quality" value="Best">
<param name="wmode" value="transparent">
<param name="salign" value="L">
<embed src="приклад.swf" menu="false" quality="Best" width="364" height="153" type="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer" wmode="transparent" salign="L"></embed></object>
</body>
</html>
Файл – називається приклад.swf, розміри – 364 153, вирівнювання – по лівому краю, відступи від краю ролика – 10 пикс – по горизонталі і 15 – по вертикалі, якість – краще, фон – прозорий. Проекспериментуйте з параметрами. В даному випадку, теги OBJECT і EMBED – задають одні і ті ж параметри. Тег OBJECT – для IE, EMBED – для інших браузерів.
Завдання 2.
Створить сторінку на якої, за допомогою елементів форм (radio), можливо вбудувати текст з одного з трьох текстових файлів з назвами 1.txt, 2.txt, 3.txt.
Завдання 3.
Створіть сторінки, які містять елементи DHTML: меню зі зміною зображень, флеш елементи, зміну коліру при наведенні мишею, та ін.
Контрольні питання:
Яке практичне призначення змінної this?
Яке призначення тегу <OBJECT>?
Якім чином можливо вбудувати текс з файлу у сторінку?
Яке призначення тегу <PARAM>?
Вимоги до звіту та критерії оцінювання
1. Виконати завдання лабораторної роботи і зберегти їх на свій диск в теках з назвами Лабораторна робота №_ у теках з назвами Завдання 1, Завдання 2 і так далі. Файли в теках називаються відповідно до вимог лабораторних завдань.
2. Звіт розміщується в електронному варіанті в теці з лабораторною роботою і містить: тему роботи, мету, короткий опис тегов, використаних для виконання роботи, їх властивостей, відповіді на контрольні питання.
3. Звіт пишеться в текстовому редакторові WORD шрифт Times New Roman (14, 1.5).
4. Розмір звіту не повинен перевищувати 2 сторінки.
Критерії оцінювання лабораторних робіт:
Кожна робота оцінюється з 10-ти бальною системою.
Оцінки 1-4 бали виставляються за наявності частини завдань (більше половини і наявності звіту з відповідями на контрольні питання). Кількість балів визначається кількістю виконаних завдань.
Оцінки 5-6 балів виставляються за наявності всіх завдань, наявності звіту з вірними відповідями на контрольні питання і відповіді на одне питання по темі лабораторної роботи.
Оцінки 7-9 балів виставляються за наявності всіх завдань, наявності звіту з вірними відповідями на контрольні питання і відповіді на питання по темі роботи. Кількість балів визначається якістю відповідей.
Оцінка 10 балів виставляється за наявності всіх завдань, наявності звіту з вірними відповідями на контрольні питання і відповіді на питання по темі роботи. І при використанні творчості при виконанні практичних завдань.