Как выглядит сайт визитка

Как выглядит современный сайт-визитка?

В продолжение темы, о которой я писал в предыдущем своем посте.

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

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

Escalate.by. Сайт-визитка аренды единственного автомобиля представительского класса Cadillac Escalade. Не понятно зачем регистрация и поиск на 5 страницах? Что нам даёт календарь, голосование, блок навигации? Чем вообще отличаются «условия аренды» от «условий проката»? Всё, что нужно — это показать потенциальному клиенту красочные фотографии автомобиля, понятные условия проката и контакты. Это всё! По мне, суточная аренда автомобиля стоит дороже, чем было затрачено на создание этого сайта.

otdelka-doma.by. Как можно заказывать ремонт квартир у компании, которая даже не написала своё название в разделе «О нас»? Чем отличаются разделы «ремонт квартир» от «услуги»? Где посмотреть фотографии хорошего качества работ — то, что клиентов интересует большего всего?

Perevezy.by. Я бы не связывался с компанией, которой не важно, что подумают о них клиенты, посещая их сайт. Зачем новости, которые никто не заполняет? Зачем этот явно лишний внешний счётчик?

Poligrafia.by. Для сайта 2006 года, может быть и неплохо, но сейчас явно устарел. Главная страница ничего нам не говорит кроме возможности скачать прайс-листы. Не думаю, что много кто читает разделы о этикетках или стикерах — сейчас лучше показывать визиально.Хорошая галерея на сайте — лучше тысячи слов. Нужно убеждать клиентов, что нужно сотрудничать именно с вами, показать чем вы лучше остальных. И дизайн сайта фирмы, которая оказывает полиграфические услуги, должен быть более «красочным» — такова специфика этой отрасли.

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

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

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

А что если эти приёмы использовать при создании обычного сайта-визитки? Почему нельзя не только рассказать о своем бизнесе всему миру, но и сделать это эффективно?

Обобщенно, структуру простого современного сайта-визитки можно отобразить так:

1. Ваш логотип (название) компании и меню;
2. Яркая картинка, ваш призыв и краткая информация, что вы предлагаете;
3. Ваши преимущества — то чем вы выделяетесь среди остальных;
4. Ваши услуги — то, что вы предлагаете с подробным описанием;
5. Контакты — где вас найти, как связаться и другая полезная информация.

Можно добавлять новые блоки, делая сайт более расширенным и полноценным, а можно и удалять ненужные. Например, добавить отзывы ваших клиентов, сделать галерею работ, объяснить как работает ваш продукт, добавить видео и многое-многое другое.

Пример современного одностраничного сайта-визитки — Yarosh.by

Выгоды очевидны:

• простая и понятная структура сайта, сложно что-то «не найти»;
• более высокая конверсия по сравнению с обычными сайтами-визитками;
• лаконичность и информативность;
• эстетическое удовольствие и т.д.

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

Примеры сайтов, созданных на uKit

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

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

Это проблема личного опыта, не конструктора. Минимально приличный результат может получить любой пользователь. Есть адаптивный шаблон, базовые настройки дизайна. Просто немного поправив исходники, можно сделать хороший сайт. Но… Мы хотим показать примеры реально удачных, правильных и разнообразных сайтов, созданных в uKit. Таких, которые выглядят богато, профессионально.

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

Пример 1: Сайт компании по архитектурно-строительном проектировании

Udaproject.ru – серьёзная визитка компании-проектировщика из Улан-Удэ. Дизайн простой от шрифтов до цветовой схемы и структуры сайта. Но! Разработчики положили на сайт огромное количество уникальной графики. Впечатляющие видео с данными по уже реализованным проектам, документы и перечень клиентов оставляют весьма солидное впечатление о компании.

Перечень разделов возможных ко взятию проектов и компетенций вызывает уважение даже без понимания сути деятельности компании. Дополняет картину раздел с вакансиями. Отличная иллюстрация того, как довольно простой с визуальной точки зрения сайт значительно обогащается за счёт контента. Точнее, его характера и качества. Великолепный пример бизнес-сайта.

Пример 2: Сайт-портфолио фотографа Андрея Ерастова

Andrej-Erastov.ru – сайт фотографа выполнен в тёмных тонах. Количество страниц минимально. Но это нисколько его не портит. Главное – самопрезентация фотографа через свои работы. Данный пример ещё раз демонстрирует удобство использования uKit для размещения фотографий. Тёмная цветовая гамма хорошо акцентирует внимание на работах, большие фото смотрятся отлично. Галереи организованы очень удобно и наглядно.

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

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

