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

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

В первую очередь посетителю на сайт нужно будет как-то попадать. Чтобы это сделать на самом деле есть два пути: необходимо либо совершить переход по вашему рекламному объявлению, либо непосредственно набрать его буквенный адрес. Этот буквенный адрес является доменом сайта.

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

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

Обращаем внимание, что переход по рекламным объявлениям является платный, в то время как прямые входы – бесплатные. Правильный подбор домена помогает сэкономить деньги.

Как выбрать платформу?

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

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

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

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

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

Как определиться с дизайном?

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

Рекомендации по дизайну таковы:

➡️ цветовая гамма. Не используйте много цветов и оттенков. Максимально допустимое количество цветов – три. Используйте сочетающиеся цвета;

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

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

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

Как создать удобную структуру сайта?

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

Современный пользователь несколько поверхностный: он, как правило, быстро теряет внимание, отвлекается на разные элементы, не хочет читать большой объём текста, просматривать длинные видео, переходить по сложным меню.

Когда-то существовало правило «3 клика», означавшее, что если пользователь не найдет нужную информацию в 3 клика, то он прекращает пользование ресурсом. Это правило и сейчас актуально как никогда.

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

➡️ структурирование информации, то есть разделение на блоки, разделы;

➡️ графическое оформление текстов, то есть добавление рисунков, иконок, эмодзи, выделение цветом строчек или столбцов таблиц;

➡️ “псевдо-клики”, то есть клики пользователя, которые визуально не переводят на другую страницу, а детализируют текущую. Такие клики могут открывать частично скрытый текст, вызвать всплывающие окна, менять информацию в соседнем окне и т.д. То есть дозировано выдавать информацию не изменяя основную страницу.

Как создать удобное меню?

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

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

Кстати, рекомендую установить ссылки, открывающие страницы в новой вкладке, а не в текущем окне. Тем самым вы поможете пользователю быстро вернуться к предыдущей странице опять же без использования меню.

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

Следуйте таким правилам, чтобы текст был читабельным:

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

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

➡️ абзацы. Текст следует разделять на абзацы. Желательно, чтобы в разделе количество абзацев не превышало 5;

➡️ таблицы и графики. Цифровая и статистическая информация лучше воспринимается при добавлении таблиц и диаграмм, вставленных между текстом.

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

Что такое вспомогательный функционал?

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

Добавление такого функционала – это своего рода проявление заботы о посетителе и одновременно повышение шанса его удержания. Если пользователь ничего не нашёл или запутался, но в целом готов сотрудничать с вами, то он должен иметь возможность задать вопрос и как можно более оперативно получить ответ на него.

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

Помните о баннерах?

При разработке концепции сайта следует определиться с использованием статических или динамических рекламных объявлений – баннеров. Помните, что задача баннера – привлечь внимание к себе и сделать переход на страницу с рекламируемой информацией, но тем самым он отвлекает внимание от страницы пребывания.

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

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

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

Как лучше сотрудничать с дизайнером?

Этот аспект больше касается процесса разработки дизайна сайта.

Как правило, компании подрядчики предлагают следующий алгоритм действий: они разрабатывают 3 разных варианта дизайна, вы выбираете один из них и затем его дорабатывают.

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

Это хорошо, если вам хоть какой-нибудь понравится. А если нет? Дизайнер воспринимает это как своего рода обиду, его внутренняя страсть гаснет. Дальнейшая работа будет на «отвали».

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

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

Адаптивность – это способность сайта подстраиваться под устройства с разными характеристиками экрана.

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