Як прискорити створення оригінальних інформаційних сторінок сайту за допомогою шаблонів веб-редактора
Як наповнюється більшість сайтів
Більшість сайтів наповнюються за допомогою такого інструменту.
Що роблять, якщо контент потрібно уявити оригінально?
Не багато хто в сайти вбудовує конструктори контенту (контент-білдери, візуальні конструктори, Content Construction Kit) - інструменти, що дозволяють створювати сторінки з віджетів. Приклад – процес створення сторінок у сучасних SaaS конструкторах сайтів. Даний підхід при розробці власного сайту впирається в проблему гнучкості налаштування наявних на ринку інструментів та можливостей їх інтеграції та подальшого супроводу. Код тих рішень, із якими нам доводилося працювати, мало підтримуємо.
Інші довго і болісно розробляють такі сторінки за сценарієм самостійного міні-проекту. Це коли розробка кожної інформаційної сторінки схожа на створення лендингу: складання технічного завдання, формування контенту, прототип, малювання та затвердження макета дизайну, верстка, програмування та тестування. Оновлювати сторінки, створені за такою механікою, теж незручно та накладно, найчастіше їх можуть правити лише верстальники. А знання того, які блоки верстки з інших сторінок можуть бути запозичені на новій, складно передаються між фахівцями. У результаті може вийти добре, але довго та дорого.
Тому з часом ми дійшли наповнення сторінок нашого портфоліо в інший спосіб. Ми використовували унікальні дизайнерські рішення для опису кожного проекту у портфоліо. Деякі роботи виставлялися у вигляді зверстаних сторінок, які ніяк не підключені до адміністративної системи сайту, деякі підключалися частково.
У хід йшли слайдери, блоки цитат клієнтів, представлення робіт у вигляді реальних пристроїв з можливістю інтерактивногоперемикання між ними та багато іншого.
Для того, щоб наше портфоліо за візуальною складовою та змістом відповідало нашим роботам, у його формуванні брала участь велика кількість фахівців:
- Product Owner, Project Manager, а також решта команди проекту – для формування початкового змісту сторінки проекту та розміщення акцентів на ній.
- Редактор і маркетолог – для формування остаточного змісту сторінки.
- Контент-менеджер — щоб заповнити веб-сторінки вмістом.
- Проектувальник та/або дизайнер – для надання інформації гарної форми.
- Верстальник для втілення придуманої дизайнером форми у вигляді зверстаної сторінки.
- Програміст - для виведення необхідної інформації з бази даних або підключення до іншого складного функціоналу.
- Тестувальник – для забезпечення впевненості, що все працює як треба.
Додаткові умови — забезпечити адаптивність та оперативно вносити зміни щодо пропозицій від замовника роботи.
Додамо сюди завантаження команди за комерційними проектами, яка завжди у всіх замовних розробників пріоритетніша за внутрішні роботи. І отримуємо великі трудовитрати, розмащені не дуже рівним шаром на багато місяців.
Натомість роботи в портфоліо за такого підходу виходять повністю унікальними.
Додатковий бонус – опрацювати механізм використання такого підходу для клієнтських проектів. Для тих, де важливо вміти гнучко та швидко подавати великі обсяги інформації (ЗМІ, інформаційні портали, корпоративні сайти з великою кількістю по різному структурованому контенту, особливо в умовах більш ніж одного контент-менеджера на проекті).
Дані блоки готуються спільно дизайнером та верстальникомлише на етапі їх створення. Подальше їх використання в будь-якому складі та порядку, а також можливість редагувати вміст цих блоків, і було основою побудови сторінок.
Шаблон - це заздалегідь підготовлений фрагмент верстки, який при виборі можна вставити в потрібне місце.
Нижче наведемо приклад створення блоку цитати, який на сайті виглядатиме так:
Виберіть пункт меню «Вставити шаблон». У діалоговому вікні, що з'явилося, вибираємо один з зумовлених нами шаблонів.
Шаблон легко наповнюється звичним способом - картинка замінюється іншою картинкою, текст стирається і пишеться новий:
Нижче показано, як без залучення верстальників шаблон цитати стає цитатою Миколи Другого:
Подібним чином можна додавати скільки завгодно блоків на сторінку, а зайві блоки легко видаляти.
На прикладі нижче можна побачити процес наповнення слайдера зображеннями:
І кінцевий результат:
Тепер процес створення нової сторінки став чимось схожим на роботу в модних сучасних конструкторах лендингів Тільда, ReadyMag і т.п.
Ось деякі реалізовані за допомогою шаблонів блоки з різних проектів: