Будь-який сайт починається із створення технічного завдання (ТЗ). Як правило, студія в яку ви звертаєтеся надає особисто розроблене ТЗ клієнту (бриф), яке той повинен заповнити самостійно або разом із менеджером, який буде вести сайт. Якщо такого ТЗ компанія не має, то подбайте самостійно, щоб його скласти і максимально опишіть, що ви хочете бачити на сайті.
Бриф на сайт
На нашому сайті ви можете знайти 3 брифи на створення найпоширеніших видів сайту:
Ви можете їх подивитися як приклад або заповнити і потім передати до студії, яку оберете для створення свого сайту.
Техническое задание на разработку сайта должно включать две составляющие:
- ТЗ на дизайн сайту, тобто те, як сайт виглядатиме. Тут же опрацьовується структура всього сайту, особливо важливо це зробити для інтернет-магазину, та структура кожної сторінки.
- ТЗ на функціонал, тобто те, як працюватимуть різні елементи, кнопки, іконки, слайдери, калькулятори тощо. на сайті. Для великих корпоративних сайтів та інтернет-магазинів сюди також входить функціонал особистого кабінету.
Чому так важливо створити ТЗ для сайту?
Багато хто нехтує створенням ТЗ для сайту, думаючи, що на цьому можна заощадити. Але я б сказала, що технічне завдання для сайту — це найважливіше, що ви повинні зробити для свого сайту.
По-перше, вказавши всі нюанси, які ви хочете бачити на сайті, і обговоривши їх із розробником, ви розумієте, що той може зробити, а що ні.
По-друге, ви скоротите час на розробку дизайну і зможете запобігти множинні переробок сайту в майбутньому, що сильно скоротить ваші витрати. ТЗ допоможе вам переконатись, що виконавець правильно зрозумів, що ви хочете.
По-третє, вам буде легше прийняти роботу на всіх етапах. Вам буде достатньо просто перевірити кожен пункт по ТЗ. Якщо щось планували зробити, а воно не зроблено, ви завжди зможете спертися на технічне завдання для сайту, яке ви надали розробнику. Це ваша страховка. Обов'язково вимагайте, щоб ТЗ було прикріплено до договору.
У моїй практиці були сайти, які повністю або частково перероблялися 5-6 разів за 2 роки, оскільки не було ТЗ. Клієнт не розумів що хоче і щоразу, коли він чув нову інформацію з боку, він змінював свій погляд на поточний сайт. Пам'ятайте, за всі ситуації платить тільки замовник, тобто ви.
ТЗ на сайт
Технічні вимоги до сайту
Нижче я наведу список із 32 пунктів, які не відносяться безпосередньо до ТЗ, просто скачайте його та прикріпіть до свого основного ТЗ. Це найчастіші помилки програмістів, які зустрічалися мені на сайтах. Цей список я складала протягом майже 3-х років роботи у веб-студії і сьогодні прикріплюю його до кожного ТЗ, щоби перестрахуватися черговий раз.
1. Робіть сайт під Boodstrap
Стандартний веб-сайт малюється під Boodstrap. Це система, яка дозволяє зробити будь-який сайт адаптивним під будь-який мобільний пристрій. Також це дозволяє заощадити левову частину коштів.
2. Заголовки на сторінці
H1, H2, H3, H4, H5, H6. Останні три заголовки менше, ніж звичайний жирний шрифт. Ними рідко користуються на сайті, але краще, щоб їх запрограмували одразу.
Заголовок H1 — повинен зустрічатися тільки 1 раз на сторінці і завжди бути першим.
3. Теги для заголовків
Заголовок повинен мати тег, що відкривається і закривається.
Наприклад:
Правильно:
Заголовок сторінки
Неправильне написання:
У такому вигляді пошуковики Google і Яндекс не розуміють заголовки, як заголовок.
4. Заголовки H1-H6 повинні використовуватись лише у блоці основного тексту.
Заголовки H1-H6 не повинні використовуватися в головному меню, меню праворуч або зліва, футері, формі зворотного зв'язку і т.д.
5. У дизайні та редакторі в адмінці мають бути налаштовані всі стилі шрифтів
Шрифти:
H1-h6
Основний шрифт
Жирний, курсив, підкреслення
Символи (ступінь, нижній індекс, градуси).
Вирівнювання
Вирівнювання тексту по лівому та правому краю, а також по середині.
Списки:
- маркований список;
- нумерований список.
Налаштовано список, якщо ліворуч від нього стоїть картинка.
6. Не використовувати списки чи інші стилі для формування меню та інших елементів на сайті
Наприклад:
Правильно
Списки:
- маркований список;
- нумерований список.
Неправильно, коли роблять в адмінці так, а відображається на сторінці “Списки” жирним
- Списки:
- маркований список;
- нумерований список.
Також я зустрічала ситуацію, коли текст взагалі не можна було зробити списком, тому що цей стиль адаптувався для створення головного меню на сайті. Це жахливо!
7. Блок “Про нас” та “Відгуки” на головній сторінці
Повинні бути відсутні на головній сторінці!
Можуть бути лише, якщо вони не дублюють текст з інших сторінок — тобто вони унікальні.
У крайньому разі повинні бути закриті від індексації.
Тобто, якщо у вас на сайті є окрема сторінка “Про нас”, то не можна виводити частину тексту на головній. А якщо дуже хочеться, то постарайтеся написати інший текст.
8. Меню у футері
Не повинне дублювати головне меню сайту.
У крайньому разі п.б. закрито від індексації.
Пошукові системи вважають, що з однієї сторінки на іншу достатньо поставити одне посилання.
9. Фото матеріали для сайту
Повинні бути у реальному розмірі чи пропорційні йому.
Якщо, наприклад, ви фотографуєте об'єкти або роботи, то не варто їх викладати на сайт прямо в такому вигляді. По-перше, вони багато важать і так швидко закінчиться місце на хостингу. По-друге, це уповільнюватиме швидкість завантаження сайту.
10. Прев'ю (опис) до статей, новин тощо.
Аналогічно пункту “Про компанію” та “Відгуки”, опис до статей на сторінці категорії не повинен дублювати ні перший абзац із статті, ні якусь із їх частин.
Це найпоширеніша справа для CMS. Але якщо ви робите сайт не самостійно, а замовляєте у студії, то вони знають, як вирішити цю проблему.
11. Сторінка 404
Ця сторінка відображається, коли людина намагається відкрити неіснуюче посилання на сайті. Система повідомляє про помилку на сайті.
12. Форма зворотного зв'язку
Повинна бути акцентованою, а не розміщуватись у футері. Там її, в принципі, ніхто не побачить.
13. Двоколонова структура сайту, призводить до ряду проблем
Якось ми зробили сайт із двоколончастою структурою сторінок.
Результат показав:
- якщо тексту багато, то читати незручно, людина ніколи не повертатиметься до другої колонки. Або просто пропускатиме частину тексту.
- через таке розташування було прийнято рішення розбити текст заголовками. У результаті заголовки там стоять не за змістом, а для поділу тексту візуально.
14. Кнопки "Замовити", "Замовити дзвінок", "Надіслати заявку", "Пройти тест", "Купити", "Дізнатися ціну"
Повинні бути контрастними порівняно із загальним дизайном сайту та не зливатися з розділами.
15. Хлібні крихти
- Легше сприймаються ліворуч, ніж праворуч або посередині.
- Шлях починається з головної сторінки.
- Якщо у путі вказана “Назва сторінки”, то вона має бути не клікабельною (без посилання).
16. Можливість вставляти у редакторі
- фото
- відео з YouTube
- pdf-файли
- таблиці
17. Посилання під логотипом на головній сторінці
Не має бути активною.
18. Посилання в меню на відповідних сторінках
Не мають бути активними.
Наприклад, коли ви перебуваєте на сторінці “Про компанію”, посилання під меню “Про компанію” не повинно бути активним.
19. Мікророзмітка
Повинна бути. Google та Яндекс рекомендують використовувати для розмітки метод мікроданих (Schema.org).
20. Розділ "Новини"
Чи він на головній сторінці, чи це окремий розділ, новини повинні формуватися автоматично.
21. Сторінка категорії "Новини", "Блог", "Акції" — повинні бути посилання під картинкою, заголовком, кнопкою детальніше (Каталог).
“Докладніше” — укласти в
Картинка — атрибут rel = nofollow
Індексуватися може лише посилання під заголовком.
22. Заголовки конкретних сторінок із блогу, новин, статей...
Не повинні бути клікабельними на сторінках.
23. Слайдер
В ідеалі використовувати плагін (модуль), а не робити через створення сторінки чи посту. Це не правильно!
Якщо все-таки робиться так, закрити від індексу у файлі Robots.
24. Посилання на сайті
Мають бути ЧПУ без цифр і дат.
Використовуйте трансліт на латиниці.
25. Карта сайту
Має бути і відповідати файлу Robots.txt.
<30 посилань на сторінці. Якщо їх більше, то розбити на кілька сторінок.
Карт сайту може бути декілька, наприклад, для кожного розділу окремо, якщо у розділі понад 1000 товарів чи статей.
26. Назви розділів меню (WordPress)
Має бути можливість редагування. Якщо це WordPress — то в налаштуваннях меню повинна бути можливість незалежно від назви сторінки — написати назву меню коротко.
27. Файл Robots.txt
- Закрити головне дзеркало сайту.
- Вказати адресу карти сайту в xml.
- Закрити від небажаних пошукових систем, наприклад Yohoo.
- Закрити від індексації всі необхідні сторінки або розділи та відкрити лише потрібні.
28. SEO оптимізація
Повинні бути:
- title
- description
- alt для зображення
- відповідь 200
- 301 редирект
- відповідь 404
- адаптивна верстка
- URL — найдовший до 150 символів
29. Посилання на сайт
http://www.site.ru/
http://www.site.ru/index.php
http://www.site.ru
http://site.ru
https://www.site.ru/
Правильне посилання:
https://www.site.ru/
Повинен бути налаштований 301 редирект і
прописано у файлі Robots.txt
30. SEO-текст на сторінках категорій товарів
Якщо у вас є пагінація за категорією, то SEO-текст пишеться тільки на першій сторінці, на всіх інших сторінках текстового блоку не повинно бути.
Наприклад, у вас є сторінки 1, 2, 3, 4, 5, …
Текст буде лише на сторінці — 1.
31. Сортування сторінок в інтернет магазині за датою, ціною, брендом
- Закриваються nofollow, noindex.
- До URL цих сторінок дописуються змінні та закриваються через файл Robots.txt
32. Не замінюйте довге тире на дефіс
Довге тире та дефіс — це два різні знаки в російській та українській мовах.
Ніколи не заощаджуйте на створенні технічного завдання для сайту, це заощадить вам місяці роботи та багато тисяч гривень, а іноді й доларів!