Корпоративный сайт: или каким НЕ должен быть официальный корпоративный сайт компании
Совсем недавно на меня вышел серьезный заказчик с запросом о корпоративном сайте. Это был чудесный проект и «чудесность» его заключается в огромном количестве озарений, которые меня посетили.
Я разработчик и пишу эту статью для бизнеса, перед которым стоит задача создать корпоративный сайт.
Содержание статьи кратко и по делу
- Вводная часть: какой заказчик пришел, с каким запросом.
- Прикладная часть: чего НЕ стоит допускать в корпоративном сайте и почему.
- Заключительная часть: краткий набор требований для вашего разработчика, с которым вы точно не ошибетесь.
Клиент и его запрос
Компания-трейдер на международном рынке. Они занимаются торговлей нефтепродуктами, агро-культурами и логистикой вышеперечисленного. Признаюсь, на тот момент ниша для меня оказалась новой и мне предстояло много личных открытий.
Наша работа началась как обычно: собрали платформу бренда, меня познакомили со спецификой их деятельности и показали больших игроков, которые заслуженно занимают свое место в нише.
Далее мне предстояло увидеть все сайты конкурентов (далее буду прикреплять ссылки и скриншоты для наглядности).
Первая и сама сильная компания, которую мне презентовали:
Далее идет:
Так, мы пришли к тому, что нам необходимо сделать решение, которое будет золотой серединой между этими примерами.
Каким НЕ должен быть корпоративный сайт
Само собой не все сайты, которые мне отправил клиент были хороши…
Был и такой
Так же, я столкнулся с проблемой навигации на самом первом сайте (при всей его классной «собранности»)
Далее списком:
- Не у всех сайтов есть адаптивность под телефоны и планшеты, а это очень важно сейчас. Телефон помогает решать задачи каждому из нас. По этой причине корпоративный сайт должен отвечать «хорошему тону» веб-разработки, чтобы у ваших клиентов не жгло в груди от неудобства пользования интернет-ресурсом.
- Не стоит размещать всю информацию последовательно (полотном), чтобы приходилось долго листать страницу вниз. Добавьте интерактивные элементы, прокрутку в сторону, выпадающие списки, всплывающие окна. Все это даст пользователю возможность удобно изучать информацию, которую вы разместили.
- Не стоит делать из корпоративного сайта «космолет». Перенасыщение страниц анимацией, движущимися элементами, насыщенными дизайнерскими решениями может быть совсем не нужно людям, для которых вы делаете сайт.
- И наоборот, не делайте сайт целиком и полностью статичным. Добавьте немного видео, так сайт станет более подвижным и находиться на нем будет комфортнее.
Что обязательно должно быть на вашем корпоративном сайте:
На что необходимо обратить внимание:
1. Навигация:
- Панель сайта с навигацией должна быть закреплена, чтобы она всегда была у пользователя под рукой.
- Необходима кнопка возврата к началу страницы.
- Внизу каждой страницы нужно расположить дополнительный навигационный блок (его закреплять не нужно).
2. Адаптивная верстка
У сайта обязательно должна быть адаптация под все типы устройств. Без этого просто никуда.
3. Понятная структура
Разработчик должен понимать ваш бизнес, кто ваш клиент, зачем клиент заходит на сайт и в каких случаях. Для корпоративного сайта это важно, поскольку это отражается на его структуре.
4. Интерактивные объекты
Если страницы предполагают большой объем информации, нужно добавить прокрутку в сторону или списки. Не стоит делать из сайта электронную книгу, которую придется долго скролить вниз.
5. Дизайн-решения
- Корпоративный сайт - это про содержание. Не следует смещать акцент на насыщенные визуальные эффекты и сложные дизайн-решения.
- Необходимо использовать свежий и современный стиль верстки, добавить видео, внедрить акценты, но не слишком яркими цветами.
- Размещайть текстовые блоки на светлом фоне, так легче всего считывать информацию.
Все это сделает ваш корпоративный сайт сильным рабочим инструментом.
В качестве примера размещаю свою работу для компании Apogee FZC, которая стала импульсом к написанию этого текста.
Надеюсь этот материал поможет вам в работе. Поддержите меня лайком, подписывайтесь и пишите в комментариях, какую тему еще осветить.
По вопросам разработки:
Что такое "свежий, современный" стиль верстки? Кто придумывает моду?
На самом деле моду никто не придумывает. По сути все упирается в "красиво" или "не красиво". Понятие "свежий" и "современный" идут по большей части от личного ощущения каждого. Постараюсь проиллюстрировать на примерах из статьи:
возьмем сайт Synsol https://www.synsol.ch/about-us и сайт Covart Energy https://www.covart-energy.com
Вы можете заметить большой контраст в том как выглядит панель навигации одного и другого. Или же блок с контактами: у Synsol - это текст в рамке, в то время как у Covart - блок с разворачивающимися по нажатию свитками. Эти и многие другие детали как раз и создают ощущение "свежий" и "современный".
Надеюсь у меня получилось ответить на ваш вопрос.
Спасибо за комментарий!
Я бы добавила: как связаны "стиль верстки" и дизайн?
Дизайн понятие более широкое.
В этом случае используемый стиль верстки - это средство достижения того внешнего вида сайта, который был определен дизайн-концепцией.
Простыми словами: дизайнер нарисовал как все должно выглядеть - программист подобрал под это нужные инструменты.
Надеюсь я ответил на ваш вопрос.
Спасибо за комментарий!
Нет, не ответили.
Стиль вёрстки никак не связан с тем, что нарисовал дизайнер.
Один и тот же макет можно можно сверстать несколькими способами (в разных стилях). При использовании CMS и конструкторов реализация ограничена ими.
И вёрсткой занимается не программист, а фронтендер (верстальщик).
В первую очередь скажу, что человек, который занимается фронтедном - это программист, поверьте на слово.
Что касается верстки, дизайн-макет во многом определяет инструменты, которые будут использоваться.
Как человек, верставший сайты, не поверю. Точнее, он может им быть, а может и не быть. Сайт может быть вообще без бэка или полностью на JS. Это вопрос эффективности и задач. Речь не об этом, а о стиле вёрстки )
Вот для SEO способ ("стиль") вёрстки может иметь значение. Но просто глядя на сайт, вы не сможете определить способ реализации.
На сколько я понимаю, последняя часть статьи задумывалась как демонстрация конкретного решения. Было бы здорово, если бы вы добавили картинки к тому что описываете, так как наличие только ссылки вынуждает проходить на сайт и самостоятельно искать то, о чём вы пишете. Это вызывает ощущение, что статья написана для создания трафика на сайт, а не в учебных целях.
Спасибо, добавлю иллюстрации к заключительной части статьи!
Статья не задумывалась, как способ создания трафика на сайт, посколько целевая аудитория бизнеса этого клиента говорит на английском языке. Трафик с этой площадки им не нужен.
Открыт к любым вопросам, пишите))