Теоретичні відомості виконання практичного семінару

Одним з найбільш широко використовуваних в HTML засобів є таблиці. Причому, дуже часто вони використовуються не тільки традиційно – як метод представлення табличних даних, але і як засіб форматування web-сторінок. Хоча слід зауважити, що другий варіант використання суперечить ідеології мови HTML.

Щоб додати таблицю в редагований документ в Dreamweaver необхідно натиснути кнопку Table (Рис. 16) на панелі об'єктів. Після цього на екрані з'являється діалогове вікно Table (Рис. 16), в якому пропонується вказати параметри майбутньої таблиці. У полях Rows і Columns задається кількість рядків і стовпців відповідно, в поле Width - ширина таблиці (може бути відносною у відсотках або абсолютній в пікселях). Параметр Border задає товщину рамки навколо всієї таблиці в цілому і кожної з її клітинок. Якщо вказано нульове значення, то рамка не буде відображатися. Параметр Cell Padding задає відстань між вмістом клітинки та її межами (за замовчуванням 1 піксель), а Cell Spacing – відстань між сусідніми елементами таблиці (за замовчуванням 2 пікселя).

Рис. 16 Діалогове вікно Table

У редакторі властивостей таблиці (Рис. 17) можна змінити кількість рядків і стовпців (Rows і Cols), ширину і висоту таблиці (W і H), параметри відступів (CellPad і CellSpace) товщину рамки (Border). Крім того, можна вказати вирівнювання таблиці щодо решти елементів абзацу (Align), кольори фону і рамки таблиці (Bg Color і Brdr Color), а також задати фонове зображення (Bg Image).

Для зміни властивостей окремої комірки необхідно поставити курсор в цю комірку, а для групи комірок - виділити їх. При цьому в нижній частині панелі властивостей з'являться параметри виділеної групи комірок. За допомогою кнопок Merge і Split можна відповідно об'єднати або розділити комірки. При розподілі осередків відкривається діалогове вікно Split Cell, в якому пропонується вказати кількість рядків (Rows) або стовпців (Columns) розбиття.

Рис. 17 Редактор властивостей таблиці

У редакторі Dreamweaver існує можливість створення таблиць на основі даних з файлу. Дані, підготовлені в іншому додатку (наприклад, Microsoft Excel) повинні бути попередньо збережені в текстовий файл із роздільниками (символами табуляції, комами, крапками з комами і т.п.), після чого їх можна буде імпортувати в HTML-таблицю.

Спочатку необхідно підготувати зазначений файл. Потім, в Dreamweaver натиснути кнопку Insert Tabular Data на панелі об'єктів.

У з’явившемуся діалоговому вікні (Рис. 18) необхідно вказати шлях до файлу з даними (поле Data File).

Рис. 18 Діалогове вікно додавання таблиці з файлу

У списку Delimiters вибрати тип роздільника, використаного у файлі з даними. Якщо вибрати пункт Other, то з'явиться додаткове поле, в якому можна вказати нестандартний роздільник (який, взагалі кажучи, може бути будь-яким символом). Параметр Table Width дозволяє задати ширину таблиці і може приймати одне з наступних значень:

· Fit to Data – ширина колонок таблиці буде обрана автоматично таким чином, щоб умістити найдовшу рядок;і

· Set – дозволяє вказати ширину таблиці у відсотках по відношенню до ширини вікна броузера або в пікселах.

У списку Format Top Row можна вибрати один з чотирьох варіантів оформлення верхнього рядка таблиці:

· No Formatting – не форматувати;

· Bold – виділити жирним шрифтом;

· Italic – виділити курсивом;

· або Bold Italic – виділити жирним курсивом.

Параметри Cell Padding, Cell Spacing і Border мають той же зміст, що й у звичайних таблицях.

Питання для самоконтролю

1. Як задається заголовок таблиці, де він може бути розташований;

2. Які теги відповідають за створення стовбців та строк в таблиці;

3. Які основні параметри головного тега таблиці TABLE;

4. Як форматувати дані в середині таблиці;

5. Що таке публікація Web-сторінки;

6. Основні етапи публікації;

7. Що таке мета-теги;

8. Які кроки роблять Вашу Web-сторінку менш популярною

Тема семінару 9

Модульна тестова робота №2

Мета семінару: Модульне тестове оцінювання отриманих знань в рамках другого модуля «Інтернет-сайти та їх типи. Розробка Інтернет-ресурсів.».

План

1. Розв’язання 20 випадкових тестових завдань з існуючого банку питань.

2. В даному тесті питання одного виду: 1 правильна відповідь з декількох.

3. Відповідь рахується правильною, якщо обрано одну вірну відповідь – кожна вірна відповідь 1 бал, обрання декількох відподей автоматично рахується помилкою, та оцінюється в 0 балів.

Приклади тестових питань

1. Що показує секція розміру сторінки?

а. Її розмір та об’єм займаної пам’яті;

b. Її розмір та час загрузки;

c. Її розмір та кількість символів;

d. Її розмір та місце розташування.

2. У якому меню знаходиться пункт Page Properties, що дозволяє змінювати загальні властивості сторінки:

a. Modify;

b. Common;

c. Insert;

d. Frames.

.

САМОСТІЙНА РОБОТА СТУДЕНТІВ

Під час самостійного опрацювання матеріалу студенти знайомляться з першоджерелами і працями дослідників, збирають матеріали для доповідей на семінарських заняттях, готуються до написання модульних тестових робіт, виконують творчу роботу у формі розробки Інтернет-сайта і мультимедійної презентації, виконують практичне індивідуальне навчально-дослідне завдання (ІНДЗ), готуються до написання підсумкової екзаменаційної роботи.

Студентові рекомендується:

² Законспектувати матеріали лекцій та проаналізувати основну літературу, яка винесена до розгляду на семінарських заняттях.

² Відпрацювати усі практичні семінари, та підготувати звіти за темами, які розглядалися на семінарських заняттях.

² Приймати активну участь в обговоренні проблемних питань курсу під час семінарських дискусій.

Студентові необхідно:

² Виконати практичне індивідуальне навчально-дослідне завдання (ІНДЗ), яке готується протягом семестру (здається на кафедру в електронному і роздрукованому варіантах в останній тиждень семестру і є складовою допуску до іспиту з навчального курсу).

² Підготуватися до написання підсумкової (екзаменаційної) письмової роботи.

Методичні поради для виконання
індивідуального навчально-дослідного завдання (ІНДЗ)

Загальні положення

Виконання індивідуального дослідного завдання є необхідною складовою науково-дослідної та навчальної роботи студента та є видом позааудиторної роботи навчально-дослідницького характеру, яка виконується в процесі вивчення програмного матеріалу з навчального курсу «Інтернет-комунікації та web-дизайн». ІНДЗ передбачає підготовку, розробку та опис Інтернет-сайту, що відповідає формальним вимогам вивчаємого курсу (орієнтована тематика надається). ІНДЗ містить виклад результатів наукового дослідження, висвітлює конкретне питання за темою курсу.