» Статьи » Как создать свой сайт самому

Как создать свой сайт самому

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

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

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

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

Где лучше создать сайт самому

Начинающие и опытные пользователи могут создавать свои сайты:

  • В онлайн-конструкторах.
  • В CMS или CMF-системах.
  • В профессиональных редакторах и средах разработки (IDE).

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

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

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

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

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

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

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

Создание сайта на базе CMS – не самое удобное решение для новичков. Но оно более простое и быстрое в сравнении с написанием сайта/движка с нуля.

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

Самостоятельное создание сайта в конструкторе

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

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

Далее можно подключать внешнюю аналитику, следить за показателями, развивать сайт, рекламировать его и т.п.

Более предметно – на примере самого популярного российского конструктора uKit.

Название: uKit
Официальный сайт: ukit.com
Сложность: Очень легко
Бесплатный тариф: 14 дней пробного периода
Стоимость: от $4/мес
Работает с: 2015
Штаб-квартира: Российская Федерация

Пошаговое создание сайта в конструкторе uKit

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

Немного статистики – внутри сервиса создано более 100 тысяч сайтов, платформа работает с 2015 года, за созданием стоит сильная и опытная команда, серверы, на которых хостятся сайты, расположены в РФ, плюс, конструктор официально внесён в реестр российского ПО.

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

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

  • Яндекс,
  • Google,
  • Одноклассники,
  • ВКонтакте,
  • uID
  • и т.д.

Registration-uKit

Шаг 2. Выбор шаблона

Если у вас ещё нет ни одного проекта в системе, то вы сразу попадёте в мастер создания нового сайта.

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

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

uKit-templates

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

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

Шаг 3. Выбор доменного имени

Конструктор uKit позволяет выбрать осмысленное имя сайта для бесплатных технических доменов, например, moy-sait-luchshiy.ukit.me

Но если вы не планируете продвигать сайт на домене 3 уровня, то фактически этот шаг можно пропустить. Система сгенерирует техническое доменное имя автоматически.

uKit-domain

Ваша основная цель – получить (зарегистрировать/купить) читаемый и запоминающийся домен второго уровня.

Сделать это можно внутри uKit в любой момент времени уже после создания сайта – в панели управления.

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

Шаг 4. Наполнение (редактирование) сайта

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

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

uKit-Editor

Элементы можно делать сквозными, закреплять их, чтобы они не пропадали при прокрутке страницы, скрывать на отдельных типах устройств (uKit обеспечивает работу сразу трёх точек останова: смартфоны, ПК и отдельно планшеты).

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

Уже на этапе редактирования не забывайте правильно заполнять SEO-атрибуты: мета-теги, alt’ы картинок, заголовки и т.п.

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

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

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

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

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

uKit-Publication

Дополнительно

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

  • Регулярно добавляйте новый контент. В uKit есть готовый раздел для организации корпоративного блога и новостей (с быстрой и простой публикацией материалов).
  • Добавьте сайт в панели web-мастеров Google и Яндекс (это делается с помощью специального интерактивного мастера в полуавтоматическом режиме), чтобы видеть ошибки и рекомендации поисковиков, отслеживать статус индексации.
  • По аналогии добавляются системы статистики и аналитики. Данные отображаются внутри панели управления uKit.
  • Запустите рекламную кампанию – для этого в uKit есть специальный рекламный модуль «Промопульт». Плюс, можно задействовать Я.Бизнес или услуги собственного web-агентства Divly.
  • Создайте свой интернет-магазин, где можно предлагать товары или услуги и принимать оплату онлайн.
  • Добавьте формы оформления заявок. Внутри uKit есть встроенная CRM-система, которая собирает в одном месте все заказы от ваших клиентов и рассылает оперативные уведомления.
  • Проверьте готовность к SEO (для этого также имеется встроенный мастер, который анализирует ключевые показатели в автоматическом режиме).
  • И т.д.

uKit-website

Читайте также: Как создать сайт на uKit.

Самостоятельное создание сайта при помощи CMS (на примере WordPress)

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

Итак, общий алгоритм, подходящий для большинства CMS-систем:

  1. Сначала нужно определиться с движком (читайте Какую CMS выбрать для сайта, Лучшие бесплатные CMS).
  2. Затем нужно выбрать хостинг, чтобы ваш движок был с ним совместим (читайте Как выбрать хостинг для сайта и Что такое хостинг простыми словами, Лучшие хостинги России, Лучшие зарубежные хостинги).
  3. Если хостер не предоставляет бесплатный домен, то нужно зарегистрировать новое имя и перенаправить его на свой хостинг (Что такое DNS-система и какие есть ресурсные записи).
  4. Установить движок на хостинг (в автоматическом режиме из хостинг-панели или вручную – в соответствии с инструкцией разработчиков CMS).
  5. Добавить и настроить модули (плагины/расширения).
  6. Получить SSL-сертификат и настроить редиректы с HTTP на HTTPS-версию сайта.
  7. Выбрать и установить/настроить подходящий шаблон.
  8. Наполнить сайт контентом.

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

