Close
Оставьте ваши контакты
Какой способ общения вам удобен?
Блог о маркетинге, рекламе и продвижении для предпринимателей

Как создать сайт самостоятельно пошаговая инструкция

Для этого не потребуются знания программирования и не нужно много денег. Сайт будет принадлежать только тебе, создание и обслуживание сайта обойдется примерно $100 в первый год и $35 в последующие года.
Инструкция поделена на этапы, которые важны для достижения результата:
1. Хостинг
2. Бесплатный движок CMS
3. Тема дизайна
4. Установка аналитики
5. Оптимизация

Я разобью текст на логические абзацы и сразу опишу что надо делать, чтобы ответить на вопрос заголовка статьи. Прочитайте или пролистайте статью до конца, я старался сделать понятно и полезно для вас)

Хостинг

Для своих проектов использую российский хостинг beget (это моя партнерская ссылка, при регистрации по ней, мне дадут какую-нибудь хрень, а вам целый месяц бесплатного доступа), чем дальше находится сервер от вашего посетителя, тем дольше грузится ваш сайт, поэтому логично использовать российские сервера для пользователей из России. Также, у хостинга очень дружелюбный интерфейс для начинающих владельцев сайтов и самая крутая поддержка, которая отвечает на любой вопрос, даже если это не вопрос по хостингу, можно позвонить им и по телефону помогут вам. Переходите по ссылке, регистрируетесь и готово! У вас теперь есть бесплатный хостинг на целый месяц.
Для начала надо создать наш сайт на хостинге, выбираем раздел Сайты на панели администратора.
Вводим здесь название папки на сервере можно любое, рекомендую на латинице, например, site.ru
Дальше прикрепляем единственный наш домен вида *.beget.tech
Он пока единственный, позднее мы приобретем наш собственный домен 1 уровня с красивым названием. Далее возвращаемся на главную страницу панели администратора хостинга. Потыкать можете позже, нас интересует раздел CMS. Переходим туда.
Выбираем WordPress именно это наш бесплатный движок для сайта. Выскакивает окошко, в которое мы вводим данные:
Сайт для установки - выбираем название папки на сервере. Домен по умолчанию - наш бесплатный домен вида *.beget.tech Описание сайта можете сразу заполнить или изменить в дальнейшем. Логин, пароль и email администратора вводите и запоминайте. Потом тяжело будет восстанавливать если вы все забудете, но возможно.После переходим (спустя 1-2 минуты) по ссылке (домен - название сайта) на наш сайт.
Ура! Наш сайт готов. Давайте его настраивать. В строке поиска браузера(браумер) находится ссылка на сайт, который мы создали вида *beget.tech/ теперь добавим слово admin и нажмем enter.
Так выглядит панель администратора на сайте, вводим данные и заходим.
Так выглядит консоль администратора сайта, с первого раза понять что к чему сложно. Но когда потыкаете и разберетесь будете интуитивно между разделами бегать. Сейчас настроим дизайн нашего сайта.

Дизайн

