+7 (927) 240-03-36

опубликовано: 09 янв. 2019 г.

Создание сайта лендинг пейдж

заказать лендинг в казани

#

Этапы создания
Лендинг пейдж.
Часть 2

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

 

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

создание лендинг пейдж недорого

#

Наполняем сайт контентом.

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

 

  • Во-первых, с ознакомления с лендингами конкурентов. Там вы можете почерпнуть дизайнерские решения и некоторые концепции. Однако не стоит один-в-один копировать внешний вид, и тем более, уникальные идеи – могут пожаловаться.
  • Во-вторых, пробегитесь по портфолио нескольких веб-студий. Московские и иностранные веб-дизайнеры дадут вам передовые представления, о том каким должен быть качественный лендинг пейдж.
  • В третьем пункте вам помогут бумага и карандаш. Будет очень здорово, если вы набросаете хотя бы «скелет» и основные элементы вашего сайта.

 

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

 

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

 

Переходим непосредственно к основному этапу. Начинать ваять landing page можно сверху, можно по всей длине, ориентируясь на содержание экранов, можно вообще с конца. Я же начинаю всегда с первого блока, то есть, с начала, и рекомендую делать так же. И вот почему:

 

  1. Первый экран лендинга самый важный, так он создает первое впечатление, а также содержит головную фразу всего сайта – УТП.
  2. В процессе формирования ТЗ, как правило, уже имеются фотографические материалы по товару/услуге. А это значит, что строение первого экрана будет формироваться на их основе. Часто фон и цветовая палитра фотографий задают стиль всему лендингу. А вот подстраивать уже готовый сайт под фотоматериалы всегда труднее.
  3. Субъективно намного проще создавать лендинг пейдж, отталкиваясь от дизайна первого блока, нежели наоборот.

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

landing page цена

#

Выделяем важные моменты / фразы.

На картинках вы можете видеть несколько различных вариантов конструкции первого экрана лэндинг пейдж. Я очень не советую вам изобретать велосипед и придумывать вычурные и экстравагантные идеи, ведь многие успешные лендинги неспроста во многом похожи друг на друга. Это отработанные десятилетиями законы интернет-дизайна. Возьмите за основу какой-нибудь стиль и «вживляйте» в него свою тематику, но, повторюсь, ни в коем случае не занимайтесь полным копированием. Цена landing page от этого не упадет, а вот проблемы с авторским правом вас рано или поздно настигнут…

 

Среднестатистический качественный лендинг строится из блоков, идущих друг за другом по мере прокрутки в браузере. Мониторы, естественно, бывают разные, но в целом стоит ориентироваться на экран ноутбука – он должен вмещать в себя целиком один блок, не менее. Десктопы могут вмещать 1,5 и даже 2 блока за экран. Поблочное строение возникло не на пустом месте – блоками легче усваивать информацию. Я рекомендую разбить лендинг пейдж на несколько ключевых моментов (о компании, галерея, о товаре, преимущества, контакты и т.п.), и посвятить каждому отдельный блок, легко отличимый визуально. Не перестарайтесь: очень важно выдержать баланс между необходимым минимумом и тошнотворным перебором. Длина (высота) сайта зависит от конкретного содержимого, обозначенного в ТЗ, однако если ваш лендинг начинает превышать по высоте 10-15 экранов, задумайтесь! Захочет ли пользователь мотать всё это дело и вчитываться в каждую фразу? Выдержать золотой баланс, сохранив фирменные фишки, и не перемудрить с внешним видом – вот где кроется мастерство веб-дизайнера, а это, поверьте, дорогого стоит.

 

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

 

И пару слов про СЕО. На landing page цена может сильно варьироваться, но большинство ответственных веб-мастеров, в том числе и я, включают в ценник первоначальную seo-оптимизацию лендинга. Речь идет о заголовках и жирном начертании. Не упустите из виду момент, когда заглавия блоков выполнены в едином визуальном стиле и помечены одинаковыми тегами, к примеру, H2. Нередко я вижу на сайтах ошибку, когда подобными тегами выделены фразы, не несущие seo-функций, как то: Преимущества, Контакты, О нас. Это часто происходит на автомате, если сперва формируются СЕО-заголовки («Компания Наш Дом, г. Астрахань» или «Заказать лендинг в Казани»), а затем простым копированием продолжается верстка. Если вы делаете лендинг на Вордпресс, этой проблемы можно избежать, выбрав у заголовков одинаковый стиль, но разные мета-теги (H или p).

заказать создание landing page

#

Выбираем доменное имя и хостинг.

Ну и напоследок о самом важном… Хостинг и домен – казалось бы, как эти технические аспекты могут повлиять на дальнейшую судьбу вашего лендинга? Но ответьте на вопрос: что важнее для человека, мозг или сердце? Если сайт это мозг, то без сердца, то есть хостинга, его существование будет лишено смысла. Перед тем как заказать создание landing page, уделите внимание техническим моментам, чтобы в будущем неожиданно не остаться за бортом рынка. Во-первых, подберите звучное и запоминающееся доменное имя для своей компании. Отнеситесь к этому серьезно, ведь доменное имя является вашим единственным мостиком к целевой аудитории в интернете, а смена и утеря его обнуляет все достижения вашего лендинга в поисковой выдаче. Не теряйте доступов к сервису, где вы регистрировали свой домен, вовремя продлевайте его, а также поддерживайте контакт с веб-мастером, в случае если вы делегировали ему эту задачу. Более подробно о том, как связана история домена с продвижением сайта, можете почитать тут.

 

Во-вторых, хостинг. Хостинг является непосредственным вместилищем вашего лендинг пейдж и сопутствующих баз данных и файлов, от него напрямую зависят скорость вашего сайта, его безопасность, доступность и даже кроссплатформенность. За более чем 10 лет практики я перепробовал множество хостинг-провайдеров и могу дать им более менее объективную оценку. Я не буду тратить время на формирование личного рейтинга, а скажу сразу напрямую. Если вы не хотите тратить своё время впустую, если вам важна надёжность и простота, выбирайте BEGET.RU. Возможно, это звучит как реклама, но поверьте это не так! :) Бегет уже многие годы занимает верхушки рейтингов независимых веб-мастеров. На территории СНГ существуют и другие хорошие хостинги, однако у каждого из них есть свой изъян: или глупая техподдержка, или проблемы с кодировкой шрифтов, или рассинхронизация с доменом, или низкая скорость и надежность, или неподъемные тарифы. За годы работы с beget подобные проблемы не касались меня ни разу, а это означает, что я ни разу не подводил своих клиентов, чьи сайты мы разместили на Бегет. Для меня это крайне важно.

 

Кстати, если вы планируете заказать создание landing page, или являетесь разработчиком, настоятельно рекомендую покупать домен и хостинг в одном месте, иначе спустя некоторое время проблем вам не избежать. К сожалению, таков мой опыт, особенно если ко мне обращаются люди, у которых уже есть домен. В 4 случаях из 5 восстановить доступ к нему и связать его с хостингом не представляется возможным из-за проблем технической несовместимости.

 

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

 

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