Пошаговый гайд: Создание сайта на Weblium с иллюстрациями для новичков

Обновление тарифа ПРО: теперь все продукты mottor в одном тарифе! Подробнее

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

Главная / Блог / Пошаговый гайд: Как создать сайта на Weblium без опыта

Пошаговый гайд: Как создать сайта на Weblium без опыта

Создайте профессиональный сайт на Weblium за несколько часов! Наш подробный пошаговый гайд с иллюстрациями покажет, как новичку без опыта программирования создать красивый и функциональный сайт. Узнайте все секреты: от выбора шаблона до публикации. 300+ готовых дизайнов, drag-and-drop редактор, SEO-оптимизация, мобильная адаптация. Начните создавать свой сайт уже сегодня - это проще, чем кажется!

Гайд-инструкция

Советы

Дата публикации: 23.07.2025

Время прочтения: 10 минут

Создать собственный сайт сегодня может буквально каждый — без знаний программирования, дизайна и верстки. Один из самых популярных способов сделать это — воспользоваться конструктором Wix. Это мощная и удобная платформа, с которой можно собрать сайт всего за несколько часов. И в этой статье я покажу вам, как это сделать пошагово — от регистрации до публикации.

Шаг 1: Регистрация и вход в систему

1.1 Переход на сайт Weblium

Первое, что нужно сделать — зарегистрироваться. Переходим на сайт Weblium и нажимаем кнопку “Создать сайт”. Далее вы можете зарегистрироваться с помощью почты, Google-аккаунта или Facebook.

Совет: Используйте Google аккаунт для быстрой регистрации — это займет всего 10 секунд!

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

2.1 Галерея шаблонов

После регистрации вы попадете в галерею шаблонов, необходимо только выбрать, какой подходит именно вам.

2.2 Категории шаблонов

Основные категории:

Бизнес — корпоративные сайты, консалтинг
E-commerce — интернет-магазины
Портфолио — творческие проекты
Медицина — клиники, врачи
Рестораны — кафе, доставка еды
Образование — курсы, школы
Недвижимость — агентства, риелторы
Фитнес — спортзалы, тренеры

2.3 Выбор и просмотр шаблона

Пошаговые действия:

1. Выберите категорию в левой панели
2. Просмотрите превью — наведите курсор на шаблон
3. Нажмите "Просмотр" для детального осмотра
4. Оцените функционал:
- Количество страниц
- Типы блоков
- Цветовая схема
- Общий стиль
5. Нажмите "Использовать шаблон"

Совет: Выбирайте шаблон не только по дизайну, но и по функционалу — проверьте, есть ли нужные вам блоки (формы, галереи, магазин).

Забудьте о кодинге

ИИ сделает сайт за 3 минуты

Ответьте всего на 2 вопроса и получите готовый сайт для вашей сферы деятельности

Сгенерировать сайт

Шаг 3: Знакомство с редактором

3.1 Интерфейс редактора

Основные элементы интерфейса:

Левая панель — Инструменты:
Страницы — управление страницами сайта
Блоки — библиотека готовых блоков
SEO — настройки поисковой оптимизации
Настройки — общие параметры сайта

Центральная область — Редактирование:
Живой предварительный просмотр сайта
Возможность клика на любой элемент для редактирования
Визуальные границы блоков при наведении

Правая панель — Свойства:
Настройки выбранного элемента
Стили и форматирование
Анимации и эффекты

Верхнее меню — Действия:
Сохранить — сохранение изменений
Просмотр — предпросмотр сайта
Устройства — переключение между десктоп/планшет/мобильный
Опубликовать — публикация сайта

3.2 Навигация по редактору

Основные горячие клавиши:

Ctrl + S — сохранить изменения
Ctrl + Z — отменить действие
Ctrl + Y — повторить действие
Delete — удалить выбранный элемент

AI mottor уже сделал

сайт за вас

AI mottor уже сделал сайт за вас

Ответьте всего на 2 вопроса и получите готовый сайт для вашей сферы деятельности

Попробовать бесплатно

Шаг 4: Редактирование контента

4.1 Редактирование текста

Пошаговые действия:

Кликните на текст который хотите изменить
Выделите нужную часть или весь текст
Введите новый контент

Настройте форматирование:
Шрифт: выберите семейство шрифтов
Размер: от 8px до 72px
Цвет: из палитры или hex-код
Стиль: жирный, курсив, подчеркивание
Выравнивание: по левому краю, центр, по правому краю

Совет: Используйте не более 2-3 разных шрифтов на сайте для поддержания единого стиля.

4.2 Замена изображений

Пошаговые действия:
Кликните на изображение
Нажмите "Изменить изображение" в правой панели

Выберите источник:
- Загрузить с компьютера (JPG, PNG, WebP)
- Библиотека Weblium (бесплатные стоковые фото)
- Вставить URL изображения

Настройте изображение:
Обрезка и кадрирование
Фильтры и эффекты
Позиционирование

Рекомендуемые размеры изображений:
Фон героя: 1920x1080px
Карточки товаров: 600x600px
Иконки: 64x64px
Логотип: 200x200px (PNG с прозрачностью)

