Основи веб-проектування

Веб-сайт — словно дом с множеством дверей, где нет никакой уверенности, что знакомство с ним начнется с парадного входа. В настоящее время только порядка 20-40% посещений веб-сайтов (а у некоторых сайтов этот показатель значительно ниже) начинаются с домашней страницы, остальные — с других страниц. Соответственно, необходимо обеспечить посетителям возможность начать знакомство с сайтом с любого места. Как минимум название сайта и/или организации должно быть очевидно и использоваться последовательно на всех страницах. Если название само по себе не позволяет судить о тематической принадлежности сайта — необходимы дополнительные, поясняющие элементы: описания, воззвания, слоганы.

Сайт — один из важнейших инструментов формирования доверия к вашему делу и наличие на нем доступной, ясной и верной информации об организации первый шаг на пути к завоеванию доверия. Страница «О нас» — одна из наиболее посещаемых на большинстве сайтов, в том числе на сайтах НКО. Чем лучше и честнее проработано ее содержание, чем более понятным и структурированным способом оно изложено, тем лучше посетитель поймет вас, воспримет ваши цели и идеи.

Наличие такой страницы оформилось в фактический стандарт — посетитель ожидает найти ее на вашем сайте. Если же этого не происходит, он начинает подозревать вас в недобросовестности. Содержание страницы по сути заключает в себе ответ на несколько простых вопросов — кто мы? что мы делаем? почему это важно? Но кажущаяся простота не отменяет значимости этой информации.

В сети все происходит быстро. Во время первого посещения сайта посетитель принимает решение — остаться или пойти дальше — буквально в течение нескольких секунд. В этот момент он оценивает множество аспектов сайта и один из них — актуальность. Действительно ли эта организация существует? Действительно ли она делает то, что заявляет? Действительно ли она развивается и стремится быть лучше? И ответ на все эти вопросы приходит с одного взгляда на дату последнего сообщения… что если оно было сделано полгода назад? Будет ли утвердительным ответ на вышеуказанные вопросы?

Отдельная веб-страница и сайт в целом могут представлять для посетителя “темный лес”, если мы не позаботимся заранее проложить в этом лесу тропинки, которые будут направлять и служить ориентиром. Одной из таких тропинок является визуальная иерархия, иначе говоря визуальный сюжет, который развивается на наших страницах. Сначала внимание смотрящего захватывается каким-то самым важным элементом, а затем каждый переход к менее важным элементам дополняет общий сюжет новыми подробностями.

Ориентирование пользователя «на местности», то есть на сайте — одно из важнейших условий его комфорта и, как следствие, его доверия к сайту и желания задержаться на нем подольше. Не указывая дату полностью — число, месяц, год — вы утаиваете от пользователя часть информации, не даете ему возможности быстро сориентироваться: насколько то или иное сообщение актуально относительно текущего момента. Ведь он не знает, когда оно написано — вчера или год назад. Разочарование от того, что интересная новость оказалась «несвежей», вполне может стоить вам активного волонтера или донора.

Абсолютный минимум прозрачности, который требует от НКО законодательство — публикация периодических отчетов о своей деятельности и расходовании средств. Но не стоит забывать, что при реализации своих программ и осуществлении деятельности организация имеет дело с живыми людьми.

Мы ждем от них участия, поддержки, пожертвований в той или иной форме, внимания, наконец. И что же мы предлагаем им взамен — столбик цифр в графе расходы? Важно подтверждать целевое использование средств, но не менее важно показать реальный результат их использования.

Что изменилось в жизни конкретного человека или сообщества, города, страны после того как эти средства были потрачены? Вот тот вопрос, для ответов на который не стоит жалеть места на своем сайте.

Если сообщение без адресно, оно не достигнет цели. Если вы пытаетесь адресоваться «всем» сразу, практически это означает «никому». Если кто-то и откликнется на ваш призыв, то скорее в результате «случайного попадания», но не целенаправленных усилий.

Проектируя сайт и создавая для него контент, необходимо представлять — для кого мы это делаем. Ответ на этот вопрос по сути и является описанием целевой аудитории — тех людей, на которых сайт должен воздействовать в первую очередь, побуждая к действию.

Не совершайте распространенной ошибки полагая также, что целевая аудитория — это «такие же как мы» люди. Нет, нет и еще раз нет — это люди думающие по-другому, живущие по-другому и вообще совершенно другие люди, но они — могут разделить наши взгляды и наши идеи, если только мы сумеем найти с ними общий язык. Первый шаг на этом пути очевиден — нам нужно лучше представлять себе, кто они — наша целевая аудитория.

Ключевые слова, которые пользователи ищут на вашем сайте — один из важнейших индикаторов и показателей качества вашей работы в сети.
Информацию о состоянии этого показателя предоставляют сервисы статистики посещаемости сайта. Такой сервис — не просто счетчик внизу экрана, показывающий неведомые цифры. Это действенный инструмент оценки эффективности сайта, отдельных его элементов, поиска проблемных участков и проверки соответствия поведения пользователей вашим ожиданиям.

У вас есть страница сбора пожертвований? И каков процент пользователей, добирающихся до нее в ходе одного визита? Если вы не обращаетесь регулярно к статистике своего сайта, не проверяете состояние ключевых показателей — вы ничего не знаете ни о своем сайте, ни о его посетителях. И вся ваша работа по его поддержанию и развитию эквивалентна гаданию на кофейной гуще.

В какой степени действия пользователей отвечают вашим задачам и продвигаемым проектам? Чтобы ответить на этот вопросы — установите код Google Аnalytics на своей сайт сегодня же. Если он уже установлен — спросите у своего системного администратора пароль и начните знакомство с сайтом заново.

Прозрачность, прозрачность и еще раз прозрачность — фактически, эта мантра должна «звучать» с каждой страницы сайта. Если вы не рассказываете о себе открыто и просто, не предоставляете прямой контактной информации с телефонами, адресами и реальными людьми, к которым можно обратиться — посетитель не будет вам доверять. Вы — миф, скопление электронных сигналов, может быть, вас вообще не существует.

Несмотря на то, что многие социологические исследования показывают относительно высокий уровень доверия людей к интернету, он не транслируется автоматически на отдельно взятый сайт.

Поиск важный элемент любого сайта. С одной стороны он — своего рода страховочный трос для навигации, если она не помогает посетителю найти нужную информацию. С другой — у определенной категории посетителей выработалась привычка всегда использовать поиск в качестве главного навигационного способа, лишая их этой возможности — мы лишаем себя их внимания и доверия.

Важно не только наличие поиска как такового, но и его функциональность: находятся ли материалы в ответ на запрос, располагаются ли они в порядке релевантности запросу, очевидно ли для посетителя, почему тот или иной материал попал в результат выдачи.

Задачи, которые необходимо решать сайту организации, можно так или иначе разложить на некоторые действия (одно или последовательность), которые должны совершать посетители. Если такие действия совершаются — сайт достигает своей цели, если нет — не достигает. Процент успешного достижения цели называется конверсией и является ключевым показателем оценки эффективности сайта.

Безусловно, каждый элемент сайта, начиная от заголовка окна браузера и заканчивая последней ссылкой в «подвале», вносит свой вклад в уровень конверсии. Однако вклад некоторых страниц в этот показатель выше чем у других — потому что ключевое действие совершается именно на них. Например, ждем регистрации волонтеров на мероприятие — ключевой является страница с формой регистрации. Хотим распространить обращение к общественности — ключевой является страница с текстом обращения. Хотим привлекать пожертвования — ключевой является страница с информацией о том, как это сделать.

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

Главное меню — не только основной навигационный инструмент, но еще и показатель того, насколько хорошо продумана и проработана структура сайта. Традиционно плохим походом считается слишком большое количество в пунктов меню, что часто мотивируется особенностями кратковременной памяти человека, не способной удерживать большое количество элементов. Но количество пунктов само по себе не является хорошим или плохим — проблема обычно заключается в обоснованности наличия того или иного раздела. Когда структура сайта не ясна до конца самим создателям, то действуя по методу наименьшего сопротивления, они просто добавляют в меню еще один пункт всякий раз, когда на сайте нужно разместить информацию какого-то нового типа.

Если так происходит и в вашем случае, возможно пришло время вооружиться карандашом и бумагой и устроить «перепись» разделов и категорий сайта с тем, чтобы четко определить — что и куда должно относиться.

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

Что можно ожидать от секции с наименованием «разное»? Корректная тематическая организация категорий плюс использование для их наименования устоявшихся терминов, отражающих специфику вашей предметной области (в данном случае — благотворительности) — вот рецепт “пуленепробиваемого” главного меню.

Факт, который каждый владелец сайта должен высечь в камне над своим монитором — люди в сети не читают. Это при том, что подавляющее большинство содержания веб-сайтов — текстовое. Тем не менее, попадая на веб-страницу, люди не читают — они сканируют текст. И только в том случае, если что-то в тексте привлекло их внимание и интерес, они продолжат чтение уже более осмысленно. Изменить такое поведение на отдельно взятом сайте невозможно — его необходимо учитывать. В первую очередь необходимо обеспечить «сканируемость» текста, так чтобы он не представлялся сплошным месивом, лишенным смысла и структуры. Может быть ваш текст содержит лучшие слова на свете, но если он выглядит как сплошное темное пятно — дальше первой фразы дело у пользователя не пойдет.

Чтобы этого не происходило соблюдайте несколько простых правил: выравнивайте текст по левому краю (для европейских языков), отделяйте абзацы друг от друга дополнительным расстоянием (пустой строкой) и не используйте красную строку, так как последняя сбивает прямую границу текста, по которой скользит взгляд.