Пример 3: Сайт-визитка туристического агентства НЕФЕРТИТИ

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

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

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

Пример 4: Граффити компания

Graffiticrew.ru – атмосферная визитка команды граффити-художников. Даже далёкому от живописи человеку интересно рассматривать примеры современного искусства. Сочная полноэкранная галерея из интересных сюжетов сразу привлекает внимание.

Цветовая схема сайта безупречная, а вот шрифты могли бы быть чуть интереснее. Хотя пренебрежение к текстовой части видно и в постах блога, комментариях и биографиях членов команды. Тот случай, когда отсутствие пробелов, 2 точки в конце предложения, пропущенные буквы и прочее в таком духе воспринимается как творческий беспорядок или некая фишка. В пользу мастерства парней скажут примеры их работ и подходящий дизайн сайта. Примечательные элементы: онлайн-консультант, заказ обратного звонка, блог (тот, который реализуется виджетов «Новостной информер») и таймер отсчёта до конца текущей акции. Качественная визитка с индивидуальной подачей.

Пример 5: Сайт компании по производству кованых изделий

Kin-rostov.ru – весьма оригинальный в своём минимализме сайт. Дизайн напоминает карандашный набросок, разделённый под линейку на блоки. Выглядит подобающе тематике: вычурно и основательно одновременно. Чертежи кованых изделий прекрасно вписываются в дизайн сайта.

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

Пример 6: Сайт ведущего Александра Гульцева

1001svadba.com – сайт принадлежит Александру Гульцеву – артисту и ведущему различных мероприятий. Здесь вы найдёте наиболее исчерпывающую информацию как о самом артисте, так и об услугах, которые он предлагает своим клиентам.

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

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

Пример 7: Сайт компании по оказанию страховых услуг

Konigtravel.ru – предлагает пользователям детальную информацию о международном полисе страхования ответственности «Зелёная карта». Оформление сайта довольно простое, однако, это нисколько не влияет на его функциональность и удобство в использовании.

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

Эта же информация находится в разделе «Контакты». Помимо общих контактных данных, посетителям наверняка пригодится дополнение в виде карт Google Maps, позволяющее сразу увидеть, как добраться к офису компании.

Пример 8: Геодезические услуги от компании «Грин Лэнд»

Greenlandomod.ru – сайт компании, выполняющей кадастровые работы. Отличная демонстрация того, что можно сделать на uKit за короткий срок и без навыков программирования. При создании этого проекта явно использовался стандартный шаблон, который веб-мастер немного кастомизировал в визуальном редакторе. Можно было добавить чуть больше индивидуальности, но суть как раз в том, что даже с минимальными изменениями базовые макеты на uKit выглядят симпатично.

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

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

Пример 9: Портфолио авторских принтов ручной работы

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

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

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

Пример 10: Сайт юридической компании «Красные ворота»

Lkredport.ru – сайт юридической компании, с главной страницей в формате лендинга. Ещё один пример минимального использования возможностей визуального редактора с получением нестыдного результата на выходе.

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

Выводы

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

Посмотрите, как происходит процесс создания сайта в uKit:

Есть два способа сделать достойный сайт используя uKit: подготовить хороший лаконичный контент и красиво его оформить либо немного посидеть над дизайном и структурой страниц. Если продумать оба пути, то получится отличный сайт. Речь о том, что для получения хорошего результата нужна хотя бы одна составляющая – грамотная структура всего материала либо просто классный контент, завёрнутый в демку шаблона.

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

Примеры сайтов-визиток

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

Сайты-визитки можно создавать практически на любом движке. Это базовый, технически несложный тип сайта. Контент в них меняется редко, поэтому даже на чистом HTML делают макеты таких веб-ресурсов. Они очень востребованы, поскольку просты и эффективно помогают продавать услуги, товары и прочее. Любая предпринимательская деятельность может и должна быть подкреплена сайтом-визиткой, не говоря уже за более крупные коммерческие образования.

Примеры сайтов-визиток:

1. Crazypanda.ru – разработчик мобильных приложений.
2. Recology.ru – компания по переработке отходов.
3. Texfilterkazan.ru – производитель промышленных воздушных фильтров.
4. Technika-sklad.ru – дистрибьютор спецтехники.
5. Vipforkids.com.ua – организация детских праздников.

1. Crazypanda – сайт разработчика приложений