4.3 Изменение цветовой схемы

Создание фирменной палитры:
Выберите основной цвет бренда (для кнопок и акцентов)
Дополнительный цвет (для заголовков)
Нейтральные цвета (серый для текста, белый для фона)

Применение цветов:
Выберите элемент → Правая панель → Цвет
Используйте цветовой круг или введите HEX-код
Сохраните цвета в палитре для повторного использования

Шаг 5: Добавление новых блоков

5.1 Библиотека блоков

Контентные блоки:
Текст с изображением — комбинированный контент
Галерея фотографий — портфолио, каталог
Видео блок — YouTube, Vimeo встраивание
Слайдер — карусель изображений

Интерактивные блоки:
Контактная форма — сбор заявок
Подписка на newsletter — email-маркетинг
Карта Google Maps — местоположение
Социальные сети — иконки и ленты

E-commerce блоки:
Каталог товаров — сетка продуктов
Корзина — управление заказами
Отзывы клиентов — социальные доказательства
FAQ — часто задаваемые вопросы

5.2 Добавление блока

Пошаговые действия:

Определите место для нового блока
Нажмите кнопку "+" между существующими блоками
Выберите категорию блоков в левой панели
Просмотрите варианты блоков
Кликните на нужный блок — он автоматически добавится
Настройте содержимое блока

Совет: Располагайте блоки логично — от общего к частному, сверху вниз по важности.

5.3 Настройка блоков

Основные настройки каждого блока:

Отступы — внутренние и внешние
Фон — цвет, изображение, градиент
Адаптивность — поведение на разных устройствах
Анимации — появление при прокрутке

Попробовать бесплатно

Сэкономьте свои деньги

создайте сайт через нейросеть

Ответьте всего на 2 вопроса и получите готовый сайт

Шаг 6: Настройка меню и навигации

6.1 Структура меню

Типичная структура для бизнес-сайта:

6.2 Редактирование меню

Пошаговые действия:
Кликните на меню в шапке сайта
Откроется панель редактирования меню

Для добавления пункта:
Нажмите "Добавить пункт"
Введите название
Выберите страницу или введите URL

Для изменения порядка:
Перетащите пункты в нужном порядке

Для удаления:
Нажмите "Удалить" рядом с пунктом

6.3 Создание дополнительных страниц

Типы страниц:
Обычная страница — статический контент
Страница блога — для статей
Страница каталога — для товаров
Страница контактов — с формой и картой

Создание новой страницы:
Перейдите в "Страницы" (левая панель)
Нажмите "Добавить страницу"
Выберите тип страницы
Задайте параметры:
Название страницы
URL (адрес)
Мета-описание
Показывать в меню (да/нет)

Совет: Используйте понятные URL на русском языке транслитом: /o-kompanii, /uslugi, /kontakty.

Шаг 7: SEO-оптимизация

7.1 Основные SEO-настройки

Title (заголовок страницы):
Длина: 50-60 символов
Содержание: основное ключевое слово + название компании
Пример: "Создание сайтов в Москве | Веб-студия WebMaster"

Description (описание):
Длина: 150-160 символов
Содержание: краткое описание страницы с ключевыми словами
Пример: "Профессиональное создание сайтов в Москве. ✅ Современный дизайн ✅ SEO-оптимизация ✅ Гарантия результата. Звоните: +7 (495) 123-45-67"

Keywords (ключевые слова):
Количество: 5-10 ключевых фраз
Разделитель: запятая
Пример: "создание сайтов, разработка сайтов Москва, веб-дизайн"

7.2 Настройка SEO в Weblium

Пошаговые действия:
Выберите страницу для оптимизации
Откройте раздел "SEO" в левой панели

Заполните поля:
Заголовок страницы (Title)
Описание (Description)
Ключевые слова (Keywords)
URL страницы

Настройте Open Graph для соцсетей:
Изображение для превью (1200x630px)
Заголовок для соцсетей
Описание для соцсетей

7.3 Дополнительные SEO-факторы

Оптимизация контента:
H1 заголовок — один на страницу, с главным ключевым словом
H2-H6 подзаголовки — структурируют контент
Alt-теги изображений — описание для поисковиков
Внутренние ссылки — связывают страницы между собой

Технические факторы:
Скорость загрузки — оптимизируйте изображения
Мобильная версия — адаптивный дизайн
SSL-сертификат — автоматически в Weblium
Карта сайта — генерируется автоматически

Сгенерировать сайт

Не тратьте дни на разработку пусть ИИ сделает это за вас

Ответьте всего на 2 вопроса и получите готовый сайт для вашей сферы деятельности

Шаг 8: Мобильная версия

8.1 Переключение в мобильный режим

Пошаговые действия:
Найдите иконки устройств в верхней панели редактора

Выберите тип устройства:
🖥️ Десктоп — компьютеры (1920px+)
📱 Планшет — планшеты (768-1024px)
📱 Мобильный — смартфоны (до 768px)

8.2 Адаптация для мобильных

Что нужно проверить и настроить:

