- •Тема 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».
- •Теоретичні відомості
- •Тема: Налаштування сайту та його адміністративної панелі.
- •Тема: Публікації і сторінки.
- •Тема: Навігація.
- •Тема: Теми та дизайн сайту.
- •Завдання
- •Контрольні запитання
- •Словник термінів
- •Список використаних джерел
- •Навчальне видання
5. Адміністрування cms Joomla
Перш ніж почати адміністрування Joomla необхідно зрозуміти ряд структур та понять, які використовуються в системі.
Сторона відвідувачів
Під стороною відвідувачів [front-end – інтерфейсна частина] розуміють сукупність розділів доступних пересічним відвідувачам та зареєстрованим користувачам. Зазвичай зареєстрований користувач має справу тільки з розділами «для відвідувачів». Це нагадує магазин, в якому товари - на вітринах і полицях, і відвідувач може їх вивчати.
Адміністративний розділ
Це розділ сайту [back-end, панель управління, адмінпанель], до якого мають доступ тільки користувачі з адміністраторськими повноваженнями. І, хоча, є можливість відкрити до нього доступ зареєстрованим користувачам, в більшості випадків, знаходиться там обмежене коло співробітників, що займаються розв’язком основних задач, пов’язаних з сайтом. У випадку з Joomla розділ розташований за адресою http://ваш_сайт/administrator. Якщо сайт встановлений в кореневій папці сервера на локальному комп'ютері, то адреса буде наступним: http://localhost/administrator. Переходу в адміністративний розділ передує аутентифікація і, за бажанням, вибір мови.
Успішно пройшовши аутентифікацію, ви потрапите в адміністративний розділ, структура якого - доступні сторінки і набір елементів управління - буде залежати від ваших повноважень
Для успішного адміністрування необхідно знати основні складові CMS Joomla. До них відносяться: статті, категорії, користувачі, навігація, модулі, шаблони, плагіни, компоненти, налаштування, інші структури.
Статті. Є основним засобом для створення контенту, оскільки вся інформація, що знаходиться на сайтах розміщується саме засобом статей.
Категорії. Статті можуть зберігатись в категоріях (аналогія: файли та папки) відповідної тематики. Це дуже зручно, адже сайт може містити декілька категорій.
Користувачі. Ця компонента потрібна для того, щоб керувати користувачами, що заходять або працюють на сайті та встановлювати для них відповідні налаштування.
Навігація. Потрібна для переміщення по сайту. Цю функцію в Joomla виконує розділ «Меню». За допомогою нього можна створювати необмежену кількість меню та вкладень до нього.
Модулі. Це блок вмісту, який можна розташувати поряд зі статтею, що виводиться на сторінці. Наприклад, меню на стороні відвідувача – є модулем, інтерфейс входу в систему – також є модулем.
Шаблони. Засоби для формування зовнішнього вигляду сайту. Ця функція реалізовується в основному за допомогою HTML та CSS. Шаблони можна налаштовувати, змінювати логотип, кольорове оформлення, тощо. Від обраного макету шаблону також залежить місце розташування модулів сайта.
Плагіни. Виконують практичні функції і є прозорими для користувачів. Наприклад, WYSIWYG-редактор є плагіном або вбудований відео програвач – теж є плагіном.
Компоненти. Дають змогу створювати додаткові розширення на сайті, наприклад, форуми, гостьові книги, фотогалерея, тощо.
Тема 4. Проектування сайтів
Розробники проектів веб-сайтів
Завдання веб-програмування
Класифікація сайтів за призначенням
Класифікація сайтів за технологіями, що використовуються
В багатьох джерелах та побуті вважається, що розробниками Web-сайтів є Web-дизайнери. Але не складно показати, що Web-дизайнер це є один з розробників Web-сайтів. «Web- дизайн (від англ. Web design) є — галузь веб-розробки и різновидність дизайна, в задачі якого входить проектування веб-інтерфейсів користувачів для сайтів чи веб-додатків. Веб-дизайнери проектують логічну структуру веб-сторінок, знаходять найбільш зручні рішення надання інформації, а також займаються художнім оформленням веб-проекта.» У результаті поєднання двох галузей людської діяльності гарний веб-дизайнер повинен бути знайомий з останніми веб-технологіями і мати відповідні художні якості.
Це визначення має суттєві недоліки.
По-перше, нема чіткого визначення місця Web-дизайнера у розробці та по дальшому супроводженні сайтів. Супроводження для сайтів це такий же важливий етап як і створення. Сайту без інформаційного наповнення не існує, а його дає замовник.
По-друге, логічну структуру сайту, як і його інформаційне наповнення, теж задає замовник.
По-третьє, подальше існування сайту, його розвиток, його супроводження теж залежать не тільки від Веб-дизайнера.
І, четверте, сайт може мати певні вразливості і їх наявність залежить від кваліфікації Веб-дизайнера, а точніше від сумісної роботи Веб-дизайнера та Веб-програміста.
Отже, питання наступне «Хто має розробляти сайт?»
Фактично у розробці сайту приймають чи повинні приймати участь декілька спеціалістів різних фахів.
1. Замовник, який володіє інформацією, що розміщується на сайті. Який вміє структурувати інформацію, виділяти найбільш важливу, зробити її лінгвістичну перевірку чи доручити зробити цю перевірку відповідним фахівцям, виділити інформацію, що буде поновлюватись, визначити засоби online та offline зв'язку. І цей перелік може у кожному конкретному випадку бути продовжений.
2. Веб-дизайнер. Веб-дизайнери проектують логічну структуру веб-сторінок, знаходять найбільш зручні рішення надання інформації, а також займаються художнім оформленням веб-проекта.» Але його треба розглядати як координатора робіт по створенню сайта. Він повинен опікуватися і про подальше існування розробленого сайту.
3. Веб-програміст. Його роль все збільшується в процесі розвитку Web-технологій. Якщо на початку існування Web-сайтів його функції зосереджувались на розробці скриптів, які розширювали можливості сайтів. При технологіях, коли генерація сторінок виконується на боці сервера, функції веб-програміста при розробці веб-сайта вважаються основними.
4. Ще одним спеціалістом, який може бути залучений до роботи над Web-сайтом, є веб-художник. Часто без спеціальної освіти, та таланту художника знайти художні рішення не вдається.
5. Якщо сайт потужній, а вміст (контент) збирається з багатьох джерел, керує проектом Менеджер проекту.
Для розробки Web-сайту на замовлення ідеальним було би об’єднання перших трьох спеціалістів в одній особі. Фактично це неможливо і тому йдуть, по-перше, на використання попередньо розроблених шаблонів (щоб зменшити необхідність у художниках), по-друге, на використання розроблених плагінів (щоб зменшити необхідність у програмістах). Але розробка веб-додатків виконується веб-програмістами. Складності полягають і в тому, що веб-дизайнер це напівтехнічна професія, а веб-програміст – технічна. Якщо розглянути глибше, то і програміст має в собі декілька рівнів. Ці рівні треба враховувати і при підготовці програмістів у ВНЗ. Хоча є крилата фраза: «Навчити програмуванню не можливо, а навчитись можна». Ця фраза підкреслює практичний бік цієї професії де в основі лежить велика самостійна робота.
Крім того, програмісти теж можуть поділятись на категорії:
«Ідеолог» це той, хто може генерувати ідеї вирішення задачі (програміст він середній, може лише перевірити свої ідеї, на тій мові програмування, що знає);
«Алгоритміст». Його задача перейти від ідеї до алгоритмів. Знання програмування теж середнє.
«Кодувальник». Чудово володіє мовою програмування. По алгоритмам створює програмні реалізації;
«Тестер» . Дуже важливий ланцюг, що знає методи та засоби тестування програмних рішень.
Веб-програміст має все більше значення при розробці сайтів та веб-додатків. Якщо веб-дизайнеру ще іноді вдається засвоїти програмування з боку клієнта (наприклад, JavaScript), то серверні додатки створюються професійними програмістами (програмування на мовах РНР і це нижній рівень, а дійсно професійні програмісти працюють на мовах С++ та Java ).
В деяких публікаціях є висловлювання, що сучасний сайт це програмний продукт. Якщо сайт і звичайний та простий, але вимагає засоби спілкування, то вони створюються програмістами. До засобів спілкування чи активних компанентів відносяться форми, гостьові кгниги, форуми та інше подібне.
Можна взяти стандартну розробку, але фільтрацію інформації для більшості активних компанентів треба робити. Обумовлено це багатьма причинами і в основному пов'язаними з шумом, який генерує користувач - нецензурна лексика, просте клацання, образи та інше.
Які завдання повинні вирішувати веб-програмісти або веб-дизайнери?
Завдання веб-проектування:
Web-проектування це процес, який включає:
- створення та-чи узгодження технічного завдання;
- розробку Web-сайту (додатку);
- SEO (оптимізація сайту, формування мета тегів та robots.txt);
- Реєстрація в пошукових системах, каталогах, обмін банерами (просування сайту);
- Аналіз рейтингу сайта;
- Сканування на вразливості та їх видалення;
- Супроводження сайту та оцінка якості супроводження.
