Веб-минимум: как устроен сайт, если вы не программист

Argo Intelligent5 июля 20263 мин чтения✓ проверено 5 июля 2026

Claude Code напишет код за вас - но разговаривать с ним будет легче, если вы понимаете, из чего вообще состоит сайт. Это не курс программирования. Это словарь из десяти понятий: прочитаете за десять минут, и половина «магии» станет прозрачной, а ваши просьбы к ИИ - точнее.

Клиент и сервер: кто где работает

Всё в интернете - разговор двух сторон. Клиент - это браузер на устройстве посетителя: он показывает страницы. Сервер - компьютер, который где-то стоит и отдаёт эти страницы по запросу. Вводите адрес - браузер просит у сервера страницу - сервер отдаёт - браузер рисует.

Почему это важно вам: простому сайту-визитке сервер с логикой не нужен - это просто файлы, которые можно положить на бесплатный хостинг (шаг 2.8). А вот когда появляются «личный кабинет», «приём заявок в базу», «оплата» - нужна серверная часть, и это уже другой уровень (кластер 4). Понимая разницу, вы не будете просить у ИИ «маленькую правку», которая на самом деле - стройка.

Три языка страницы

Любая страница состоит из трёх слоёв, и у каждого своя роль:

HTML - скелет: какие на странице блоки, заголовки, кнопки, картинки.
CSS - внешность: цвета, шрифты, отступы, как блоки встают на экране телефона.
JavaScript (JS) - поведение: что происходит при клике, скролле, отправке формы.

Практический смысл: говорите Claude на языке ролей. «Кнопка не там» - вопрос HTML-структуры. «Кнопка некрасивая» - CSS. «Кнопка не работает» - JavaScript. Так и формулируйте - попадёте точнее.

JSON: как данные ходят между программами

JSON - формат, в котором программы передают друг другу данные. Выглядит как список «ключ: значение» в фигурных скобках:

{ "имя": "Мария", "телефон": "+7 900 000-00-00", "услуга": "маникюр" }

Заявка с формы, ответ платёжной системы, настройки - всё ходит в таком виде. Пугаться его не надо: это просто анкета без украшений. Когда Claude покажет вам JSON, вы теперь знаете - это данные, и их можно прочитать глазами.

Файлы проекта: что лежит в папке сайта

Откройте любую папку проекта, который сделал Claude Code, - там всегда похожий набор:

index.html - главная страница (сервер отдаёт её по умолчанию);
файлы .css и .js - те самые внешность и поведение;
папка с картинками (images/, public/);
README.md - записка «что это и как запустить» (файлы .md - обычный текст с разметкой, как материалы нашей базы);
иногда package.json - список «запчастей», которые проект использует, и команд для его запуска.

Полезная привычка: попросите Claude Code «покажи структуру проекта и объясни в двух словах, что за что отвечает». Он объяснит - и папка перестанет быть чёрным ящиком.

Адреса: домен и хостинг

Хостинг - место, где лежат файлы сайта (тот самый сервер). Домен - человеческое имя, по которому сайт находят (vash-biznes.ru). Это две разные покупки: файлы могут лежать бесплатно (шаг 2.8), а домен стоит несколько сотен рублей в год у регистратора. Связываются они настройкой «домен смотрит на хостинг» - Claude подскажет, как, когда дойдёте.

Практика шага

Попросите Claude Code: «Создай простую страницу-визитку про меня и объясни как новичку, что за файлы ты создал и зачем каждый». Потом три проверочных просьбы - по одной на слой: «поменяй заголовок» (HTML), «сделай фон тёмным» (CSS), «пусть по клику на кнопку появляется сообщение» (JS). Увидите своими глазами, какой слой за что отвечает.

Следующий шаг - Git: страховка, которая позволит смело ломать и откатывать.