10 нюансів розробки сайту

Що таке домен?

Першочергово відвідувачу на сайт потрібно буде якось потрапляти. Щоб це зробити насправді є два шляхи: необхідно або здійснити перехід по вашому рекламному оголошенню, або безпосередньо набрати його літерну адресу. Ця літерна адреса є доменом сайту.

Доменне ім’я складається з двох частин: власне імені та доменної зони. Обидві частини поділяються крапкою. При цьому доменна зона «.ua» виділена виключно для національних торгових марок, тобто, щоб зареєструвати домен у цій зоні, потрібно бути власником відповідної торгової марки.

Рекомендації при підборі імені наступні:
👉 воно має бути легким у наборі: не більше, ніж 10 символів, бо інакше не уникнути помилок при введенні;
👉 легко сприйматися, тобто складатися з одного зрозумілого слова та не містити знаки «-» або «_»;
👉 запам’ятовуватися. Як правило, використовують англомовну назву підприємства чи слова, пов’язаного з основним видом діяльності.

Звертаємо увагу, що перехід по рекламним оголошенням платний, тоді як прямі заходи – безкоштовні. Правильний підбір домену допомагає зекономити гроші.

Як обрати платформу?

Веб-сторінка – це візуальне відображення програмної частини сайту. Програмна частина складається безпосередньо з двох елементів:

➡️ базової платформи, розробкою якого займаються безпосередньо програмісти та

➡️ редактора сайту, тобто внутрішньої програми, яка дозволяє співробітнику без навичок програмування вносити чи редагувати інформацію.

Перед розробкою сайту поцікавтеся, на якій платформі він буде базуватися та наскільки складний редактор сайту? Почитайте відгуки про цю платформу на форумах.

Інформація на сайті періодично застаріває та потребує актуалізації. Якщо редактора не буде або користування ним складне, то у разі потреби оновлення інформації це спричинить неможливість її оновити самостійно. Відповідно виникнуть додаткові витрати на оплату залучення програміста.

Як визначитися з дизайном?

Коли ви заходите на сайт, то спочатку сприймаєте його візуально. Від цього першого враження насправді залежить ваша емпатійність, а часто й час перебування на сторінці.

Рекомендації щодо дизайну сайту такі:

➡️ кольорова гама. Не використовуйте багато кольорів та відтінків. Максимально допустима кількість кольорів – три. Використовуйте кольори, що поєднуються;

➡️ загальне оформлення. Зазвичай сайт складається з «хедеру» або «шапки» (верхній графічний елемент із зазначенням назви, адреси, слогану), меню, основного текстового вікна та допоміжних меню, «футеру» або «підвалу», куди виноситься допоміжні лінки, строки пошуку;

➡️ графічні елементи. Не варто перевантажувати сторінку малюнками, іконками, графіками, діаграмами та таблицями. Графічні елементи мають доповнювати текстову частину, а не підміняти її.

Пам’ятайте, що усі елементи сайту мають доповнювати один одного, а не конкурувати за увагу користувача.

Як розробити зручну структуру сайту?

Намагайтеся розмістити інформацію так, щоб вона помістилася в одному вікні монітору або її можна було знайти максимум за 2-3 свайпи по екрану телефону.

Сучасний користувач дещо поверхневий: він, як правило, швидко втрачає увагу, відволікається на різні елементи, не хоче читати великий обсяг тексту, переглядати довготривалі відео, переходити по складним меню.

Колись існувало правило «3 кліків», яке означало, що, якщо користувач не знайде потрібну інформацію в 3 кліки, то він припиняє користування ресурсом. Це правило й зараз актуально як ніколи.

А що ж робити, якщо все таки потрібно розмістити багато текстової інформації або значну кількість блоків? – Вам на допомогу прийдуть:

➡️ структуризація інформації, тобто поділ на блоки, розділи;

➡️ графічне оформлення текстів, тобто додавання малюнків, іконок, емодзі, виділення кольором строчок чи стовпців таблиць тощо;

➡️ «псевдо-кліки», тобто кліки користувача, які візуально не переводять на іншу сторінку, а деталізують поточну. Такі кліки можуть розкривати частково прихований текст, викликати спливаючі вікна, міняти інформацію у сусідньому вікні тощо. Іншими словами дозовано видавати інформацію не змінюючи основну сторінку.

Як розробити зручне меню?

Воно дозволяє користувачеві оперативно переходити на сторінки з цільовою інформацією. Саме меню має бути чітко структуровано й інтуїтивно зрозумілим, та наскільки можна коротким, без багаторівневої внутрішньої підструктури.