Crazypanda.ru – визитка московской конторы-разработчика игровых приложений для ПК и iOS/Android, среди которых и довольно известное «Evil Defenders». Видно, что ребята умеют рисовать интерфейсы, шаблон явно делали сами, стилизуя под профиль деятельности. Это не готовая шкурка, а ручная работа под конкретную задачу. Стилизованные кнопочки, анимации в изображениях и графике, хорошо подобранный шрифт – всё вместе это смотрится отлично. Несмотря на пестроту баннеров проектов, ничего не раздражает глаз, все элементы на своих местах.

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

2. Recology – компания по переработке отходов

Recology.ru – визитка компании, продвигающей раздельный сбор и переработку мусора. Они помогают внедрить на предприятиях распределение вторсырья по группам, упрощая его утилизацию или переработку. В общем, экологически ориентированная коммерческая деятельность. Дизайн под стать. Множество графики с преобладанием сине-зелёных оттенков, приятный синий шрифт, чистый белый фон, схематические изображения под тематику, стилизованные иконки и прочее. Всё это смотрится хорошо в рамках адаптивного макета.

Меню выполнено в формате красивого сайдбара, содержащего также контактные данные. В мобильной версии оно преобразуется в гамбургер с плавной анимацией раскрытия. Логотип приятный, экологичный и стильный. Главная страница обосновывает подход компании к утилизации мусора, убедительно указывая на выгоды от раздельного накопления отходов. Есть раздел вопросов и ответов для дополнительного ликбеза. Контакты оформлены очень подробно, содержат юридические данные – всё выглядит прозрачно. Футер лаконично дублирует их и содержимое главного меню. Простая структура, симпатичный сайт. Хороший образец в своём роде.

3. ТЕКС – производитель фильтров для промышленности

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

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

4. СпецТехСервис – промышленные погрузчики

Technika-sklad.ru – визитка компании-дистрибьютора техники для обслуживания промышленных складов. Различные погрузчики, тягачи, ричтраки и прочие единицы спецтехники отображает каталог компании. Он выполнен просто: 2 колонки, крупные миниатюры изображений, сайдбар с разделами техники – навигация удобнейшая. Описания спецтехники поданы в формате характеристик, без каких-либо дополнительных публицистических абзацев по теме. Очевидно, потенциальным заказчикам стихи ни к чему, они понимают, что собрались покупать, и хотят видеть цифры – сколько, чего и как у конкретного погрузчика или ещё чего-то. Так что лаконизм описаний оправдан в данном случае, скорее всего.

Дизайн визитки адаптивный, вполне современный, но без каких-либо излишеств. Яркие жёлтые акценты хорошо монтируются с темой спецтехники, хотя номер телефона в шапке белым шрифтом на таком фоне едва различим. Ну, ничего, кому будет нужно – придётся его добыть, высмотреть. Шрифты простые, оформление текста нормальное – ничего не вызывает отторжения, ровно как и восхищения. Меню из 5 пунктов понятное, всё описано чётко, есть даже небольшая галерея техники в рабочих условиях. Футер содержит контактную и юридическую информацию – ни добавить, ни убрать. Классическая структура. Сайт легко воспринимается. Подобный сделать несложно, способов для этого множество.

5. «VIP for Kids» – организация детских праздников

Vipforkids.com.ua – визитка студии аниматоров. Основной упор сделан на позиционирование деятельности через фотографии с локаций выступлений. Можно ничего не писать даже – и так понятно, чем занимается организация, насколько востребован и кто является его целевой аудиторией. Отдельным разделом вынесены галереи из фото и видео, где в удобном формате можно посмотреть фото и видео с мероприятий. Информация и контент на сайте формируют исчерпывающее представление о деятельности организации, добавить нечего.

Подведём итоги

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

Чем больше полезной информации укажете на сайте-визитке, тем лучше. Такой подход снимает вопросы и вызывает доверие у аудитории. Дизайн обязательно должен быть адаптивным. А вот красивым – необязательно. Главное, чтобы посетители понимали, куда попали, что им могут предложить и на каких условиях. Многие конструкторы и CMS позволяют создавать эффектные визитки по шаблону или с нуля. Это делается просто. Вы тоже сможете, уделив решению задачи примерно неделю времени, учитывая подбор материалов и написание текстового контента.

Источники:

http://staronka.by/blog/modern-site-vizitka/
http://site-builders.ru/primery-sajtov-vizitok-lendingov-i-portfolio-sozdanie-v-ukit
http://uguide.ru/primery-sajtov-vizitok