Текст:
Размер шрифта — минимум 16px для основного текста
Длина строк — 45-65 символов для комфортного чтения
Контрастность — достаточная для чтения на солнце

Изображения:
Размер — адаптируются автоматически
Пропорции — могут отличаться от десктопной версии
Загрузка — оптимизированы для мобильного интернета

Кнопки и ссылки:
Размер — минимум 44x44px (Apple HIG)
Расстояние — между кликабельными элементами
Контрастность — четко видимые границы

Формы:
Поля ввода — достаточно большие для касания
Подписи — четкие и понятные
Валидация — мгновенная обратная связь

8.3 Тестирование мобильной версии

Проверочный чек-лист:

✅ Все элементы видны и кликабельны
✅ Текст читается без зума
✅ Меню работает корректно
✅ Формы заполняются легко
✅ Изображения загружаются быстро
✅ Анимации не тормозят интерфейс

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

Шаг 9: Настройка домена

9.1 Типы доменов в Weblium

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

Бесплатный поддомен:
Формат: ваш-сайт.weblium.site
Плюсы: бесплатно, сразу доступен
Минусы: не запоминается, влияет на доверие

Собственный домен:
Формат: ваш-сайт.ru / ваш-сайт.com
Плюсы: профессиональный вид, лучше для SEO
Минусы: требует оплаты (~500-1500₽/год)

9.2 Подключение собственного домена

Если домен уже куплен:

Перейдите в настройки сайта
Выберите раздел "Домен"
Нажмите "Подключить домен"
Введите ваш домен: example.com
Скопируйте DNS-записи из Weblium
Войдите в панель вашего регистратора
Замените DNS-записи на предоставленные Weblium
Ждите обновления (24-48 часов)

Если домен нужно купить:

Выберите регистратор:
REG.RU — российский регистратор
Namecheap — международный
GoDaddy — популярный зарубежный
Проверьте доступность домена
Оформите покупку
Подключите к Weblium по инструкции выше

9.3 SSL-сертификат

Автоматическая настройка:

SSL-сертификат подключается автоматически
Сайт становится доступен по HTTPS
Зеленый замочек в адресной строке браузера

Шаг 10: Публикация сайта

10.1 Финальная проверка

Чек-лист перед публикацией:

Контент:
✅ Все тексты проверены на ошибки
✅ Изображения загружены и оптимизированы
✅ Контактная информация актуальна
✅ Ссылки работают корректно

SEO:
✅ Заполнены Title и Description для всех страниц
✅ Настроены H1-H6 заголовки
✅ Добавлены Alt-теги к изображениям
✅ Создана карта сайта

Техническое:
✅ Мобильная версия адаптирована
✅ Формы тестированы и работают
✅ Домен подключен (если нужно)
✅ Аналитика настроена

10.2 Процесс публикации

Пошаговые действия:

1. Нажмите кнопку "Опубликовать" в верхнем меню
2. Выберите план:
- Бесплатный — с поддоменом weblium.site
- Pro — с собственным доменом и расширенным функционалом
3. Подтвердите публикацию
4. Дождитесь завершения (1-3 минуты)
5. Получите ссылку на опубликованный сайт

10.3 После публикации

Подключение аналитики:

Google Analytics:
- Создайте аккаунт на analytics.google.com
- Получите код отслеживания
- Добавьте в настройки Weblium

Яндекс.Метрика:
- Зарегистрируйтесь на metrica.yandex.ru
- Создайте счетчик
- Установите код на сайт

Индексация в поисковых системах:

Google Search Console:
- Добавьте сайт в GSC
- Подтвердите права собственности
- Отправьте карту сайта

Яндекс.Вебмастер:
- Зарегистрируйте сайт
- Пройдите верификацию
- Добавьте sitemap.xml

Заключение

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

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

Оглавление

Шаг 1: Регистрация и вход в систему

1.1 Переход на сайт Weblium

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

2.1 Галерея шаблонов

2.2 Категории шаблонов

2.3 Выбор и просмотр шаблона

Шаг 3: Знакомство с редактором

3.1 Интерфейс редактора

3.2 Навигация по редактору

Шаг 4: Редактирование контента

4.1 Редактирование текста

4.2 Замена изображений

4.3 Изменение цветовой схемы

Шаг 5: Добавление новых блоков

5.1 Библиотека блоков

5.2 Добавление блока

5.3 Настройка блоков

Шаг 6: Настройка меню и навигации

6.1 Структура меню

6.2 Редактирование меню

6.3 Создание дополнительных страниц

Шаг 7: SEO-оптимизация

7.1 Основные SEO-настройки

7.2 Настройка SEO в Weblium

7.3 Дополнительные SEO-факторы

Шаг 8: Мобильная версия

8.1 Переключение в мобильный режим

8.2 Адаптация для мобильных

8.3 Тестирование мобильной версии

Шаг 9: Настройка домена

9.1 Типы доменов в Weblium

9.2 Подключение собственного домена

9.3 SSL-сертификат

Шаг 10: Публикация сайта

10.1 Финальная проверка

10.2 Процесс публикации

10.3 После публикации

Заключение

Читайте также: