5 креативних сайтів для юристів та помилки, які ми знайшли в їх дизайні
В юриспруденції теж є місце креативу! Доказ тому — сайти юридичних послуг з нашої добірки нижче. Але!
Ми помітили, що більшість сайтів юридичних компаній містять помилки в дизайні. Через них вони можуть втрачати клієнтів і конверсії. То ж цю статтю ми перетворили на своєрідний "розбір польотів". Ми не просто покажемо приклади цікавих сайтів юридичних послуг, а й обговоримо їх недоліки. Детальніше про них розповість дизайнер та ілюстратор Weblium Ігор Мароха.
Приклад №1: Roulston Urquhart Criminal Defence - кримінальне право
Оригінальність цього сайту — у фотографії на головній сторінці. Вона нагадує постер серіалу. На думку відразу спадає "Як уникнути покарання за вбивство", "Юристи Бостона" чи щось подібне. Такі асоціації автоматично підвищують інтерес до самої компанії, змушують повірити, що її співробітники — такі ж круті фахівці, як і герої серіалів. Цікавий хід! Тільки завдяки йому одному сайт Roulston Urquhart Criminal Defence можна назвати одним з кращих прикладів односторінкових сайтів юридичних послуг. Але є нюанси.
Ігор: "Задум цікавий, реалізація — не дуже. Дизайн цього сайту в тому вигляді як він є зараз важкий для сприйняття. Тіні навколо кнопок та інших елементів, відсутність контрасту - все це ускладнює читання тексту. Тіні краще прибрати взагалі, особливо ті, що навколо кнопок з СТА — ці кнопки й без тіней добре видно.
Тексту тут дуже багато, але за змістом 80% — це просто «вода», красиві слова, які не дають чіткого уявлення про компетенцію компанії. Я б абсолютно точно скоротив розділ Practice Areas: залишив би тільки іконки з заголовками — лише це і містить для клієнта важливу інформацію, все інше — зайвий набір букв. Він займає місце на сторінці, але нічого важливого читачеві не пропонує.
Блок з відгуками клієнтів теж зроблений погано. Він нечитабельний, знайти його на сторінці — і то важко. У самих відгуках немає життя, вони написані сухо, наче якійсь звіт. То ж покладену на них функцію — переконати користувача в авторитетності компанії — вони не виконують. Те саме стосується заголовків. Вони також непомітні, при активному скролінгу їх легко випустити з уваги. Скриншот нижче це доводить. Той, що ліворуч, демонструє як блок з відгуками виглядає на сайті зараза. Скрин, що праворуч, — приклад того, як зробити цей самий блок яскравішим. Потрібно лише виділити заголовок і кілька фрагментів у тексті, і все. Блок сприймається зовсім по-іншому.
Моя думка: сайт Roulston Urquhart Criminal Defence важко читати. Те, що важливо (відгуки клієнтів), ледь знайдеш, зате безглуздого тексту (у тому ж Practice Areas, наприклад) - хоч лопатою горни. Тут до ворожки не ходи, одразу зрозуміло: такий дизайн відлякає чимало користувачів. Вони просто не захочуть витрачати час на те, щоб вдивлятися та вчитуватись у текст на цьому сайті. Навіщо, якщо є інші, більш зручні та легкі?».
Приклад №2: William Rhoades — юрист з питань сімейного права
Сайт створено на платформі Weblium
Це — класичний сайт-візитка. Дизайн не вразить вас супер несподіваними елементами, але він легкий для сприйняття і не заважає користувачеві вивчати сайт. А це тому, що текстовий контент правильно розташований на сторінці.
Ігор: «Ми в Weblium дотримуємося суворих правил при оформленні контенту на сайті. І цей шаблон це підтверджує. Дивіться: весь текст тут розбитий на тематичні блоки, кожен з них забезпечений зрозумілим заголовком, то ж їх легко побачити Інформація подана коротко, але її достатньо, щоб отримати уявлення про компетенції фахівця. Тепер порівняйте цей сайт з попереднім. Який з них вам легше читати? Який викликає більше довіри? Упевнений, що виберете цей, а все тому, що тут грамотно оформлений текстовий контент».
Приклад 3: Tamara N. Hodler — юридична фірма
Якщо сайт компанії Roulston Urquhart Criminal Defence нагадує постер до серіалу, то цей викликає асоціації з обкладинкою журналу. Заголовки, шрифти, фотографія на хедері — все стилізовано під сучасне друковане видання. Виглядає красиво, цікаво, однозначно привертає увагу. Саме тому ми додали компанію Тамара Н. Ходлер у свій список кращих прикладів сайтів юридичних послуг. Але тут теж є нюанс, навіть не один.
Ігор: «На головній сторінці сайту не розповідається про досвід компанії, досягнення тощо. Замість цього — фрагменти матеріалів з американських ЗМІ зі згадкою засновниці компанії Тамари Н. Ходлер. Це перетворює головну сторінку на лонгрід. Сумніваюся, що хтось його читає. Але дивує інше.
Людина, яка шукає послуги юриста, хоче на сайті побачити конкретну інформацію, яка підтверджує професіоналізм компанії. А Тамара Н.Ходлер пропонує нам фрагменти зі статей Chicago Tribune. Так, у них коротко розкривається авторитетність цієї жінки, але все це подається якось хаотично, безсистемно. В результаті ти просто тонеш у цьому потоку інформації.
Є тут і інші проблеми. Наприклад, текст, який ви бачите після фотографії, розтягнутий по ширині екрану — це неправильно з точки зору веб-дизайну. Текст зазвичай вирівнюють по лівому краю, а якщо він завеликий, то його розбивають на два блоки — так легше читати. Перевірте самі. Подивіться на скриншоти нижче, порівняйте те, що зараз є на сайті, (ліворуч) із тим, що могло б там бути (праворуч). Різниця є, і вона вирішує.
Надмірна анімація також псує враження від сайту. А форму і контактні дані можна вмістити в один блок і не розтягувати на всю сторінку.
Але треба віддати належне сайту Тамари Н.Ходлер: тут можна вручну змінювати шрифт. Слабозорі люди це точно оцінять».
Приклад №4: ATL — відшкодування збитків
Додали ATL в наш список кращих прикладів сайтів юридичних послуг, тому що сподобалося виконання хедера. Більшість компаній для його оформлення використовують рандомні картинки або фотографії ключових співробітників, і це нормально. Просто через такий підхід сайти юридичних послуг виглядають схожими один на одного. Компанія ATL знайшла спосіб ефектно виділитися серед інших, презентувати себе і донести клієнтам, яку вигоду вони отримають від співпраці.
Ігор: «Сайт загалом непоганий, але деякі недоліки в його дизайні все одно впадають в очі. Наприклад, мені здаються зайвими анімації на іконках в розділі We will take it from here — вони що є, що немає. Якщо їх прибрати — нічого не зміниться. Заголовки в цьому ж розділі потрібно зробити більш помітними, яскравішими — погано читаються.
Є питання до навігації в хедері. При наведенні на меню випадає довжелезний список, пробіли в ньому виставлено некоректно, тож букви й слова змішуються в кучу — у типографіці це називають порушенням правила «внутрішнього зовнішнього».
Так виглядає текст із порушенням правила "внутрішнього зовнішнього" (ліворуч) і без порушення — (праворуч). На перший погляд, різниця незначна, але якщо ви придивитесь, то помітите, що читати текст праворуч набагато легше. У першому випадку текст навіть не хочеться переглядати через те, що він дрібний, збитий у купу. На варіанті, що праворуч, навпаки, все добре видно. Текст читається автоматично, навіть якщо ви не мали наміру це робити й просто випадково навели курсор на меню.
Ігор: «Зрештою, при натисканні на жовту кнопку з номером телефону (лівий верхній кут) потрапляємо на сторінку з пропозицією залишити повідомлення. То ж навіщо було додавати номер телефону на кнопку, якщо дзвонити через неї все одно не можна? Логічніше написати на кнопці «Контакти» чи «Зв'язатися з нами».
Ну, і добірка лого внизу сторінки нагадує стару дошку пошани. Можна зробити у вигляді медіагалереї — весь розділ відразу стане цікавішим для глядача. Подивіться на скриншоти нижче та переконайтеся самі. На першому — оригінальне оформлення, взяте з сайту ATL Firm. На другому — мій, трохи перероблений варіант нашвидкуруч».
Приклад №5 Emma Pratt Notary — нотаріус
Сайт створено на платформі Weblium
Це — демонстрація того, як зробити дизайн сайту юриста кольоровим, яскравим та строгим одночасно й без особливих зусиль. Все завдяки поєднанню відтінків. Використання яскравого зеленого кольору «оживляє» дизайн, він здається вже не таким формальним. При цьому зелений виглядає гармонійно, не «ріже» око. Через таке вдале поєднання відтінків ми й внесли Emma Pratt Notary у список кращих прикладів односторінкових сайтів юридичних послуг.
Ігор: «Тут забагато текстового контенту. Розповідь про те, де і коли народилася Емма здається зайвою. Але все це не має значення, тому що контент візуально добре оформлений. Сайт чітко розділений на тематичні блоки, у кожного блоку є помітний заголовок. Це допомагає легко знаходити потрібну інформацію і не плутатися в процесі. Те, що читати нецікаво, ви можете легко проскролити, не хвилюючись, що випадково пропустите щось важливе, адже кожний тематичний блок чітко виділено кольорами та заголовками».
Чи сподобалися вам представлені тут дизайни? Деякі з них ви можете використовувати для створення свого сайту прямо зараз! Просто зареєструйтеся на Weblium — і отримаєте доступ до всіх створених нами шаблонам.