Почему называется "шаблон дизайна"? Потому что мы устанавливаем на наш сайт готовое решение, которое настроим под своим задачи и большинство проблем с оптимизацией сайта, адаптацией к мобильным устройствам, дизайн сайта будут решены.Чтобы посмотреть какие есть бесплатные шаблоны в WordPress. Переходим в Внешний вид ->Темы -> Нажимаем кнопочку сверху Добавить новую ->Можно выбрать бесплатный шаблон, популярный среди сообщества wordpress. Самые простые( в порядке усложнения) в освоении шаблоны Hestia, также OnePageExpress, Mesmerize. Возьмем для примера шаблон темы Hestia. Кликаем на названием шаблона. Жмем установить и активировать.
Теперь мы видим такой экран, тема установлена и активирована, дизайн уже сменен. Я рекомендую, установить демо контент на сайт, для этого жмем на синюю кнопку Импорт демо-содержимого
Оставляем все(WooCommerce-это плагин для создания интернет-магазина. Я позднее напишу статью про это) и жмем Import. Пока ждем, можем заварить себе чай и взять конфет. Вы этого заслужили.
Теперь весь контент установлен. Жмем Add your own content.
Так выглядит визуальный редактор на главной странице вашего сайта, можно здесь сразу исправлять и смотреть как это отображается на сайте.Если вы хотите что-то индивидуальное, продвинутое, платное! Есть два (три) ресурса для покупки дизайна шаблона. Выбираю на каком сам купишь, а на какой друга отправишь: themeforest.net Самая большая платная коллекция плагинов и шаблонов для Wordpress( там много всего еще, но я даже не смотрел). Единственный минус.что даже урезанная версия шаблона для вордпреса стоит от $20 или 12% от ежемесячного прожиточного минимума. Стандартный шаблон с полным функционалом стоит уже $50-70. wpnull.org Этот ресурс - парень,который решал домашку и давал на утро в школе списать всем остальным, за $4 сможете купить любой плагин или шаблон дизайна. Коллекция не такая большая, но выбор огромный.(Я пользуюсь этим ресурсом) templatemonster.com это украинский брат-близнец первого ресурса, я им не пользуюсь, но говорят,что коллекция плагинов не хуже по выбору ,что и у первого сайта, но стоит все равно дорого.https://www.s-sols.com/wordpress-site-response-time-optimization#lscache_hcext_autoopt_subc
Во всех трех случаях после покупки вы скачиваете архив с файлами, а что делать дальше с ним я покажу.
Возвращаемся в консоль администратора и переходим в вкладку "Внешний вид"- "Темы".
Жмем на кнопку "Добавить новую".
Придеться нажать еще одну кнопку "Загрузить тему". После выбираем архив, который скачали с сайта, на котором купили тему. Жмем после загрузки активировать и у вас установлена покупная тема дизайна для Wordpress.

Установка аналитики

Зачем нужна аналитика на сайте? С помощью аналитики вы сможете отслеживать, как меняется посещаемость вашего сайта, какая аудитория его посещает и многие другие показатели станут доступны при подключении метрикиПосле того, как вы установили дизайн, добавили контент,оптимизировали ваш сайт, то значит пора привязать аналитику (чтобы смотреть кто,откуда и как смотрел на ваш сайт) Яндекс.Метрика.
Переходим в "Плагины". Жмем на кнопку "Добавить новый".
Через поиск ищем "Metrika". Плагинов много,я рекомендую этот "WT Yandex Metrika".
Теперь нам понадобиться код счетчика. Настройка выставляем,как у меня. Переходим на сайт метрики.
Регистрируемся или авторизируемся. Жмем "Добавить счетчик". Надо заполнить две строки. "Имя счетчика" выбираем любое, чтобы понимать на какой сайт установлен счетчик. В следующей строчке вы вставляете путь на главную страницу сайта. И жмете галочку на Пользовательском (Вы же без меня понимаете, что его обязательно надо прочитать?).
Переходим во вторую вкладку и копируем код. Возвращаемся на сайт и вставляем в текстовую область на сайте.
Все. Готово.Ура!)

Оптимизация

Оптимизация сайта нужна, чтобы вы вовремя устраняли ошибки на вашем сайте), надежно его защитили и подготовили к продвижению. Я уже два раза показывал,как устанавливать плагины, поэтому опущу момент, как я это делаю в этом пункте.
Really Simple SSL
Плагин для установки SSL-сертификата, который вы предварительно заказали на хостинге beget.
Такие настройки выставляем в плагине. И добавляем 301 переадресацию через .htaccess. После вы увидите такие галочки также как и на втором скрине.
Вебмастер
Позволяет отслеживать ошибки на сайте и устранять их во время.
Гугл консоль
Аналог вебмастера от Яндекса со своими фишками. Изучайте тоже сайт скажет спасибо.
Swift Perfomance
Один из самых лучших плагин для кэширования сайта, чтобы он быстро грузился. Имеет бесплатную и платную версию($24 в год для одного сайта, если использовать купон SEMDEV40). Если будет популярный запрос распишу, как подробно настраивать.
All In One SEO Pack
плагин для SEO оптимизации страниц и создании xml карта сайты
robots.txt
Рекомендую самостоятельно добавить этот файлик со следующим содержимым на ваш сайт через хостинг
Google Page Speed
На этом сайте можно проверить оптимизацию вашего сайта для пользователей. Нормально если результат проверок выше 60 для мобильных версий и 80 для desktop версий.
Если вам лень это делать самостоятельно, закажите услуги у меня все сделаю "как надо" с учетом специфики вашего бизнеса.


Продвижение Маркетинг Продвижение сайта в Яндекс и Google (SEO) Создание сайтов/Web-разработка