- •Тема 1. Теорія веб-програмування
- •1.Загальне поняття про веб-програмування
- •2. Історія
- •1971-1989 Рік – перший обмін повідомленнями.
- •1995-1996 Рр. Мова програмування JavaScript. Каскадна таблиця стилів. Flash.
- •2000 Рік (травень) – реліз php4.
- •2000 Рік (грудень) – w3c та JavaScript.
- •2005 Рік – упровадження технології web 2.0.
- •3. Засоби веб-програмування
- •4. Система керування вмістом
- •Тема 2. Мова гіпертекстової розмітки html
- •1. Основні поняття мови html.
- •2. Історія розвитку html.
- •3. Розмітка
- •4. Елементи html-документа
- •5. Редактори html-документів
- •Wysiwyg-редактори
- •Редактори, що працюють з вихідним кодом
- •Тема 3. Система управління вмістом Joomla
- •Складові cms-системи
- •2. Системні вимоги до встановлення cms Joomla
- •3. Інсталяція cms Joomla
- •5. Адміністрування cms Joomla
- •Тема 4. Проектування сайтів
- •2. Класифікація web-сайтів (за призначенням)
- •2.1. Класифікація за призначенням
- •2.2 Класифікація сайтів за технологіями, що використовуються
- •Тема 5. Структура процесу розробки web-сайтів та web-додатків
- •1 Структура процесу розробки
- •2 Технічне завдання на розробку
- •2.1. Етапи та терміни створення сайту:
- •Структура сайту інституту
- •Наукові школи
- •Центри та лабораторії
- •Напрями наукових досліджень
- •Конференції та семінари
- •Видавнича діяльність
- •Контакти Тема 6. Ергономічні обмеження та рекомендації при web–дизайні
- •1. Обмеження по кількості елементів керування
- •2 Обмеження по розташуванню елементів керування
- •3. Обмеження по інформаційному наповненню
- •4. Графіка та текст.
- •5. Часові обмеження
- •1. Психогенний вплив
- •2. Колір при Web-дизайні
- •Тема 7. Програмування мовою html 5
- •П'ять речей, які треба знати про html5
- •2. Вам не треба відкидати наявне
- •3. Легко почати
- •4. Це вже працює
- •Перевірка технологій html5
- •10 Порад для створення html5-шаблонів
- •Можливі експерименти з html5
- •Переваги табличної верстки
- •4 Основних недоліка табличної верстки
- •Оптимізація html коду
- •Практичні завдання Розділ і. Лабораторна робота №1. Розробка структури сайту
- •Хід роботи
- •Визначення мети створення сайту та його тематики.
- •2. Визначення структури сайту
- •3. Визначення ключових слів
- •4. Добір доменного імені сайту.
- •Лабораторна робота №2. Основи використання дескрипторів мови html
- •Хід роботи
- •Теги форматування
- •Атрибут тега ul type відповідає за вигляд маркеру:
- •Встановлення кольору фону
- •Лабораторна робота №3. Створення веб-сторінки мовою html.
- •Хід роботи
- •Лабораторна робота №4. Робота з таблицями у html.
- •Хід роботи
- •Елементи таблиці
- •Атрибути елемента table
- •Атрибути елементів рядків і стовпців
- •Колір у таблицях
- •Об'єднання комірок таблиці
- •Контрольні запитання
- •Лабораторна робота №5. Використання зображень та посилань на веб-сторінці.
- •Теоретичні відомості
- •Зовнішні посиланн
- •Внутрішні посилання
- •Завдання: Створити галерею учнів 9 класів.
- •Питання для самоконтролю
- •Лабораторна робота №6. Створення персонального сайту за допомогою системи ucoz
- •Хід роботи
- •(Для завершення реєстрації перейти за цим посиланням:)
- •Індивідуальне завдання
- •Лабораторна робота №7. Налагодження модулів персонального сайту в системі ucoz
- •Хід роботи
- •Індивідуальні завдання
- •Розділ іі.(практичне застосування) Комплекс практичних робіт по створенню веб-сайту за допомогою системи управління контентом «WordPress»
- •Практична робота №1 Тема: Встановлення локального сервера. Встановлення україномовної версії «WordPress».
- •Теоретичні відомості
- •Тема: Налаштування сайту та його адміністративної панелі.
- •Тема: Публікації і сторінки.
- •Тема: Навігація.
- •Тема: Теми та дизайн сайту.
- •Завдання
- •Контрольні запитання
- •Словник термінів
- •Список використаних джерел
- •Навчальне видання
2.2 Класифікація сайтів за технологіями, що використовуються
Всі сайти в мережі можна розділити на дві великі групи: статичні і динамічні сайти. З точки зору відвідувача сайту часто не важливо, на якій сторінці він знаходиться, статичній чи динамічній, іноді навіть важко точно це визначити. Розглянемо цей поділ з точки зору розробника - творця сайту.
Статичний сайт.
Статична сторінка - сторінку, яка цілком зберігається на сервері і показується відвідувачу у своєму незмінному вигляді (слід врахувати, що статична сторінка може містити деякі змінні елементи, наприклад банери, проте вона все одно залишається статичної).
Припустимо, тепер вона зберігається у файлі "Page.html" Якщо ви відкриєте її за допомогою браузера, то побачите все наповнення сторінки.
Ось приблизно в такому вигляді (як при збереженні на локальний комп'ютер) статичні сторінки зберігаються на сервері, який лише видає їх відвідувачеві.
Статичний сайт - це сайт більшість або всі сторінки якого є статичними.
Переваги статичних сайтів
Переваги систем на базі мови HTML:
1. Легко змінити зовнішній вигляд будь-якої конкретної сторінки, не вплинувши на вигляд інших сторінок.
2. Нескладно додати на сайт нову сторінку, скопіювавши і виправивши файл з існуючої сторінки.
3. Людині, що займається підтримкою сайту, достатньо знати лише мову HTML.
4. Сайт буде працювати на будь-якому сервері хостингу, навіть з дуже обмеженими можливостями.
5. Сайт можна переглядати локально, не використовуючи додаткове програмне забезпечення. Веб-майстру зручно робити сторінки, не виходячи в Інтернет.
6. Мала кількість програмних компонентів дуже утруднює злом такої системи.
Недоліки статичних сайтів
1. Складно внести зміни в структуру і зовнішній вигляд сайту. Наприклад, якщо треба змінити меню сайту, логотип або структуру сторінок, то для цього необхідно змінити вміст усіх сторінок, оскільки HTML-код цих елементів продубльований на кожній сторінці.
2. Система не гарантує єдиний стиль сторінок сайту - кожна сторінка фактично створюється заново і будь-яка помилка при зміні файлів, що містять сторінки, призводить до того, що різні сторінки сайту виглядають по-різному.
3. Треба розробляти чи знаходити програмні модулі для реалізації активних компонентів ( коментарі та відгуки користувачів, голосування, форум, чат та інше).
4. Досить складно забезпечити розділення прав доступу до вмісту сайту.
Динамічний сайт.
Динамічна сторінка - сторінка, яка формується сервером з декількох частин або отримується шляхом внесення або зміни даних у сторінку.
Розглянемо процес генерації динамічної сторінки докладніше.
Якщо статична сторінка не зазнає практично ніяких змін і потрапляє на екран до відвідувача у своєму "первозданному" вигляді, то динамічні сторінки, у вигляді, які їх бачить людина, на сервері не існує. Вона збирається кількома різними способами з даних, що зберігаються на сервері, і лише після цього показується відвідувачеві.
Методи збирання динамічних сторінок:
1) Першим варіантом може бути об'єднання декількох (двох і більше) окремих частин в одну сторінку - це найпростіший спосіб генерації.
2) Другим варіантом є заповнення шаблонної сторінки будь-якою інформацією, що зберігається окремо або надається у результаті роботи алгоритму (наприклад, у результаті обчислень).
3) Третім, і, мабуть, найпоширенішим варіантом, є поєднання перших двох у всіляких варіаціях, тобто сторінка збирається з декількох шматочків, в які при цьому вносяться різні зміни.
Динамічний сайт - сайт, в якому більшість або всі сторінки якого створюються динамічно.
Переваги динамічних сайтів.
Інтернет почав розвиватися зі статичних сторінок, пройшов деякий час і тепер вже більшість сайтів в Інтернет динамічні. Розглянемо, які переваги і недоліки мають динамічні сайти в порівнянні зі статичними.
З появою мов програмування, що виконуються на стороні сервера, з'явилася можливість вносити зміни в дані, що відправляються відвідувачеві.
І це дало наступне:
1) Розділення інформації та дизайну.
2) Спрощення модифікації та оновлення сторінок.
3) Можливість змінювати контент, реагуючи на дії відвідувача.
Використання динамічних сторінок дозволяє зберігати якийсь шаблон дизайну, в який, в залежності від сторінки, на яку зайшов відвідувач, розміщується необхідне наповнення. Такий варіант дуже зручний, адже для всього сайту створюється один або кілька шаблонів, і всі зміни дизайну, які потрібно зробити на сайті, виконуються тільки з ними.
З точки зору організації роботи і розподілу праці, варіант створення сайту на основі шаблонів практично ідеальний. Людина, яка відповідальна за дизайн сайту не зможе втрутитися в процес наповнення сторінок контентом, і за всі недоліки в дизайні буде нести відповідальність тільки він. І навпаки, той, хто займається інформаційним наповненням сайту, не зможе порушити дизайн сайту. Кожен займається своєю справою, не заважаючи іншим. Це прискорює роботу і знижує витрати.
Розділення інформації та дизайну на сайті дозволяє прискорити процес оновлення і наповнення сайту, тому що не вимагає від людей, що виконують ці операції, знань в областях html-розмітки, графіки і т.д. Тобто можна навіть підготувати дизайн сайту (замовити у фірми, яка надає такі послуги), а потім робити наповнення сайту власними силами, не витрачаючи кошти на постійне залучення сторонніх або включення у свій штат фахівців з дизайну, що треба було б робити при статичній організації сайту. Та й часові витрати на оновлення значно скорочуються.
Третя особливість дало поштовх розвитку Інтернет. Вона позначилася безпосередньо на користувачах. Тільки завдяки їй з’явилася велика кількість електронних магазинів, віртуальних клубів, інтернет-ігор і т.п.
Тільки можливість змінювати наповнення сайту під конкретного відвідувача дозволило втілитися в життя цим проектам.
Ще один приклад - це форуми і чати, яких на просторах мережі розвелося безліч. Всі вони створюються динамічно, без підтримки цієї технології жоден з них не зміг би існувати. Дошки оголошень, клуби за інтересами, віртуальні ігри та змагання - нічого цього б не змогли побачити.
Недоліки динамічних сайтів. Першим недоліком є необхідність використання додаткових програмних засобів для побудови динамічного сайту. На статичному сайті всі сторінки вже готові, серверу залишається лише показати їх відвідувачу, а на динамічному сайті необхідно вносити до них якісь зміни, для цього потрібно відповідні програмні рішення.
Другим недоліком є підвищення вимог до апаратних потужностей серверних систем. Цей недолік безпосередньо випливає з попереднього, тому що тепер сервера потрібно ще виконати якусь програму для модифікації сторінки сайту, а тільки потім видати її відвідувачеві.
Особливо помітною ця проблема стає на сайтах з великою відвідуваністю.
Часто в таких випадках доводиться робити додаткові оптимізації коду для нормальної роботи сайту. Отже, вартість послуг, з утримання такого сайту, набагато вища, ніж статичного.
Третім недоліком, що також випливає з першого, є складність великих структурних змін сайту пов'язаних зі зміною програмного забезпечення.
І четвертий недолік - вразливість таких сайтів значно більша за рахунок програмного забезпечення, яке використовується
