Сайти, що містять інтерактивні вебсторінки, називають динамічними. Для створення та супроводження динамічних сайтів використовують CMS (від. англ. Content Management System) — систему управління сайтом, яку називають двигунцем сайту.
Засоби розробки сайтів забезпечують відокремлення змістової частини (контенту) від дизайну (шаблону вебсторінки), що дає змогу змінювати вміст вебсторінки, не змінюючи дизайн, і змінювати шаблон сайту, не змінюючи вміст його вебсторінок.
(Для створення блогу оберіть одну із загальних тем: Романтика, Музика, Спорт, Гумор, Кулінарія, Колекціонування тощо. )
Контент, що використали на попередньому уроці.
1 сторінка - зображення + текст;
2 сторінка - відео + текст;
1 допис - зображення + текст;
2 допис - зображення + текст;
Джерела інформації та мотивації
Усі сайти, відповідно до способу наповнення сторінок інформацією, умовно можна поділити на дві групи – статичні та динамічні. У чому відмінність між ними? Розглянемо особливості кожного з видів.
Під статичним розуміється сайт, який складається із незмінних HTML-сторінок. Для прикладу – сайт-візитка. Тобто, користувач переглядає сторінку у тому вигляді, в якому вона зберігається на сервері.
Динамічний сайт, за аналогією, складається із динамічних, тобто, змінних сторінок. Варто зазначити, що такі сторінки формуються «на льоту» програмно, на основі запиту користувача.
Для створення динамічного сайту можливі два шляхи.
По-перше, це написання власних програм, які відповідають за створення потрібних шаблонів і підтримують необхідні функції. При цьому створена система буде повністю відповідати потребам, проте можливо вимагатиме великих програмістських зусиль і часу.
Другий шлях - це скористатися вже існуючими системами, які і називаються системами управління Web-контентом. Перевагою цього шляху є зменшення витрат часу і сил. До його недоліків можна віднести зниження гнучкості, надання недостатнього або надмірного набору можливостей.
Другий шлях є основним на цей час для створення складних, сучасних сайтів, порталів, Веб-додатків. Це метод з використанням CMS.
Система керування вмістом, або CMS (англ. Content Management System), — це програмне забезпечення, завдяки якому здійснюється керування вмістом сайту (зміна, додавання нового текстового наповнення, завантаження зображень на сайт, створення нових розділів тощо). Нині відомо багато систем управління вмістом сайту, створених за допомогою різних технологій.
Таким чином, відділення дизайну від контенту є головною відміною особливістю динамічних сайтів від статичних.
При створенні сайтів часто можна почути слова «фронтенд» і «бекенд». Вони втілюють у собі протилежну «філософію», але при цьому фронтенд і бекенд один без одного не змогли б повноцінно існувати. Що ж таке фронтенд і бекенд та чим вони відрізняються?
Фронтенд і бекенд: основна відмінність
Який би приклад підійшов у цьому випадку? Коли ви ведете автомобіль, ви використовуєте кермо, щоб привести його в рух і дати інші важливі команди. Але те, що дійсно приводить авто в рух, заховане всередині. Це його двигун.
Так само з фронтендом і бекендом. Фронтенд-розробка зосереджена на тих елементах сайту, які ви бачите у браузері і з якими безпосередньо взаємодієте. Бекенд-розробка відповідає за функціонал сайту і має справу з речами, яких ви не бачите, — такими як бази даних та сервери.
Фронтенд-розробка: завжди «на передньому плані»
Frontend – це публічна частина web-додатків (веб-сайтів), з якою користувач може взаємодіяти і контактувати напряму.
Щоб представити контент сайту найкращим чином та забезпечити ідеальну взаємодію користувача з сайтом, фронтенд-розробники використовують багато корисних інструментів, найважливіші з яких — HTML, CSS та JavaScript. HTML (Hypertext Markup Language) відповідає за представлення коду користувачам у зрозумілій та звичній формі. CSS (Cascading Style Sheets) пропонує чудові можливості із вдосконалення стилів (кольори, фони, блики і т.д.) Javascript робить взаємодію користувача з сайтом швидшою та цікавішою за допомогою слайдів, випадних меню, безкінечного скролінгу та багатьох інших способів — вибір безмежний.
Низка інших елементів та фреймворків (SAAS, LESS, Bootstrap, jQuery, Angular, Ember і т.д.) використовуютья разом із цією «великою трійкою» для значного полегшення роботи.
Компоненти фронтенд розробки:
HTML (HyperText Markup Language) кажучи простими словами – це мова розмітки всіх елементів і документів на сторінці, і їх взаємодія в структурі сторінки.
CSS (Cascading Style Sheets) – це мова характеристики і стилізації зовнішнього вигляду документа. За допомогою CSS-коду браузер розуміє, як саме необхідно відображати елементи. CSS створює шрифти, кольори, визначає розташування блоків сайту, та інше. Також адаптує один і той же документ в різних стилях, виводить передачу на екран або для читання голосом.
JavaScript– мова, створена оживляти веб-сторінки. Завдання JavaScript – відгукуватися на дії користувача, обробляти натискання клавіш, переміщення курсора, кліки мишкою. JavaScript також дає можливість вводити повідомлення, посилати запити на сервер, а також завантажує дані без перезавантаження сторінки, і так далі.
Бекенд-розробка: «серце» вашого сайту
Backend – це програмно-апаратна частина проекту; це все те, що відбувається на стороні сервера і що залишається невидимим користувачеві (сам сервер теж є частиною бекенду, тільки апаратного)
Бекенд — «невидимий двигун» сайту. Бекенд-розробники пишуть код, використовуючи такі популярні мови програмування, як PHP, Ruby on Rails, Python, .NET та інші. Коли потрібно виконати якусь операцію, бекенд-код взаємодіє з базою даних (використовуючи MySQL, SQL, Microsoft Access і т.д.). Після цього необхідна інформація повертається користувачу в формі фронтенд-коду.
Займаєтесь онлайн-шопінгом? Підписуєтесь на розсилку? Редагуєте контент на сторінці? Яку б операцію ви не виконували, врешті-решт за неї відповідає бекенд-код. Інформація оновлюється, змінюється або видаляється в базі даних.
Отже, звідси і назва front – це видиме спереду, back – це те, що приховано позаду, невидиме.
Умовно CMS поділяють на два сховища інформації: для баз даних з контентом сторінок та елементів візуалізації, що дають змогу відображати вміст сайту відвідувачам (графічні елементи, шаблони тощо). CMS також називають рушіями.
Для зручної роботи з інформаційним наповненням більшість рушіїв мають інструмент візуального редактора (WYSIWYG) — програму, яка створює HTML-код, полегшуючи користувачам форматування текстової розмітки. Тому в процесі роботи з текстом безпосередньо видно кінцевий результат.
CMS призначена для самостійного наповнення сайта контентом без залучення технічних спеціалістів. Щоб використовувати рушій, спеціальні знання програмування та веб-технології, як правило, не потрібні. Для роботи із системою управління сайтом потрібно засвоїти її принципи та детально вивчити керівництво з експлуатації CMS.
Рушії класифікують за кількома критеріями:
За видом ліцензій розрізняють:
відкриті CMS. Є відкритий вихідний код, доступний для користувачів для перегляду, редагування, вивчення та створення нового програмного забезпечення на його основі (наприклад, Wordpress, Drupal, Joomla);
закриті рушії. Ці програми, як правило, платні, вони є приватною власністю їх правовласників і творців. Вихідний код таких рушіїв закрито для вивчення, перегляду, модифікації та редагування (наприклад, Microsoft SharePoint Server, UlterSuite CMS, Site Sapiens ECMP).
За способом роботи шаблона розрізняють рушії:
з автономним опрацювання даних. Призначені для створення статичних сайтів;
інтерактивні CMS. Призначені для створення динамічних сайтів;
гібриди. Містять функції автономних й інтерактивних рушіїв.
Система керування вмістом сайту — це ядро інтернет-ресурсу. Завдяки використанню CMS можна вільно керувати інформацією на сайті:
легко і швидко змінювати тексти;
завантажувати нові зображення й фотографії;
створювати та видаляти сторінки й розділи;
розміщувати новини та акції;
розміщувати прайс-листи та іншу інформацію для закачування.
До основних переваг системи управління належать такі:
Простота — можна виконувати операції із сайтом дуже швидко й без спеціальних навичок.
Функціональність — система управління дає можливість ефективно розв’язувати будь-які завдання, що покладаються на сайт. Вона не прив’язана до конкретних технологій, тобто на ній легко будувати як flash-сайти, так і HTML-ресурси. CMS не накладає обмежень на функціональність ресурсу, який створюється.
Гнучкість — система управління гнучко перебудовується під кожний проект за рахунок використання модульної структури.
Висока швидкість роботи — система управління не виконує зайвих дій, а тому працює максимально швидко. CMS призначено для сайтів з високою відвідуваністю та сайтів на просуванні, де швидкість відгуку є одним з найважливіших параметрів.
Захист даних — система управління захищає ваші дані. Якщо деяку сторінку було видалено випадково, її можна легко відновити.
Більшість CMS систем мають такі модулі: фотогалерея, портфоліо, каталог товарів, розширений каталог, кошик для замовлення, зворотній зв’язок, гостьова книга, відгуки, коментарі, розсилка, новини, статті, відеогалерея, опитування, пошук, карта сайту.
Найпопулярніші CMS:
Joomla. Безкоштовна система управління контентом сайту. Вона яскрава та зручна для користувачів, а також багатофункціональна. Надає постійні зручні оновлення та робить це оперативно й вчасно.
Drupal. Безкоштовна CMS. Придатна для розробників і дуже зручна у використанні. Вона дозволяє бачити усі можливі веб-ресурси та з надзвичайною легкістю редагує контент. Якщо ти початківець в розробці – обирай саме цю систему.
MODx. Безкоштовна CMS. Її ключова особливість – практичність та продуктивність. Витримує безліч правок, не зависає, не допускає просідання робочого процесу при редагуванні та налаштуванні сайту. Для всіх, хто хоче працювати надмірно та оперативно ця система – ідеальний помічник.
WordPress. Безкоштовна CMS. Призначена здебільшого для сайтів та блогів. Це як конструктор сайтів, найпопулярніший серед не-програмістів та не-розробників. Дуже легка, функціональна, зручна при налаштуванні та порівняно надійна навіть для складно організованого сайту.
OpenCart. Безкоштовна CMS. Ідеально пасує для інтернет-магазинів через свою надвисоку оперативність та багатофункціональність.
Але не потрібно думати, що безкоштовні системи – гірші. Якість CMS не залежить від того, платна вона чи безкоштовна. Просто для кожного проекту є своя система. Якщо інтернет-магазин – найкраще обрати OpenCart, якщо адаптивний сайт - WordPress, якщо блог, то чому б не зупинитися на виборі Drupal для початківців?
Нижче наведений загальний рейтинг CMS на 2021 рік у відсотках та кількості опитаних доменів.