Главную страницу общественной организации часто начинают с приветствия председателя или истории создания. Для вас это важно, но человек, пришедший по ссылке из соцсети или из поиска, за несколько секунд решает, туда ли он попал и что ему здесь делать. Первый экран должен ответить на это без прокрутки.
Какие вопросы возникают у посетителя в первые секунды
На сайт приходят разные люди: те, кому нужна помощь или услуга; те, кто хочет помочь или вступить; журналисты, партнёры, представители власти; знакомые, которым вас посоветовали. Но вопросов у всех три: кто вы, чем занимаетесь и что можно сделать прямо сейчас. Если ответа нет, посетитель закроет вкладку, а вы об этом не узнаете.
Из чего собрать первый экран
Минимальный набор элементов:
- Заголовок-фраза. Не миссия на пять строк, а одно предложение с глаголом, территорией и адресатом: что вы делаете и для кого.
- Один главный призыв. Кнопка с конкретным действием: «Записаться на приём», «Стать волонтёром», «Прийти на встречу». Выберите то, что организации важнее всего сейчас. Остальные действия сделайте вторичными, например текстовой ссылкой.
- Признаки реальной организации. Город, телефон, адрес или график работы, год основания. Короткой строкой можно указать форму организации и регистрационные данные.
- Живая фотография. Реальные люди и реальное дело вместо стоковой картинки. Подпишите, что на снимке и где он сделан.
- Понятное меню. Пять-семь пунктов: «О нас», «Чем занимаемся», «Как помочь», «Новости», «Отчёты», «Контакты».
Условный пример: первый экран объединения «Добрый двор»
Возьмём вымышленную организацию: объединение жителей, которое благоустраивает дворы и устраивает соседские праздники. Это иллюстрация, а не описание реального проекта.
В шапке слева логотип и телефон, справа меню. Ниже крупный заголовок: «Вместе делаем дворы Заречного района безопаснее и уютнее». Подзаголовок: «Общественная организация жителей, работаем с 2009 года. Организуем субботники, чиним детские площадки, проводим праздники для соседей». Рядом фотография с субботника и подпись: «Двор на ул. Школьной, весна».
Под текстом кнопка «Прийти на ближайший субботник» и маленькая ссылка «Поддержать работу объединения». Ещё ниже строка: «Ближайшая встреча: суббота, 11:00, двор на ул. Школьной, 5». Всё это помещается на экран ноутбука и телефона без прокрутки. Посетитель понимает, чем вы занимаетесь, где работаете и как к вам присоединиться.
Что лучше убрать с первого экрана
- Автоматический слайдер с несколькими баннерами. Человек не успевает прочитать, а на телефонах он ещё и грузится медленно. О нескольких событиях расскажите в блоке анонсов ниже.
- Приветствие руководителя вместо заголовка. Его место в разделе «О нас».
- Фразу «Добро пожаловать на официальный сайт». Она ничего не сообщает о деле.
- Устав, миссию и длинную историю. Они нужны, но не в первые секунды.
- Баннеры партнёров и счётчики. Они отвлекают от главного призыва.
Как совместить несколько аудиторий
Отвечать всем сразу на первом экране не нужно. Выберите главную аудиторию. Определить её помогают вопросы, которые чаще всего приходят по телефону и почте. Для остальных сделайте сразу под первым экраном три-четыре карточки: «Мне нужна помощь», «Хочу помочь», «Я журналист или партнёр». У каждой должно быть одно предложение и ссылка на нужный раздел.
Отдельно проверьте сайт на смартфоне. Многие откроют вашу ссылку из соцсети именно там. Заголовок и кнопка должны быть видны без прокрутки, а телефон должен набираться касанием.
Проверочный список для первого экрана
- Из заголовка ясно, что делает организация, где и для кого.
- Есть одна заметная кнопка с конкретным глаголом.
- Указаны город и способ связаться: телефон, адрес или график.
- Фотография настоящая и подписана.
- Нет слайдера, из-за которого главное сообщение исчезает через несколько секунд.
- В меню не больше семи пунктов, названия понятны человеку, который о вас не слышал.
- На телефоне заголовок и кнопка видны без прокрутки.
- Незнакомому человеку можно показать экран на пять секунд, а потом спросить, чем занимается организация. Если он не ответил, текст нужно переписать.
