Как создать сайт с нуля

«Хочу сайт, но не знаю, с чего начать» — с этой фразы начинается почти каждый первый проект. Дальше человек открывает десять вкладок с конструкторами, читает про HTML и хостинг, пугается и закрывает всё. Через месяц повторяет то же самое.

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

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

Есть три пути, и выбирать нужно по цели, а не по советам из интернета:

Если сайт нужен «чтобы было» — берите конструктор. Если хотите научиться и делать сайты дальше — второй путь. Если сайт должен приносить заявки, а времени нет — третий.

Сайт без задачи — это визитка в столе. Поэтому первый вопрос не «какой шаблон выбрать», а «что человек должен сделать на сайте».

Варианты ответа:

• позвонить или написать;
• оставить заявку;
• купить товар;
• записаться на приём;
• прочитать информацию;
• посмотреть портфолио.

От ответа зависит всё: сколько будет страниц, какие блоки нужны и где стоять кнопке. Лендинг под заявку и сайт-портфолио для дизайнера выглядят совершенно по-разному.

Структура — это список страниц и блоков. Пока её нет, любой дизайн превращается в гадание.

Для одностраничника хватит 7–9 блоков: первый экран, для кого, что входит, как проходит, доказательства, цена, вопросы, контакты.

Для сайта на несколько страниц — минимум пять: главная, услуги, о компании, контакты и одна страница под главную услугу. Если услуг несколько и они разные, под каждую нужна своя страница: так их находят в поиске.

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

Тексты — этап, который все откладывают, а потом он тормозит проект на неделю. Макет с «Lorem ipsum» рассыпается, как только появляются настоящие абзацы.

Что нужно как минимум:

• заголовок первого экрана: что вы предлагаете и кому;
• 3–5 строк о том, как это работает;
• состав услуги или товара;
• цена или вилка цен;
• ответы на пять частых вопросов;
• контакты и способ связи.

Писать лучше от руки и коротко, как рассказали бы знакомому. Потом можно попросить нейросеть сократить и привести к форме — но не наоборот: если начать с генерации, получится гладкий текст ни о чём.

Дизайн новичку нужен не «красивый», а аккуратный. Три правила закрывают 90% задач:

1. Один акцентный цвет. Кнопки и ссылки — одного цвета, остальное нейтральное.
2. Две гарнитуры максимум: одна для заголовков, одна для текста. Или одна на всё.
3. Воздух. Отступы между блоками больше, чем кажется правильным.

Референсы ищите не на сайтах-галереях, а среди конкурентов: откройте пять сайтов в вашей нише и отметьте, что работает. Копировать не нужно — нужно понять закономерности.

Здесь и начинаются различия между тремя путями.

Конструктор. Регистрируетесь, выбираете шаблон, меняете блоки, подключаете домен. Плюс — быстро и без кода. Минус — зависимость от платформы и ограничения шаблона.

Нейросеть + свой хостинг. Просите модель собрать страницу по структуре, получаете HTML и CSS, кладёте на хостинг. Плюс — сайт полностью ваш, можно править что угодно. Минус — нужно понимать хотя бы основы, иначе любая правка превращается в переписку с ИИ.

Студия или фрилансер. Вы даёте задачу и материалы, получаете готовый сайт. Плюс — быстро и профессионально. Минус — цена и зависимость от исполнителя.

Промпт для сборки, если выбрали второй путь:

Домен — это адрес. Хостинг — место, где лежат файлы. Для статического сайта хостинг может быть бесплатным, для сайта на PHP или с формой — от 200 рублей в месяц.

Что важно знать новичку:

• домен в зоне .ru стоит около 200–400 рублей в год;
• домен продлевается каждый год, забывать нельзя;
• бесплатный хостинг подходит для учёбы, но не для бизнеса;
• SSL-сертификат (https) сейчас дают бесплатно почти везде;
• после покупки домена сайт может открыться не сразу — до 24 часов.

Не покупайте домен «на будущее» до того, как сайт готов. И не берите длинные адреса с дефисами: их невозможно продиктовать по телефону.

Публикация — это загрузка файлов на хостинг и привязка домена. Звучит страшно, делается за час.

Порядок:

1. Загрузить файлы (через панель хостинга или FTP).
2. Убедиться, что главная страница открывается по адресу.
3. Проверить, что все картинки на месте.
4. Проверить на телефоне и в другом браузере.
5. Включить https.

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

Сайт, о котором никто не знает, не работает. Минимум:

• добавить сайт в Яндекс Вебмастер и Google Search Console;
• создать sitemap.xml и robots.txt;
• заполнить Title и Description на каждой странице;
• подключить Яндекс Метрику;
• завести карточку в Яндекс Бизнесе, если есть адрес.

Это не «продвижение», а база. Без неё поисковики просто не узнают о страницах, а вы не узнаете, что происходит с трафиком.

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

Итого у новичка — 1–2 недели вечерами. Это нормально: половина времени уходит не на сайт, а на освоение инструментов.

1. Начать с дизайна. Полгода выбирать шрифт и не написать ни строчки текста.
2. Сделать «сайт про себя». Вместо ответа на вопрос клиента — рассказ о любви к своему делу.
3. Спрятать цены. «Уточните по телефону» отсекает половину обращений.
4. Забыть про телефон. 60–70% посетителей придут с мобильного.
5. Поставить форму-заглушку. Заявки не приходят, а вы думаете, что «реклама не работает».
6. Тяжёлые картинки. Фото по 5 МБ превращают загрузку в минуту ожидания.
7. Не проверить после публикации. Кнопки, ссылки, форма — всё нужно нажать руками.
8. Бросить на полпути. Самый частый вариант: сайт готов на 80% и лежит в папке.

Публикация — это не конец, а точка, с которой начинается проверка. Первая неделя решает, будет сайт работать или просто существовать.

День 1. Пройдите сайт как чужой человек: с телефона, в другом браузере, в инкогнито. Нажмите все кнопки, отправьте форму, проверьте, что заявка пришла. Найдите битые ссылки и картинки, которые не загрузились.

День 2. Отправьте адрес пяти знакомым и попросите сказать первое впечатление в одном предложении. Если все пятеро не понимают, чем вы занимаетесь, — проблема в первом экране, а не в них.

День 3. Подключите Метрику и Вебмастер, если ещё не сделали. Добавьте сайт в Яндекс Бизнес, чтобы он появился на карте.

День 4–7. Смотрите, что происходит: сколько людей зашло, на какой странице уходят, доходят ли до формы. Не делайте выводов по одному дню — дайте хотя бы неделю.

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

Создать сайт с нуля — это восемь шагов: цель, структура, тексты, вид, сборка, домен, публикация, поиск. Каждый занимает часы, а не месяцы. Главное — не перескакивать: код без структуры и текста всегда заканчивается переделками.

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

Пять вопросов по статье — чтобы понять, что запомнилось.