Как сделать сайт-визитку

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

На роль контактов можно рассматривать не только адреса email или номера телефонов. Это могут быть ссылки на социальные сети, мессенджеры и т.п.

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

На чём сделать сайт-визитку

Наиболее простые и доступные варианты создания визитки:

• Облачные конструкторы. Это готовые сервисы, которые обеспечивают полный набор связанных функций для удобного управления сайтом и для настройки его внешнего вида, для продвижения, получения уведомлений из форм, для качественного технического обслуживания и т.п. Всё, что остаётся клиенту – наполнить сайт своим контентом. Все технические вопросы решаются провайдером услуги.
• CMS-системы. Это готовые движки сайта. Для работы обязательно требуют аренды хостинга и базовых технических навыков для обслуживания/настройки. Стандартный функционал движка обычно расширяется за счёт готовых плагинов и тем (шаблонов оформления). CMS-системы сложнее, чем облачные конструкторы, но обеспечивают гораздо больше возможностей для развития сайта. Есть и минусы – чтобы сэкономить на запуске, во многих технических вопросах придётся разбираться самостоятельно.

К менее доступным вариантам можно отнести оффлайн-конструкторы (они аналогичны облачным аналогам, но для размещения сайта требуют аренды хостинга) и создание визитки в HTML-редакторе (в блокноте или в специальной среде разработки/IDE).

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

Ниже подробно остановимся на наиболее удобных и простых способах создания web-визиток.

Быстрое создание сайта-визитки в конструкторе

Чтобы инструкция была более предметной, рассмотрим процесс создания онлайн-визитки на примере конструктора uKit.

uKit – это популярная российская платформа для создания бизнес-сайтов (в эту категорию как раз входят визитки, лендинги, каталоги, портфолио и аналогичные малостраничные сайты). Юкит разработан как аналог более сложному и комплексному продукту из единой экосистемы, uCoz.

В uKit всё сделано максимально просто и доступно для новичков, хорошо автоматизировано. Вам не придётся вникать в технические детали и нюансы, запуск нового сайта происходит всего в несколько кликов.

Общая последовательность шагов по созданию сайта-визитки:

1. Регистрация в сервисе.
2. Выбор шаблона (он уже с тематическим наполнением).
3. Выбор технического домена.
4. Актуализация контактов (замена на свои).
5. Правка содержимого (по желанию, при необходимости).
6. Публикация.
7. Добавление своего домена (если не нравится или не подходит технический домен).
8. Готово.

Вы можете делиться адресом своей онлайн-визитки в любых источниках: в объявлениях (газеты, профильные площадки, социальные сети и т.п.), в физических (бумажных) визитках, в мессенджерах и SMS-сообщениях.

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

Теперь подробнее по шагам.

Шаг 1. Регистрация аккаунта в uKit

Всё стандартно – достаточно указать свой email-адрес и придумать пароль (обязательно сложный). Вместо этой процедуры регистрации вы можете воспользоваться возможностью входа с помощью уже имеющихся аккаунтов в социальных сетях (Яндекс, Google, VK, Одноклассники и т.д.).

Шаг 2. Выбор оформления

Если вы впервые вошли в сервис и у вас пока ещё нет созданных сайтов, то система автоматически перекинет вас в мастер выбора шаблона.

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

Понравившийся шаблон легко посмотреть в специальном окне без развёртывания на сайте. Когда определитесь, просто нажмите кнопку «Выбрать…».

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

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

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

Шаг 3. Технический домен

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

Если вы в дальнейшем планируете добавить своё доменное имя второго уровня вместо технического 3 уровня (для лучшей узнаваемости и запоминания), то на этом шаге можно доверить создание имени автоматическому алгоритму.

Шаг 4. Актуализация контактов

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

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

Шаг 5. Правка содержимого

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

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

Вы можете загружать сколько угодно изображений, встраивать видео, добавлять онлайн-калькуляторы (из uCalc) и т.д. Всё ограничивается только вашей фантазией.

Шаг 6. Публикация

Нажмите кнопку публикации, и все ваши изменения сохранятся. Они начнут отображаться в основной версии сайта (их будут видеть посетители).

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

Шаг 7. Добавление своего домена

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

А ещё он вызывает больше доверия, чем длинный технический домен.

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

Все сайты в uKit работают на защищённом протоколе HTTPS (SSL-сертификаты генерируются и добавляются к сайту без участия пользователей).

Дополнительные действия

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

Вы можете добавить визитку в панель вебмастера Google/Яндекс, запустить рекламу, сгенерировать QR-код (для удобного считывания со смартфонов), подключить аналитику (и просматривать данные в панели управления), настроить взаимодействие с CRM-системой (чтобы передавать данные о заявках из форм) и т.д.

Многие действия выполняются всего в несколько кликов – с задействованием профильных инструментов uKit.

Ваш сайт-визитка готов!

Как сделать сайт-визитку на WordPress

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

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

Алгоритм запуска сайта-визитки на WordPress будет выглядеть следующим образом:

1. Выбор подходящего хостинга.
2. Регистрация/получение доменного имени, его настройка.
3. Установка движка (с помощью автоматического скрипта или вручную).
4. Поиск и установка нужной темы или сборка своего варианта дизайна в специальном конструкторе.
5. Наполнение страниц.
6. Дополнительные шаги (при необходимости – реклама, настройка интеграций, аналитика и т.п.).

Теперь немного поподробней о каждом шаге.

Шаг 1. Выбор подходящего хостинга

Хостингов очень много, но качественных среди них крайне мало. Если вы хотите остановиться сразу на одном из лучших и не тратить время на поиски, мы подготовили ряд специальных материалов:

• Как выбрать хостинг
• Лучшие зарубежные хостинги
• Лучшие российские хостинги
• Отдельный рейтинг лучших хостеров для WordPress

Для масштабных проектов и сайтов, нацеленных на глобальный рынок, мы рекомендуем HostGator. Безлимитные тарифы от 2,75 $/месяц, специальные сервисы для начинающих, подарочные домены и т.д. Крупнейший зарубежный провайдер.

Для проектов, нацеленных на российский рынок, лучше всего подойдёт Timeweb (от 119 ₽/месяц), всё на русском языке, надёжная компания-владелец, собственный дата-центр, расположенный в Санкт-Петербурге, возможно сотрудничество с российскими юридическими лицами – оплата по счетам, закрывающие документы и т.п.

Шаг 2. Регистрация и настройка доменного имени

Если вы остановились на указанных провайдерах, то можете получить подарочные домены на год. Но вам будут доступны не все доменные зоны – из-за ограничений регистраторов-партнёров.

Больше возможностей и исчерпывающий выбор можно найти у крупных регистраторов доменов, но тогда придётся вручную настраивать ресурсные записи, чтобы они правильно указывали на сервер, где будет работать сайт-визитка. Узнать более подробно про домены и доменные зоны можно в отдельном материале – здесь.

Как выбрать домен

Настройка ресурсных записей будет зависеть от того, какого хостера вы выбрали. Например, NS-серверы, которые нужно прописать для HostGator, можно узнать в описании тарифа. Для Temeweb это будут универсальные строки: ns1.timeweb.ru и ns2.timeweb.ru. Вместо них можно задействовать A-запись и прямое указание на IP-адрес сервера (подробнее здесь – что такое DNS-система).

Обратите внимание: на то, чтобы изменения вступили в силу, и данные в системе актуализировались, может уйти до нескольких дней (1-2 суток).

Шаг 3. Установка WordPress на хостинг

У всех популярных хостеров есть специальные скрипты для автоматической установки. С ними развертывание WordPress выполняется в один-два клика.

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

Не забудьте про получение SSL-сертификата (могут быть платными и бесплатными, настраиваются в хостинг-панели или на вашем сервере, если выбрана услуга аренды VPS или dedicated-сервера).

После получения сертификата нужно активировать поддержку редиректов в админ-панели WordPress (в разделе «Здоровье сайта»).

Шаг 4. Настройка внешнего вида

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

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

Плюс, в сети огромное количество подборок тем для сайтов-визиток на WordPress.

Наиболее универсальный подход – использование специального редактора тем со встроенным блочным конструктором, Elementor. С ним вы сможете создавать сложные и красивые макеты так, как вам нужно, и всё это без какого-либо программирования и правки HTML.

Шаг 5. Наполнение визитки

Как минимум на сайте-визитке должны быть:

• Ваши актуальные контакты (номер/номера телефона, email, ссылки на социальные сети и мессенджеры, и т.п.).
• Форма для запроса обратной связи (реализуется специальными плагинами).
• Описание ваших услуг и навыков.

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

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

Дополнительные шаги (по желанию)

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

Вместе с тем, вы можете запустить рекламные кампании в контекстных сетях и привлечь пользователей из социальных сетей. А чтобы правильнее понимать эффективность ваших действий, нужно добавить сайт в панель вебмастера (Яндекс/Гугл) и разместить внутри страниц код метрики/аналитики.

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

Можно ли сделать сайт-визитку бесплатно?

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

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

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

Выводы

Мы выяснили, что создание сайтов-визиток вполне возможно без каких-либо профильных знаний и навыков. Всё можно сделать только своими руками. Главное – использовать правильные инструменты, например, онлайн-конструкторы или удобные CMS-системы (движки).

Процесс создания онлайн-визиток мы показали на примере самого простого конструктора uKit и движка WordPress. Вы можете выбрать и другие платформы. Шаги и действия будут во многом аналогичны.