Веб-сторінки мають унікальну особливість – встановлення можливості переходів (лінків) при натисканні на певні слова. Таким чином, встановивши лінки на ключові слова за текстом, можна допомогти користувачеві зробити швидкий перехід на сторінку, що зацікавила його, без обов’язкового застосування меню. Ключові слова з посиланнями зазвичай підкреслені, відзначені іншим кольором і при наведенні курсору він змінює своє зображення.

До речі, рекомендую встановити лінки, які відкривають сторінки у новій вкладці, а не у поточному вікні. Тим самим ви допоможете користувачу швидко повернутися до попередньої сторінки знову ж таки без використання меню.

Які правила читабельності?

Дотримуйтесь таких правил, щоб текст був читабельним:

➡️ дотримуйтесь теми. Кожна цільова сторінка повинна максимально повно відображати лише одну тему. Не варто перевантажувати текст зайвою, узагальненою чи нецільовою інформацією;

➡️ розділ – опис. Використовуйте групування тексту за розділами із зазначенням їх назв. Шрифт покажчика розділу не повинен перевищувати розміру шрифту тексту більше, ніж на 2 одиниці;

➡️ абзаци. Текст слід розділяти на абзаци. Бажано, щоб у розділі кількість абзаців не перевищувала 5;

➡️ таблиці та графіки. Цифрова і статистична інформація краще сприймається при додаванні таблиць і діаграм, вставлених між текстом.

Вимоги до шрифту: використовуйте стандартні та читабельні шрифти, уникайте засічок, курсиву, виділення жирним, надто вузьких або надто широких шрифтів. Не зловживайте із частотою зміни та розміром шрифту. Прийнятний розмір шрифту для базового тексту – від 9 до 14, для заголовків – від 11 до 16.

Що таке допоміжний функціонал?

Позитивний ефект для користувачів мають функції зміни мови сайту, наявність корзини замовлення, тематичний блог або відео-роз’яснення, активні форми зворотного зв’язку або відправки документів, прямий чат з менеджером або чат-бот.

Додавання такого функціоналу – це свого роду прояв турботи про відвідувача і, одночасно, підвищення шансу його утримання. Якщо користувач щось не знайшов чи заплутався, але загалом готовий співпрацювати з вами, то він повинен мати змогу поставити питання та якомога оперативніше отримати відповідь на нього.

При великій кількості інформації слід підключити ще й такі додаткові функції, як пошук та показ структури сайту. Як правило, вони виносяться у футер (підвал) сайту.

Пам’ятаєте про банери?

При розробці концепції сайту варто визначитися із використанням статичних або динамічних рекламних оголошень – банерів. Пам’ятайте, що завдання банера – привернути увагу до себе і зробити перехід на сторінку з інформацією, що рекламується, але тим самим він відвертає увагу від сторінки перебування.

Тому банери краще розміщувати внизу сторінки – це розраховано на користувачів, яким недостатньо вже поданої інформації або у яких є сумніви. На таких банерах можна встановити переходи на інші сторінки з суміжними сервісами чи альтернативними продуктами.

Посеред тексту або збоку краще розмістити банери з спеціальними пропозиціями, акційними умовами, іншими пропозиціями, що стимулюють попит.

При цьому взагалі не варто розміщувати на своїй сторінці рекламні оголошення або банера інших компаній, а тим більше дозволяти автоматичний показ реклами. Це знижує імідж сайту.

Як краще співпрацювати з дизайнером?

Цей нюанс більше стосується процесу розробки дизайну сайту.

Як правило, компанії підрядчики пропонують наступний алгоритм дій: вони розробляють 3 різних варіант дизайну, ви обираєте один з них і потім його допрацьовують.

Такий підхід насправді поганий. От дивіться: станьте на місце дизайнера. Спочатку ви робите, а вірогідніше перероблюєте під умови техзавдання якийсь з раніше розроблених, але не затверджених варіантів, що подобається вам. Ще два варіанти потрібні для статистики, тому розробляються як-то кажуть: «По образу і подобі». Саме такі три варіанти подаються замовнику.

Це добре, якщо вам хоч якийсь сподобається. А якщо ні? Дизайнер сприймає це як свого роду образу, його внутрішній запал гасне. Подальша робота буде на «відвали».

Рекомендуємо інший підхід. Організуйте зустріч з дизайнером і разом попрацюйте над підбором кольорів, структурою, елементами оформлення. Повірте, ви витратите менше часу, при цьому отримаєте варіант, що буде подобатися вам обом. Розробка буде ефективною, а результат виправдає очікування.

Що таке адаптивність?

Адаптивність – це здатність сайту підлаштовуватися під пристрої з різними характеристиками екрану.

Не забувайте про це на стадії розробки дизайну, бо хтось працює з стаціонарного комп’ютера, хтось – з нетбуку, інший – з планшету чи мобільного телефону. Ваш сайт має задовольняти користувачів будь-яких пристроїв.