# Веб
16/01/2017
Как разработать современный сайт?

Всем привет, это первая запись в блоге молодого digital-агентства Global Innovations. Сегодня поделимся своими размышлениями о том, как разработать современный функциональный сайт, который воплощает основную концепцию нашего агентства: инновации > интернет > продажи.

Эта статья может стать источником идей, советов и примеров, которые вы сможете применить на практике при создании сайта самостоятельно или в сотрудничестве с агентством. Мы поделимся инсайтами о функционале современных сайтов, выборе дизайна, наполнении сайтов контентом, а также организации командной работы по разработке сайтов. Современный сайт - это лицо компании, главный источник новостей о ней, а также отличный инструмент продаж. Почти как дневник у школьника :) Как и полагается при решении сложных задач, разработку сайта наша команда начала с определения задач сайта. Задачи Нашей задачей было разработать современный функциональный сайт, который отображает наш нынешний уровень в создании сайтов, веб-дизайне и копирайтинге. Помимо решения основных задач, наш сайт также должен быть легким, идеально адаптивным к мобильным устройствам, иметь простую навигацию и, конечно, обладать некоторыми “фишками”, которые вызовут вау-эффект у наших потенциальных клиентов. Структура, функционал сайта и исследования Как это обычно бывает, основные страницы сайта были “на устах” у всей команды, однако окончательная структура сайта сформировалась в итоге нескольких недель последовательной работы. Нашим приоритетом была максимальная простота усвоения информации, а также понятная навигация по сайту, поэтому в финальной версии сайта мы оставили всего 6 разделов: описание услуг агентства, уютный блог, преимущества работы с нашей командой, портфолио, информацию о компании и блок контактов. Основная функция сайта - максимально упростить возможность оставить заявку на сотрудничество. Помимо этого мы уделили много внимания анимациям и сторителлингу, чтобы быстро и доступно объяснить потенциальному клиенту, чем наш подход к работе отличается от большинства компаний. Специфика казахстанского digital-маркетинга в том, что большинство компаний уже понимают необходимость инвестиций в интернет-маркетинг как в основной канал привлечения клиентов, но из-за быстрых темпов роста большинства рынков, хороших подрядчиков, которые умеют выстраивать полноценные маркетинговые кампании в интернете, анализировать результаты продвижения, проектировать и разрабатывать сайты, а также уделять должное внимание дизайну не так много. Команда Global Innovations уделяла большое внимание рекрутингу, подбирая специалистов, способных мыслить стратегически, поэтому для нас было важно раскрыть именно этот аспект нашей работы. Исследования Мы очень любим проводить анализ лучших практик, которые позволяют собрать идеи, набраться вдохновления, и убедиться в том, что ваша компания обладает уникальными торговыми предложениями :) В ходе работы над сайтом агентства мы уделили особенное внимание рынку Казахстана и СНГ, а также вдохновлялись сайтами из Европы и США. Мы собрали лучшие сайты в один файл, и разделили их по разными категориям: креативность, дизайн, верстка, проработка графики, сторителлинг, мобильные версии и т.д. Честно говоря, наибольшее количество вопросов у нас возникло по казахстанским сайтам. Как digital-агентства могут позволить себе создать сайт на шаблоне? Почему большинство сайтов у компаний, которые занимаются разработкой сайтов, не адаптированы под мобильные устройства? Ведь более половины переходов на сайт уже давно осуществляется с мобильных устройств. Также мы заметили множество более мелких ошибок на сайтах, таких как “съехавшая” верстка, обилие грамматических ошибок на сайте, совершенно убойные цветовые решения и т.д. Сразу дадим совет тем, кому может быть интересна разработка сайтов в Казахстане: не тратьте свое время и деньги на работу с агентством, у которого видны явные ошибки в работе собственного сайта. Если агентство не может обеспечить работу своего сайта, вы думаете, у них получится сделать хорошо ваш сайт? Прогулявшись по сайтам агентств стран СНГ можно отметить значительный прогресс в упаковке и реализации креативных идей. В России, Украине и Беларуси рынок разработки сайтов был конкурентным уже в 90е годы, поэтому уровень сайтов в этих странах гораздо выше. Набрав достаточно много идей из русскоговорящего сегмента интернета мы отправились анализировать рынок США, тем более что в команде Global Innovations почти все с английским на “ты”, а трое человек из нашей компании вообще имеют современное западное образование. Анализ сайтов из англоязычного сегмента интернета дал нам полное понимание картины и позволил максимально ясно обозначить образ сайта, к которому мы стремимся. Далее дело осталось за малым: создать прототип, наполнить его контентом, прорисовать дизайн, заверстать сайт и сделать так, чтобы все функции сайта были рабочими. Создание прототипа сайта и контента После детального рассмотрения лучших практик на общей встрече прототип сайта родился буквально за несколько минут. Мы просто набросали идеи по дизайну карандашом на чистом листе, после чего отдали сайт отделу маркетинга на проработку контента. О том, что контент правит, не говорит только ленивый, жаль только не все компании считают нужным уделить внимание контентной составляющей своих сайтов. Естественно, каждый сайт нуждается в качественном контенте. И поэтому мы предпочитаем делать дизайн под контент, а не наоборот. Если вы начнете с дизайна, то готовьтесь к неминуемым правкам, которые впоследствии приведут вас к переделыванию всей работы, ведь создать универсальный дизайн, для всех видов контента совершенно невозможно. Делимся коротким чек-листом по контенту сайта, который наверняка сэкономит вам несколько часов, ато и дней работы: Соберите весь необходимый вам материал. Вы должны знать все о вашем сайте, понимать его структуру, знать, какой контент появится на нем в первые 1-2 месяца после запуска. Пишите лаконично. Люди не любят читать длиннотексты, особенно если их пишет не Джоан Роулинг или Джон Толкиен. Вначале напишите суть, а потом добавляйте детали или делитесь секретами. После написания основного текста создайте цепляющий заголовок. Пишите текст только если вы уверены в том, что способны делать это хорошо. В ином случае наймите копирайтера. Он сделает все как положено. Не забывайте о визуальном сопровождении контента. Визуалы должны раскрывать суть статьи, страницы, публикации или любого другого вида контента. При работе над контентом нашего сайта мы выделили 3 основных акцента: описание преимуществ агентства, оформление портфолио и максимально простая страница о команде агентства. В нашем случае команда - это основной актив, поэтому на сайте компании мы решили добавить фотографии сотрудников и ссылки на профили коллег в соцсетях, чтобы потенциальные клиенты знали нас в лицо. Также мы сняли информативный и лаконичный ролик об услугах агентства, мы любим делать “продающие” видео :) Дизайн После проработки контента к работе над сайтом активно приступила команда дизайнеров. Как это часто бывает, первый вариант дизайна родился быстро, во многом благодаря качественному анализу лучших практик, который мы проводили всей командой. Однако после начала верстки появились неизбежные правки, в нашем дизайне каждый день что-то менялось. Правки по дизайну вносились уже при верстке, свежие идеи проверялись на удобность и все сразу же внедрялись на сайт. Хорошая совместная работа дизайнера с верстальщиком — залог успеха. В итоге сайт для нас стал как живой. Он существует как самостоятельный организм, развивается и совершенствуется с каждым днем. Мы не перестаем его тестировать и дорабатывать дизайн страниц. Front-end и Back-end разработка Frоnt-end — это “видимая” часть сайта, за которую отвечают front-end разработчики. Еще на начальной стадии разработки сайта было решено отказаться от использования шаблонов, а также использования css фреймворков, поэтому основная работа по front-end разработке и верстке выполнялась вручную. Это не самый быстрый путь, но благодаря такому подходу мы получили максимально гибкий сайт, который можно будет улучшать и дорабатывать в дальнейшем без значительных временных затрат. Также “изюминкой” для верстки сайта стали параллакс эффекты, которые присутствуют почти на каждой странице сайта. Мы с ними справились, похоже получилось стильно, информативно и функционально. Основная цель внедрения параллакса - дать возможность посетителю сайта получить максимальное количество информации без необходимости кликать и переходить по разделам сайта. По части back-end функционал сайта довольно скромный, что вполне соответствует его целям. Нами была разработана блог-платформа, а также форма заявки, отальные усилия разработчиков сфокусировались на нескольких амбициозных проектах для заказчиков. Надеемся, благодаря этой статье вы сможете не наступать на грабли при разработке собственного сайта или выборе подрядчиков. Если нужен будет совет или помощь в создании сайтов - звони к нам, а лучше приходите знакомиться в офис :) Мы находимся в Астане по ул. Кунаева 35/1, тел. +7 7172 516 520 До скорой встречи!