Тема 1. ПЕРЕДУМОВИ СТВОРЕННЯ HTML - ДОКУМЕНТІВ

Навчальний посібник

Київ 2005

УДК 004.738.5

Антоненко В.М., Терейковський І.А., Терейковська Л.О. Основи Web-дизайну. Конспект лекцій. – К.: МГІ КСУ, 2005. – 114 с.

Рецензенти: Бондаренко Л. М. – канд. фіз.–мат. наук, доцент Національної академії ДПС України,

Станевич О. Г. – канд. техн. наук , доцент кафедри ІТ МГІ КСУ

В навчальному посібнику розглянуто принципи та прийоми створення клієнтської частини Web-сайту засобами HTML, CSS та JavaScript. Крім того значна увага приділяється питанням забезпечення високої ефективності забезпечення функціонування корпоративного Web-сайту.

Для студентів вищих навчальних закладів , що вивчають дисципліни " Сучасні Інтернет – технології ", “ WEB – дизайн ”, або для самоосвіти.

Схвалено на засіданні кафедри

інформаційних технологій МГІ КСУ

28 серпня 2004 року , протокол № 1

Затверджено й рекомендовано до публікації

рішенням Вченої ради МГІ КСУ

від 17 вересня 2004 року, протокол № 2

ЗМІСТ

ВСТУП................................................................................................................ 5

Тема 1. ПЕРЕДУМОВИ СТВОРЕННЯ HTML - ДОКУМЕНТІВ..................... 7

1.1. Інтернет та WWW..................................................................................... 7

1.2. URL-адреса............................................................................................. 10

1.3. Коротка характеристика мови HTML................................................... 12

1.4. Контрольні запитання............................................................................ 16

Тема 2. ПРАВИЛА ПОБУДОВИ HTML - ДОКУМЕНТІВ............................. 17

2.1. Визначення загальних параметрів......................................................... 17

2.2. Форматування тексту.............................................................................. 19

2.3. Використання тегів заголовків............................................................... 24

2.4. Форматування HTML-документу.......................................................... 27

2.5. Використання коментарів та спеціальних символів.............................. 29

2.7. Контрольні запитання............................................................................ 30

Тема 3. РИСУНКИ, ГІПЕРПОСИЛАННЯ, СПИСКИ.................................... 32

3.1. Рисунки.................................................................................................... 32

3.2. Гіперпосилання....................................................................................... 39

3.3. Списки..................................................................................................... 41

3.3.1. Маркіровані списки.......................................................................... 41

3.3.2. Нумеровані списки........................................................................... 43

3.3.3. Списки визначень............................................................................. 46

3.4. Контрольні запитання............................................................................ 48

Тема 4. ВИКОРИСТАННЯ ТАБЛИЦЬ, ФОРМ ТА ФРЕЙМІВ..................... 49

4.1. Таблиці.................................................................................................... 49

4.2. Форми...................................................................................................... 56

Мета використання........................................................................................ 57

4.3. Фрейми.................................................................................................... 60

4.4. Контрольні запитання............................................................................ 63

Тема 5. ВИКОРИСТАННЯ ДИНАМІЧНОГО HTML..................................... 64

5.1. Визначення динамічного HTML............................................................ 64

5.2. Визначення каскадних таблиць стилів................................................... 64

5.3. Особливості запису каскадних таблиць стилів...................................... 67

5.4. Ієрархія стилів........................................................................................ 69

5.5. Властивості форматування елементів.................................................... 70

5.6. Контрольні запитання............................................................................ 72

Тема 6. ОСНОВИ МОВИ ПРОГРАМУВАННЯ JAVASCRIPT..................... 74

6.1. Загальний огляд мови JavaScript........................................................... 74

6.2. Синтаксис. Визначення та ініціалізація змінних................................... 77

6.3. Вирази та оператори.............................................................................. 79

6.4. Оператори вибору.................................................................................. 80

6.5. Оператори циклу.................................................................................... 81

6.6. Контрольні запитання............................................................................ 83

Тема 7. РОЗШИРЕНІ МОЖЛИВОСТІ JAVASCRIPT.................................... 84

7.1. Використання функцій............................................................................ 84

7.2. Об’єктна модель JavaScript.................................................................... 85

7.3. Обробка подій......................................................................................... 87

7.4. Стандартні об’єкти і функції JavaScript................................................ 88

7.5 Використання об’єктів window, document, location............................... 94

7.6. Контрольні запитання............................................................................ 96

Тема 8. ЗАБЕЗПЕЧЕННЯ ЕФЕКТИВНОСТІ WEB – САЙТІВ...................... 98

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

8.2. Інтернет - орієнтовані методи підвищення ефективності сайту............ 99

8.3. Оптимізація структури та змісту сайту................................................ 102

8.4. Адаптація сайту до клієнтського програмного забезпечення............ 108

8.5. Контрольні запитання.......................................................................... 110

ЛІТЕРАТУРА.................................................................................................. 111

ГЛОСАРІЙ...................................................................................................... 112

ВСТУП

Ефективне управління виробництвом, формування оптимальних рішень у різноманітних сферах економіки та бізнесу, сталий розвиток підприємства в значній мірі залежать від рівня впровадження та використання інформаційних систем (ІС) і технологій. На сучасному етапі розробка та впровадження досконалих ІС неможлива без їх адаптації до використання в глобальній мережі Internet, а також однієї з її основних частин мережі WWW. Характерною рисою адаптації є наявність в ІС Web-сайту, доступного користувачам завдяки мережі WWW. Широке розповсюдження Web-сайтів призвело до появи нового напрямку в галузі програмування – Web-дизайну.

В сучасних умовах невеликі компанії нерідко створюють та підтримують Web-сайти силами своїх працівників. Крім того, досвід впровадження сучасних складних Web-орієнтованих систем свідчить про необхідність розробки подібних систем шляхом активної взаємодії між компанією-розробником програмного забезпечення та представниками замовника таких систем. Для цього необхідно знати принципи проектування та розробки Web – сайтів, мати чітке уявлення про їх структуру, принципи функціонування, місце і роль в організації роботи підприємства, мати уявлення про перспективи подальшого розвитку Web-систем, а також вміти їх використовувати на високому рівні.

Таким чином, в сучасних умовах фахівці різного профілю повинні опановувати Web-дизайн. Відзначимо, що на сьогодні по причині своєї новизни напрям Web-дизайну не має чітких меж. Досить часто до цього напрямку відносять розробку серверного та клієнтського програмного забезпечення, адміністрування Web-сайту, реалізацію заходів по підвищенню ефективності його функціонування та формування власне самого дизайну Web-сайту. Проте, як свідчить практика, основним завданням Web-дизайнера є розробка та підтримка клієнтського програмного забезпечення Web-сайту для забезпечення високої ефективності його функціонування. Всі інші завдання потребують достатньо глибоких професійних знань та навиків, і вирішуються спеціалістами відповідного профілю. Тому основна увага в конспекті спрямована на принципи та прийоми створення клієнтської частини Web-сайту засобами HTML, CSS та JavaScript.

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

Тема 1. ПЕРЕДУМОВИ СТВОРЕННЯ HTML - ДОКУМЕНТІВ