Как создать сайт бесплатно, без программирования и онлайн-конструкторов за 1,5-2 часа. Пошагово.
В данной статье я дам пошаговую инструкцию, следуя, которой абсолютно любой человек сможет бесплатно создать себе профессиональный сайт без каких-либо навыков программирования. При этом времени на создание такого ресурса будет затрачено не более полутора часов.
Содержание статьи:
- Вступление
- Варианты создания сайта
- Три основополагающих сайта
- Подключение хостинга
- Авторизация на хостинге
- Выбор доменного имени
- Покупка доменного имени
- Активация и продление домена
- Привязка домена к хостингу
- Установка движка на сайт
- Активация движка
- Продление домена
- Протоколы http и https
- Выпуск ssl сертификата
- Файл .htaccess
- Редирект с http на https
- Внешний вид сайта
- Редактирование и плагины
- Видео по теме
Вступление
Я также хочу обратить внимание, что, следуя данным инструкциям, вы получите действительно полноценный сайт, который будет принадлежать только вам, а также он окажется абсолютно бесплатным, так как сайт мы будем создавать не на конструкторах, которые предполагают какую-то ежемесячную абонентскую плату, либо же закупку платных услуг. Здесь мы будем создавать сайт на самом популярном в мире движке WordPress. Он является абсолютно бесплатным и для него есть очень много дополнений, также бесплатных, которые позволят вам настроить свой сайт, в соответствии с вашими целями и требованиями.
Варианты создания сайта
Я расскажу про 2 варианта создания своего сайта.
1 вариант будет абсолютно бесплатным, и он подойдёт тем, кто хочет просто посмотреть, как это выглядит. Попробовать это изнутри и понять для себя, подойдёт ли для вашего бизнеса именно такой вариант.
2 способ обойдется вам в месяц по цене одной чашки кофе, и он подойдёт тем, кто уже определился, что ему нужен свой сайт, но кто не хочет переплачивать программистам, дизайнерам или покупать какое-то платное программное обеспечение. Этот вариант позволит вам очень серьёзно сэкономить на старте.
Три основополагающих сайта
Для начала дам немного теории. Чтобы создать свой сайт вам нужно 3 вещи:
1 этот домен, то есть это адрес вашего сайта и это именно тот набор символов, которые вбивает человек в поисковой строке, чтобы посетить страницу вашего сайта. Домен состоит из названия сайта и доменной зоны, которые разделены точкой.
Стоить вашего уникальное доменное имя будет 170 рублей в год, и его необходимо будет каждый год вовремя продлевать, чтобы кто-то другой не смог его перекупить.
2 вещь, которая понадобится это хостинг. Хостинг это то, где будут размещены файлы вашего сайта, то есть те компании, которые занимаются этим профессионально, они предоставляют на своих серверах определённая дисковое пространство, которое обозначено параметрами тарифа, на котором вы сможете разместить свой сайт. И таким образом он будет доступен для ваших пользователей круглосуточно, 7 дней в неделю, 365 дней в году. Хостинг, который я вам порекомендую, будет стоить всего лишь 100 рублей в месяц, и за эти деньги вам будет предоставлено 2 гигабайта дискового пространства, на которых спокойно поместится 5-6 сайтов.
Ну и последняя вещь, которая вам понадобится для создания сайта это CMS. Если говорить простыми словами, то это движок вашего сайта. Я уже более 10 лет пользуюсь движком WordPress, потому что он абсолютно бесплатен. Это самый распространенный движок в мире, и он имеет очень много бесплатных дополнений, которые позволят вам создать совершенно бесплатно тот сайт, который подходит под ваши требования и отвечает вашим критериям. Изначально этот шаблон был блоговый, но сейчас на нём можно создать абсолютно любой сайт, даже интернет-магазин.
Подключение хостинга
Итак, объясняю пошагово на собственном примере, как создать свой сайт, потратив на это примерно полтора часа времени.
Первое, что мы делаем это подключим хостинг и купим доменное имя. Напоминаю, что те, кто хотят лишь попробовать и посмотреть, как будет выглядеть их сайт, эти действия окажутся абсолютно бесплатными. Переходите по ссылке на сайт хостинг-провайдера Hoster.ru и во вкладке хостинг выбирайте безлимитный SSD.
Для начала я рекомендую выбрать тариф Альфа, потому что он самый дешёвый и данного дискового пространства здесь вполне хватит для размещения нескольких сайтов и более того, вся эта линейка тарифов предоставляется абсолютно бесплатно на первые 10 дней. Для регистрации на этом сайте нажимаем кнопку начать бесплатно. Далее выбираем конфигурацию тарифа. Сначала, выбираем поле, предустановка CMS WordPress. Далее выбираем версию CMS, которая является самой новой. На данный момент это версия 5.6.
И как здесь мы видим для корректной работы этого движка нужна версия PHP от 5.6 до 8.0. Соответственно версию PHP мы также выбираем самую новую, которая соответствует этой версии CMS. В данном случае я выбираю PHP 8.0 и период действия тарифа я сейчас выберу только один месяц. Напоминаю, что первые 10 дней будут абсолютно бесплатными, но вы можете выбрать больший период, но в любом случае срок действия тарифов всегда можно будет изменить без каких-либо проблем. Далее нажимаем кнопку оформить заказ.
Мы переходим в окно регистрации, где необходимо будет указать свое имя, фамилию и отчество, а также действующий email, на который будут приходить все уведомления. Обращаю ваше внимание, что здесь обязательно нужно указать корректные данные, так как в случае каких-либо конфликтных ситуаций эта информация окажется крайне важной.
Как вы узнали о нас можно не заполнять. Далее нужно согласиться с договором и подтвердить, что вы не являетесь роботом, после чего нажать кнопку, зарегистрироваться.
После этого появится окно, в котором будет написано, что учётная запись успешно создана.
Здесь же вы видите свой логин и пароль, которые дополнительно придут вам на почту, а именно на почту придёт сразу целых 3 письма. Первое из которых, как я уже сказал, будет дублировать сообщения об успешной регистрации, второе письмо будет сообщением о том, что вы о успешно установили движок на тестовый сайт и третье сообщение о том, что ваш тестовый бесплатный период в 10 дней начался.
Авторизация на хостинге
Далее необходимо авторизоваться на сайте Hoster.ru, с выбранным логином и паролем. И здесь обратите внимание, что в верхней части вы увидите желтую подсветку и 2 восклицательных знака.
Обращаю ваше внимание, что за 10 лет работы сданным хостинг-провайдером мне ни разу не поступало от него звонки, с какими-то рекламными предложениями, поэтому здесь вы можете смело указывать свой действующий номер телефона и подтверждать его будет не нужно.
После сохранения внесенных вами изменений вам придёт письмо о том, что регистрационные данные успешно изменены и после этого восклицательные знаки и жёлтая подсветка сверху пропадёт. Обращаю ваше внимание, что действие это нужно было совершить всего один раз, и дальнейшие изменения этих данных не потребуется.
Выбор доменного имени
Далее необходимо будет перейти в раздел, заказать услуги, в которым перейти во вкладку домены и здесь поле регистрация домена нужно будет ввести желаемое имя вашего сайта и доменную зону.
Если вы не планируете продвигать сайт в поисковых системах, но сайт вам нужен, например, как визитка, либо же вы планируете пользоваться только платным трафиком, тогда можете выбрать имя домена и зону произвольно. Ну а если же вы планируете получать посетителей и клиентов из поисковых систем, тогда я рекомендую для успешного выбора доменного имени посмотреть соответствующую статью на моем сайте. Если вы работаете по России, то рекомендую вам выбирать доменную зону .ru либо .рф. Во втором случае название сайта будет написано кириллическими символами. Если по каким-то причинам эта зона вас не устраивает, то вы можете кликнуть на ссылку все зоны и увидеть стоимость покупки доменных имён в тех зонах, которых данный провайдер предоставляет домены для покупки.
Для примера в данной статье, я выбрал вот такой доменное имя в зоне .ru. Как видите, цена для меня составила 170 рублей на первый год регистрации этого домена.
Покупка доменного имени
Далее я нажимаю кнопку в корзину. Здесь рекомендую ещё раз проверить название вашего домена на предмет ошибок или опечаток. И если всё правильно нажать кнопку, оформить заказ, после чего необходимо будет перейти в раздел финансы для пополнения счета, который будет совершён автоматически через 5 секунд. На странице пополнения счёта вы выбираете платежную систему и далее следуйте инструкциям, заполняйте email или телефон, на который придёт чек об оплате и после зачисления средств вы увидите сверху в разделе основной личный счёт ту сумму, на которую вы этот счёт пополнили. В моём случае это 170 рублей.
Активация и продление домена
Далее необходимо будет перейти с главной страницей в раздел услуги, где будет написано неоплаченные услуги 2 штуки. Здесь вы выбираете тот домен, который хотите зарегистрировать и нажимаете на жёлтую кнопку со значком плей, чтобы его активировать. После чего с вашего счёта спишется обозначенная сумма, и ваш домен будет зарегистрирован. То есть это доменное имя вы уже себе приобрели.
Я здесь обращаю ваше внимание, что если вы не знаете, нужен ли будет вам этот домен через год, то чтобы не произошло автопродление и ваши деньги автоматически не списались через год с вашей карты, стоит перейти в раздел услуги, далее вкладка домены и вот эту активную кнопочку авто продления зелёного цвета сделать серой.
Таким образом, где-то через 10-11 месяцев вам периодически приходят уведомления о том, что данный домен нужно будет продлевать, и если он вам до сих пор будет нужен, то вы сможете самостоятельно зайти на сайт хостер и этот домен продлить пополнив личный кабинет. Если же этот домен через год вам будет не нужен, то деньги автоматом не спишутся и по прошествии чуть больше года он будет удалён из системы и любой желающий сможет его купить. В моём случае я понимаю, что, скорее всего, он через год мне будет не нужен, поэтому эту кнопку я делаю неактивной. Через некоторое время, где-то примерно минут 15-20 вам на почту, указанную при регистрации, придёт вот такое письмо, которое уведомляет о том, что этот домен перерегистрирован за вами.
Привязка домена к хостингу
После чего необходимо будет перейти во вкладку управление. Далее выбрать хостинг и нажать на вот эту тот зелёный плюс с буквой д.
После чего выбрать домен, который вы только что купили и выбрать ту версию PHP, которую вы указывали на 1 шаге при регистрации у хостинг-провайдера.
В моём случае эта PHP 8.0, далее нажимаете кнопку привязать и через некоторое время вам на почту приходит ещё одно письмо, в котором будет уведомление о том, что ваш домен успешно привязан к хостингу, то есть мы приобрели первые 2 вещи, которые нам были нужны для создания своего сайта. То есть у нас уже есть домен, есть хостинг и всё, что остаётся это установить на него движок.
Установка движка на сайт
Для этого в этой же вкладке мы нажимаем ссылку, привязанные домены. И здесь обратите внимание, что доменов и у вас будет 2. Первый начинается с srv — это тестовый домен провайдера Hoster.ru и второй домен тот, который вы покупали. Соответственно, если вы хотите протестировать ваш сайт в течение 10 дней и потом определиться, будете ли вы покупать домен или же это вам не нужно, то тогда вы можете воспользоваться вот этим первым тестовым доменом и разместить на нем движок и посмотреть, как это выглядит вообще без траты денег.
И во втором случае, если же вы домен уже купили, то тогда можете разместить на нём свой сайт.
Однако я забыл сказать, что, как видите, в первом случае у меня стоит PHP 8.0, которую я выбирал на 1 шаге при создании аккаунта хостинга, а во втором случае для купленного мной домена, почему-то стоит PHP 5.6, хотя я также выбирал 8.0. Если вы увидите то же самое, то тогда необходимо будет нажать на эту надпись и выбрать нужную вам версию PHP, которая, напоминаю, была указана на 1 шаге, иначе могут быть проблемы с доступностью сайта.
После выбора у меня сразу же поменялась версия PHP на нужно мне и после этого я нажимаю на вот эту вот иконку с 3 разноцветными кубиками, которые обозначает авто установку движка на этот домен. Во всплывающем окне я выбираю WordPress, последнюю версию этого движка, а также ставлю галочку создать базу данных, после чего нажимая кнопку установить.
Активация движка
Появляется сообщение о том, что CMS успешно установлено и для настройки параметров можно перейти по ссылке. Ссылка эта ведёт на непосредственно ваш домен, и если вы выбрали тестовый домен, то скорее всего, сразу сможете установить движок на сайт.
Если же вы выбрали домен, который вы только что купили, то с большой долей вероятности в первое время вы увидите вот такое сообщение, что доступ к сайту получить не удаётся.
Это происходит потому, что регистрация нового домена может занимать до суток. Обычно это происходит быстрее и в моем случае прошло около двух часов.
После чего, зайдя на свой сайт, я увидел вот такое сообщение, которое говорит о том, что ваш домен доступен. Он размещён на хостинге, и всё, что остаётся вам сделать, это за несколько минут, установить на него движок, который наш хостинг-провайдер Hoster.ru нам уже успешно и бесплатно разместил. Всё, что вам остаётся это указать название сайта, имя пользователя, то есть логин, с которого вы будете заходить в админ-панель сайта и также указать пароль, если вы будете использовать пароль, который вам предлагается по умолчанию, рекомендую его сразу куда-то сохранить, потому что, как правило, он предоставляется достаточно сложным, и запомнить его просто нереально. И уже на следующем шаге вы будете его использовать. Поэтому обязательно сохраните его куда-нибудь в надежном месте, либо же укажите свой пароль, который также должен быть надёжным.
Также стоит указать email, на который будут приходить все сообщения, о каких-либо изменениях на вашем сайте. И если, опять же повторюсь, вы планируете продвигать сайт в поисковых системах, то на первое время, когда сайт ещё не будет создан, стоит поставить галочку попросить поисковые системы не индексировать сайт. Потом впоследствии в админке вы сможете её снять и показать поисковым системам ваш сайт, чтобы они увидели его уже в готовом состоянии, а не в состоянии разработки. После чего ещё раз рекомендую проверить введенные вами данные и нажать кнопку установить WordPress.
Продление домена
Далее появится сообщение об успешной установке и на следующем шаге вам будет предложено зайти в админ-панель сайта. Если вы внесёте адрес своего сайта в адресную строку браузера, то увидите, как он в данный момент выглядит. По умолчанию здесь ставится одна тема на всех сайтах, которые созданы на WordPress.
Соответственно, здесь важно понимать, что это уже ваш полноценный сайт, который вы можете настроить под себя. Большинство из действий не потребуют от вас какого либо знания программирования и процентов, наверное, 80 настроек вы можете произвести самостоятельно и бесплатно.
Но всё же, если вам нужна какая-то не типовая доработка, то вы можете обратиться на ту же фриланс биржу где находится очень много специалистов, по данной CMS. Опять же повторяю, что эта CMS она самая популярная в мире, поэтому каких-то проблем с тем, чтобы найти фрилансера, который вам доработает её под ваши нужды труда не составит совершенно. Соответственно, сейчас у вас начался десятидневный пробный период и провайдер Hoster.ru обязательно оповестит вас заранее, перед тем, как этот период будет заканчиваться, чтобы вы вовремя продлили хостинг и ваш сайт оставался доступным.
Если на прошлых шагах вы домен купили по моей инструкции, то продлевать его нужно будет только через год.
Если же вы воспользуетесь бесплатным тестовым доменом, то он будет доступен всегда, так как предоставляется провайдером совершенно бесплатно. На этом тестовом домене вы можете создавать какие-то свои проекты и далее переносить их уже на основные домены. Купить их, напоминая, можно прямо из панели управления хостингом.
Протоколы http и https
Остаётся один ещё важный момент, а именно, ваш сайт сейчас доступен по протоколу http, то есть, если мы посмотрим браузерная строку, то увидим сообщение о том, что соединение не защищено.
Если вы обращали внимание, то большинство сайтов сейчас доступно по протоколу https и в браузерной строке в этом же месте у них вместо этого сообщения нарисован зелёный закрытый замок.
Соответственно, сейчас процентов, наверное, 95 сайтов работает только по https, и это является современным стандартом безопасности. И уже много лет назад Google объявил о том, что те сайты, которые не работают по https, он будет показывать выдачу ниже, потому что передача данных пользователей по этому протоколу не является безопасным, и эти данные могут похитить. Если говорить совсем грубо, то сайт на http это то же самое, что если бы вы сейчас выехали на дорогу нас запорожце, то есть все понимают, что этот автомобиль морально устарел и, скорее всего, он не будет безопасным для вас и для других участников движения. И лучше всего в данном случае вам будет перейти на более современный автомобиль, которым пользуется большинство водителей.
Выпуск ssl сертификата
Для того, чтобы сайт был доступен по протоколу https, нужно выпустить ssl сертификат. Не пугайтесь данной терминологии. Сейчас я по шагам объясню, как это сделать, и более того, это будет абсолютно бесплатно.
Для этого в личном кабинете на сайте Hoster.ru мы переходим в раздел управление, далее сертификаты и нажимаем кнопку заказать бесплатно.
После чего мы выбираем тип сертификата базовый, домен тот, на который мы хотим этот сертификат разместить, указываем страну и регион, после чего нажимаем кнопку продолжить.
Через некоторое время вы увидите сообщение о том, что сертификат успешно будет выпущен. И здесь указан IP-адрес, который необходимо будет сохранить. Далее мы снова переходим в раздел управление сертификаты и здесь видим наш сертификат, который имеет состояние в процессе.
Где-то примерно через 20-30 минут это состояние поменяется на включен. После чего нужно сделать следующую действие. Переходим во вкладку управление домены/почта, кликаем на ссылку с соответствующим доменом, для которого мы сейчас выпускали сертификат.
Далее проматываем вниз, ищем строчку с типом А и здесь нажимаем на иконку с гаечным ключом и в поле значения место того, что там указано, указываем тот адрес, который был написан при создании сертификата.
Уже много лет это значения является одинаковым для всех у провайдера Hoster.ru и оно звучит как 31.28.24.244, если что-то поменяется, соответственно, вам нужно будет посмотреть в своём личном кабинете. Как это сделать я сказал несколько шагов назад. После чего нажимаем кнопку изменить.
Файл .htaccess
Появляются сообщения о том, что операция выполнена успешно, и после этого нам нужно будет выполнить еще одно важное действие, которое также несложное, но оно крайне важно для доступности вашего сайта, а именно мы переходим в раздел управление, хостинг, далее нажимаем вот на синюю кнопку с буквой W и попадаем в раздел где находятся все данные нашего сайта, которые представлены в папках. Выбираем папку с названием сайта, для которого мы только что выпустили сертификат и открываем её двойным кликом.
Далее находим файл .htaccess. Нажимаем на него правой кнопки и далее выбираем редактировать.
После чего в первую строчку этого файла нужно внести вот такую запись и файл этот сохранить.
На моем сайте есть статья, где я предоставляю вам эту запись, которую вы сможете копировать и вставить на свой сайт.
Редирект с http на https
Что он обозначает? Это обозначает перенаправление с протоколом http, то есть с незащищённого соединения на соединение, защищенное, которое идёт по протоколу, https. Другими словами, если пользователь у нас введёт адрес нашего сайта через http, то он все равно попадет на https, и его данные останутся в безопасности.
После чего необходимо будет проверить, всё ли мы правильно сделали, а именно в браузерной строке ввести адрес через http и убедиться в том, что происходит направление на https и вместо надписи, что соединение не защищено, у нас будет иконка зелёного закрытого замка.
Обращаю ваше внимание, что сертификат ssl действуют 3 месяца, так как он является бесплатным, то есть каждые 3 месяца вам нужно будет выпускать сертификат заново.
Ходить и менять данные в файле .htaccess уже будет не нужно. Нужно просто будет выпустить новый сертификат и старый сертификат соответственно удалить. Либо же это можно сделать автоматически, немножко доплатив хостинг-провайдеру за это действие.
Ну а лично я предпочитаю делать это вручную. На почту мне заранее приходит оповещение о том, что ssl сертификат скоро подойдёт к концу, и я захожу в личный кабинет и выпускаю новые сертификаты, а старые соответственно удаляю. С созданием сайта собственно, всё. То есть на этом шаге у вас уже есть ваш собственный сайт, который вы можете настроить под себя. Как вам это нужно. И сейчас я покажу несколько базовых настроек для изменения внешнего вида сайта.
Внешний вид сайта
Как мы видим, сайт выглядит прямо скажем, не очень и для того, чтобы поменять его внешний вид, необходимо перейти либо по адресу ваш домен, слэш wp-admin, либо же, если сайт у вас открыт и вы уже авторизованы в админке, то вы можете нажать сверху мой тестовый сайт и далее консоль.
Здесь мы переходим во внешний вид темы. И в этом разделе представлено несколько тем, которые по умолчанию устанавливаются на WordPress.
Сейчас у нас активная тема, которая называется twenty twenty one, но все эти темы они меня не особо устраивают, поэтому я нажимаю кнопку добавить новую тему.
Здесь я могу выбрать различные темы, большинство из которых бесплатны. Можете также отфильтровать их по популярным, либо свежим, либо применить более широкий фильтр характеристики. Здесь вы уже можете выбрать, что вам нужно видеть в итоге это либо блок, либо магазин, либо какая-то из конкретных тематик. И уже на основе этого вы сможете выбрать себе одну из множества тем, которые, повторяю, в большинстве случаев является бесплатными.
Я же для примера выберу тему, которая называется Neve. Я нажимаю кнопку активировать, после чего она появляется на моём сайте. Я могу на него перейти и посмотреть, как это будет выглядеть. Как видите, сейчас мой сад выглядит более чем достойно. В этой теме мы видим профессиональный дизайн и в принципе, заменив фотографии на свои вы уже совершенно бесплатно получаете профессиональный сайт, за который большие компании готовы заплатить сотни тысяч рублей только за вот его внешний вид, который вам уже повторяюсь, доступен бесплатно.
Редактирование и плагины
Чтобы изменить тексты на свои, нужно перейти в раздел страницы и записи.
Страницы WordPress это статичные страницы, на которых информация, как правило, не меняется. То есть это, например, может быть раздел контакты, либо же страница о нас. Записи это такие некие динамические материалы, которые похожи на новости. Они могут иметь теги, могут иметь рубрику и так далее.
Чтобы поменять текст на главной странице я перехожу в раздел страницы, все страницы. После чего выбираю ту страницу, которая у меня подсвечена как главная и нажимай кнопку изменить.
Здесь в редакторе блоков, как мы видим, доступно редактирование не только текстов, но и изображений и, соответственно, вы можете настроить сайт под себя. Также заходя в раздел страницы или записи вы можете удалять, добавлять, либо изменять уже существующие там материалы, которые автоматически будут добавлены в меню сайта и также без каких-то навыков программирования вы сможете их спокойно редактировать.
Если вам нужны какие то дополнения, то рекомендую заглянуть в раздел плагины, где его также, как и темы, сможете бесплатно найти себе подходящие дополнение, скачать его на свой сайт, после чего он сможет выполнять нужные вам функции.
Здесь я заострю внимание только на одном плагине. Напомню, что WordPress это шаблон, он изначально блоговый, но если вам необходим интернет-магазин, то есть это сайт, на котором представлен каталог товаров с возможностью заказа через корзину, после чего администратору этого сайта приходит на почту письмо о новом заказе. Тогда вам нужно установить плагин WooCommerce, который превратит ваш сайт в полноценный интернет-магазин на движке WordPress, то есть вместо записей вы сможете добавлять туда товары, категории, подкатегории и так далее.
Вот таким образом, потратив всего полтора-два часа времени, любой человек сможет создать себе полноценный современный и красивый сайт абсолютно бесплатно, заплатив только за его размещение на серверах.
Видео по теме
Обратите внимание! Оставить комментарий к этой статье можно под видео на Youtube.
Если Вам было интересно и полезно, можете поддержать проект.