Итак, люди в интернете не читают, но сканируют текст. При таком положении дел легко поддаться соблазну не размещать на своем сайте никаких текстов — но это не сработает. В силу сложившихся стереотипов, ваши посетители ожидают увидеть текст — они ожидают материала для сканирования (за редкими специфическими исключениями не предполагающими текстовой информации, например, фотосайты). Необходимо им этот материал предоставить, иначе о вашем сайте останется лишь одно впечатление: «там нет никакой информации». Поэтому на сайте должны присутствовать объемные текстовые материалы, «протяженностью» не менее нескольких абзацев. И они должны быть также структурно организованы, чтобы улучшать сканируемость. Посмотрите на следующий пример — какой текст легче воспринимать?

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

Необходимо вместо этого обеспечить узнаваемость вашего бренда, главной идеи вашей организации, хорошую визуальную организацию и фокус на важных и актуальных вопросах, освещаемых на сайте.

Существует оптимальная для чтения длина строки — она зависит от нескольких факторов: размер шрифта, межстрочное расстояние и т.п. — но для большинства веб-сайтов можно ориентироваться на величину в интервале от 50 до 75 знаков. Соответственно, если ваш сайт сверстан таким образом, что одна из колонок (иногда единственная) растягивается по всей ширине экрана, то это означает, что на больших мониторах эта оптимальная длина будет значительно превышена, превращая знакомство с вашим сайтом в сущее мучение для пользователя.

Аналогичная ситуация возникает и в случаях, когда сайт выстроен по левому краю. Тогда, чтобы продолжать знакомство с ним пользователю большого экрана придется держать голову все время повернутой влево. Вряд ли такой “опыт” можно признать успешным.

Какова вероятность, что это произойдет? Обратитесь к статистике своего сайта и посмотрите, каков процент посетителей с экранным расширением превышающим по ширине 1400рх. Вы с обнаружите, что процент этот значителен. И если на вашем сайте присутствует одна из описанных проблем, то… по крайней мере вам теперь доподлинно известно, какому количеству посетителей он доставил неудобства.

Когда-то реклама в интернете была новым явлением, но сейчас она уже хорошо знакома пользователям и они успели выработать свои, в том числе и психологические, механизмы защиты от нее. Одним из таких механизмов является так называемая баннерная слепота — невосприимчивость пользователей к рекламе, расположенной в «традиционных» местах. Обычно это верхняя, боковая и нижняя части страницы. Если в этих областях вы разместите элементы, пусть бы и не являющиеся рекламой, но похожие на нее — анонсы собственных материалов, призывы, собственные или партнерские баннеры, и даже некоторые навигационные элементы — пользователи их не заметят.

Но не только психология стоит на страже пользовательского душевного равновесия — есть еще и блокираторы рекламы в виде, например, популярных расширений для браузеров. Блокираторы скрывают рекламу, основываясь на внутренних базах данных и обучающих механизмах, но иногда страдают и вполне безобидные и даже необходимые элементы сайта, которые некорректно распознаются блокиратором как реклама.

Одна из важнейших задач навигационного механизма сайта — ориентация пользователя на нем. То есть, на каждой странице ваш сайт должен давать простой и очевидный ответ на два вопроса «Где я нахожусь?», «Куда я могу пойти дальше?». Если такого ответа нет или он не очевиден, пользователь «чувствует себя потерянным».

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

Еще одна важная задача навигационного механизма сайта — обеспечение навигационных альтернатив. Находясь на внутренней странице, расположенной “глубоко” внутри по иерархии, пользователь тем не менее не должен ощущать себя в тупике. Если на такой странице у него есть только главное меню или кнопка браузера “назад” — то это фактически тупик, потому что нельзя идти “вперед” в пределах данного раздела, только назад.

Никто не любит ходить дважды одной и той же дорогой. Поэтому признаком хорошего навигационного механизма является наличие “выхода” на любой, даже самой “глубокой” странице. Для страниц, представляющих содержание одного типа, например, новости, такой альтернативой является возможность перемещаться от одной новости к другой непосредственно, минуя главное меню или страницу со списком новостей.

Поисковый механизм, как важная навигационная составляющая сайта, невозможен без собственно поисковой формы. Хорошо, когда такая форма проста и узнаваема. Обычно она состоит из поля ввода запроса и кнопки “Поиск”. Иногда текстовую надпись заменяют значком, в этом случае необходимо обеспечить его узнаваемость и достаточный размер.

Доступ к форме должен быть обеспечен на любой странице. Ключевым фактором является также длина поля ввода — она должна быть достаточной, чтобы вмещать 2-3 слова на языке сайта.

Почему области нижней части страницы («подвал») важна? У нее есть несколько назначений. Во-первых, сообщить посетителю о «конце страницы», чтобы стало со всей очевидностью ясно, что это не прокрутка перестала работать, это содержание страницы завершилось.

Во-вторых, «подвал» служит объединяющим элементом, позволяющим посетителю воспринимать отдельные страницы как элементы одного сайта.

И, наконец, в-третьих, это своеобразная награда посетителю за то, что он вообще прокрутил страницу до самого конца. Вот почему не стоит складывать в «подвал» разнообразный информационный «мусор». Вместо этого стоит предложить дополнительные навигационные опции, подписку, призывы к действию, контактную информацию.