А теперь более предметно на примере CMS WordPress.

Название: WordPress
Официальный сайт: wordpress.org
Сложность: Выше среднего
Бесплатный тариф: Неограниченный
Стоимость: зависит от хостинга
Работает с: 2003
Штаб-квартира: США

Пошаговое создание сайта в WordPress

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

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

Шаг 1. Выбор хостинга

WordPress совместим с большинством хостингов. Для него отлично подойдут общие тарифы (если вы начинающий web-мастер), есть готовые сборки для VPS-серверов, он будет работать и внутри выделенных серверов, и внутри облачной инфраструктуры.

Если вы хотите сэкономить время и нервы – выбирайте одного из провайдеров в нашем рейтинге «Лучшие хостинг провайдеры для WordPress-сайтов».

Лучший хостер по нашему мнению – универсальный и надёжный HostGator (это зарубежный провайдер, имеет безлимитные тарифы от 2,75 $/месяц, а также специальные высоконагруженные тарифы для WordPress – от 5,95 $/месяц).

HostGator-price

Если вам принципиально размещение в РФ и оплата в рублях, то лучшим выбором станет Timeweb (общий хостинг от 119 руб./месяц, есть специальные тарифы для WordPress – от 212 руб./месяц, бесплатное тестирование – до 10 дней).

Timeweb-price

Шаг 2. Выбор и настройка домена

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

Исчерпывающая информация – в статье « Как правильно выбрать доменное имя».

Для настройки ресурсных записей, чтобы они указывали на сервер хостинга, нужно обратиться к документации хостера или к его техподдержке (у каждого могут быть свои особенности, но в большинстве случаев нужно прописать NS-записи и выждать 1-2 дня для обновления DNS-системы).

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

У всех современных хостеров, если вы выбираете shared (общие) тарифы или специальный управляемый (managed) хостинг, есть возможность установки CMS WordPress в один-два клика. Если опции нет, то всегда можно обратиться к документации CMS – знаменитая 5-минутная установка WordPress.

wp-config.php

Шаг 4. Настройки движка и плагинов

WordPress настройки

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

Всё это и многое другое мы рассмотрели в отдельном материале – Как создать сайт на WordPress.

Самая главная настройка из разряда «маст-хэв» – редирект с HTTP-версии сайта на HTTPS. Для этого нужно либо получить бесплатный SSL-сертификат в хостинг-панели, либо приобрести и загрузить в специальные формы платный. Сам редирект активируется в админ-панели движка, в инструменте проверки здоровья сайта. Как только WordPress обнаружит наличие SSL-сертификата в настройках сервера, он предложит обновить настройки сайта (появится специальные ссылка, нажмите на неё, и система сделает остальное автоматически).

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

Редактор Elementor PRO

Шаг 5. Настройка шаблона

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

WordPress шаблоны

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

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

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

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

Шаг 6. Наполнение сайта

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

Для разных задач могут использоваться разные поля ввода.

Дополнительные шаги

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

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

Как создать бесплатный сайт самому

Слово «бесплатно» всегда действует на клиентов магическим образом. Да, в сети существуют и бесплатные онлайн-конструкторы (например, uCoz), и бесплатные хостинги, на которые можно установить бесплатные движки (как WordPress).

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

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

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

Бесплатные тарифы будут уместны для тестирования функционала платформы/хостинга/движка или во время обучения, но для ведения бизнеса они никак не подходят. Это как минимум несерьёзно, а как максимум – приведёт к реальным потерям (удалению данных, простоям в работе и т.п.).

Выводы

Создать сайт самостоятельно можно. Запустить свой web-проект получится даже бес специальных навыков и знаний, для этого есть онлайн-конструкторы и CMS-системы. Более того, создать свой сайт можно полностью бесплатно – на платформах конструкторов или на специальных промо-тарифах хостинга. Но у «бесплатности» всегда будет своя цена. Для коммерческих проектов бесплатные сайты никак не подойдут.
Как самостоятельно запускать сайты по шагам, мы рассмотрели на примере самых популярных платформ (конструктор uKit и движок WordPress). Но это общий алгоритм.