Создай премиальный, современный, высококонверсионный одностр...

Prompt

Создай премиальный, современный, высококонверсионный одностраничный сайт для частного профессионального электромонтажника Александра в Ростове-на-Дону. ## ГЛАВНАЯ ИДЕЯ Это должен быть **личный сайт Александра**, где он сам рассказывает клиенту о себе, своих услугах и подходе к работе. ВЕСЬ ТЕКСТ — ОТ ПЕРВОГО ЛИЦА. Используй: "Я выполняю", "я занимаюсь", "я устанавливаю", "я помогаю", "я приезжаю", "я работаю". Не используй: "Александр выполняет", "Александр предоставляет", "мастер выполняет". При этом не начинай каждое предложение с "Я". Текст должен звучать естественно и профессионально по-русски. Например: "Выполняю полный комплекс электромонтажных работ — от разводки проводки до подключения оборудования." Сайт должен ощущаться так, будто потенциальный клиент лично общается с Александром. --- ## ТЕХНОЛОГИЯ * Весь сайт — **ОДИН HTML-файл**. * Только HTML + CSS + vanilla JavaScript. * Без React, Vue, Tailwind, Bootstrap и других фреймворков. * CSS и JS находятся внутри HTML. * Полностью адаптивный desktop/tablet/mobile дизайн. * Код должен быть чистым и легко редактируемым. --- ## ВИЗУАЛЬНЫЙ СТИЛЬ Сделай сайт похожим на **дорогой персональный бренд профессионального специалиста**, а не на обычный сайт электрика или страницу Avito. Приоритет: **визуальное качество + доверие + конверсия**. Стиль: * premium minimalism; * глубокий графитовый / почти чёрный; * белый и светло-серый; * аккуратный янтарный/золотистый акцент; * крупная современная типографика; * много воздуха; * мягкие скругления; * тонкие границы; * аккуратные тени; * современные line-icons. НЕ используй: * огромные изображения молний; * множество ⚡; * неон; * жёлтые градиенты повсюду; * cheesy electrical graphics; * стоковые фотографии электриков; * случайные AI-фотографии; * шаблонный "industrial construction" дизайн; * чрезмерный glassmorphism. Сайт должен выглядеть дорого, спокойно, уверенно и технологично. --- ## ФОТОГРАФИЯ АЛЕКСАНДРА Используй **именно эту фотографию**: https://i.postimg.cc/YC4hCRRn/Chat-GPT-Image-Aug-11-2026-at-07-46-05-PM-%281%29.png Это основной портрет Александра. КРИТИЧЕСКИ ВАЖНО: * используй именно этот файл; * не заменяй другой фотографией; * не генерируй нового человека; * не используй стоковую фотографию; * не делай маленькую круглую аватарку; * не искажай пропорции; * не применяй сильные фильтры. Используй фото: 1. В Hero — крупным визуальным элементом. 2. В секции "Обо мне" — крупным портретом в другой композиции. На mobile фотография также должна оставаться заметной. --- ## ФОТОГРАФИИ РАБОТ **Не используй фотографии в карточках услуг.** Услуги — только премиальные текстовые карточки + современные line-icons. Не используй случайные stock/AI фотографии. Если реальные фотографии работ будут предоставлены позже, предусмотрите возможность легко добавить их. Если реальных фотографий работ нет — **НЕ СОЗДАВАЙ ОТДЕЛЬНУЮ ПОРТФОЛИО-СЕКЦИЮ**. Не показывай пустые placeholders и не создавай ощущение незавершённого сайта. --- # 1. HEADER Sticky header. Логотип: **АЛЕКСАНДР** ЭЛЕКТРОМОНТАЖ Навигация: Услуги · Обо мне · Как работаю · Отзывы · Контакты CTA: **Получить расчёт** Добавь: "Ростов-на-Дону" На mobile — burger menu + CTA. --- # 2. HERO Hero должен за несколько секунд объяснить: кто я, что делаю, где работаю и почему мне можно доверять. Слева — текст, справа — крупный портрет Александра. Eyebrow: **Частный профессиональный электромонтажник · Ростов-на-Дону** H1: **Электрика под ключ в Ростове-на-Дону** Текст: "Выполняю электромонтажные работы в квартирах и частных домах — от монтажа и замены проводки до электрощитов, освещения и тёплого пола." Trust indicators: **20+** лет опыта **400+** довольных клиентов **2 года** гарантии **4 группа** электробезопасности CTA: **Получить бесплатный расчёт** Вторая кнопка: **Посмотреть услуги** Плашка: **Бесплатный выезд** Информация: "Ростов-на-Дону · Выезжаю по всему городу · Ежедневно 07:30–21:30" --- # 3. TRUST / ЦИФРЫ Крупные показатели: **20+** лет опыта **400+** довольных клиентов **2 года** гарантии **07:30–21:30** ежедневно Текст: "Работаю без посредников. Стоимость фиксируется в договоре, а дополнительные работы выполняю только после согласования." Не превращай "400+ клиентов" в "400+ объектов" или "400+ подтверждённых клиентов". --- # 4. УСЛУГИ H2: **Что я выполняю** Подзаголовок: "Полный комплекс электромонтажных работ для квартир и частных домов." Создай 6 основных premium-карточек без фотографий: **01 — Электрика под ключ** "Полный комплекс электромонтажных работ — от разводки до подключения оборудования." **02 — Монтаж и замена проводки** "Скрытая, открытая и ретро-проводка в новостройках, квартирах и частных домах." **03 — Электрощиты** "Сборка, монтаж и расключение электрощитов, установка автоматов, УЗО, счётчиков и устройств защиты." **04 — Освещение** "Розетки, выключатели, люстры, бра, точечные светильники, LED-ленты, датчики движения и наружное освещение." **05 — Тёплый пол** "Монтаж и подключение электрического тёплого пола." **06 — Ремонт и подключение электрики** "Устранение неисправностей, замена автоматов и розеток, подключение бытовой техники, варочных панелей, электрокотлов, водонагревателей и другого оборудования." Добавь небольшую строку: **Также выполняю:** Монтаж кабель-канала · установка подрозетников · перенос и замена розеток · стабилизаторы напряжения · контакторы · силовые кабели · заземление · уличное освещение · ретро-проводка Карточки должны иметь subtle hover animation. --- # 5. ОБО МНЕ H2: **Обо мне** Используй фотографию Александра. Текст: "Меня зовут Александр. Я частный профессиональный электромонтажник и занимаюсь электрикой уже более 20 лет." "Работаю с квартирами и частными домами — от отдельных электромонтажных задач до полной электрики под ключ." "Ценю своё и ваше время, поэтому приезжаю вовремя, заранее согласовываю объём работ и стоимость, а после завершения оставляю порядок." Блок: **Мой подход** ✓ Работаю без посредников ✓ Работаю по договору ✓ Фиксирую стоимость ✓ Дополнительные работы согласовываю заранее ✓ Гарантия 2 года ✓ Помогаю выбрать и закупить материалы ✓ Соблюдаю сроки ✓ Профессиональный инструмент ✓ 4 группа допуска по электробезопасности Секция должна ощущаться как личный рассказ Александра, а не корпоративная "О компании". --- # 6. КАК Я РАБОТАЮ H2: **Как проходит работа** Подзаголовок: "Стараюсь сделать процесс максимально понятным ещё до начала работ." 01 **Предварительный расчёт** "Уточняю задачу и ориентировочно рассчитываю стоимость и сроки." 02 **Выезд на объект** "Приезжаю на объект, делаю замеры и обсуждаю все детали." 03 **Смета** "Составляю смету и согласовываю стоимость работ." 04 **Договор** "Фиксируем договорённости и стоимость в договоре." 05 **Выполнение** "Выполняю работы поэтапно и соблюдаю согласованные сроки." 06 **Приёмка** "Вы принимаете выполненную работу и оплачиваете её." Desktop: горизонтальная timeline. Mobile: вертикальная. --- # 7. КВАРТИРЫ И ЧАСТНЫЕ ДОМА H2: **Работаю с разными объектами** Два крупных блока. ### КВАРТИРЫ "Помогаю организовать электрику в новостройках и вторичном жилье." * Электрика под ключ * Замена старой проводки * Новая разводка * Освещение * Розетки и выключатели * Электрощиты ### ЧАСТНЫЕ ДОМА "Выполняю электромонтаж в частных домах с учётом особенностей объекта." * Полный электромонтаж * Наружная проводка * Ретро-проводка * Заземление * Освещение * Подключение оборудования --- # 8. ОТЗЫВЫ H2: **Что говорят мои клиенты** Используй предоставленные реальные отзывы без изменения смысла: **Алексей Стрельцов — 2 августа** "Всё было сделано чётко и эффективно, без лишних движений и слов. Ребята работали оперативно, слаженно и профессионально. Я обращался к ним для монтажа электропроводки в своём частном доме, и результатом остался доволен. Рекомендую эту бригаду всем, кто ищет надёжных специалистов." **Николай — 21 июля** "Спасибо за качественную и быструю работу. Ребята профессионалы. Всем рекомендую" **Елена — 20 июля** "Спасибо за профессиональную и быструю работу. Обратилась с заменой электропроводки в квартире. Александр приехал на следующий день, всё обсудили, подсказал что и где лучше сделать. Так как у меня выбивало свет и искрило, войдя в моё положение, он приехал намного раньше. Весь необходимый материал покупал сам, его команда сделала всё качественно и быстро, обговорённая цена не изменилась по окончанию работ. Александр мастер своего дела." **Алла — 13 июля** "Спасибо большое за монтаж электрики! Всё очень понравилось! Работа выполнена качественно, с душой. Результатом очень довольны, обязательно порекомендую друзьям." **София — 26 июня** "Был запрос на замену электрики в квартире. Приехали на следующий день, обсудили план работы, расположение розеток, освещение. За два дня сделали всю электрику, несмотря на внеплановое отключение света. Довольна работой, советую ребят." Premium cards, много воздуха. Mobile: horizontal swipe. --- # 9. ГАРАНТИЯ И УСЛОВИЯ H2: **Всё прозрачно до начала работы** ✓ Работаю по договору ✓ Фиксирую стоимость ✓ Дополнительные работы только после согласования ✓ Оплата по факту выполненных работ ✓ Возможна поэтапная оплата ✓ Гарантия 2 года ✓ Помогаю с выбором и закупкой материалов ✓ Работаю без посредников Эта секция должна снижать страх клиента перед непредвиденными расходами. --- # 10. ФИНАЛЬНЫЙ CTA Большой premium CTA. H2: **Нужна надёжная электрика?** "Расскажите мне о вашей задаче. Помогу разобраться с объёмом работ, сориентирую по стоимости и договоримся о выезде." CTA: **Получить бесплатный расчёт** Вторая: **Позвонить Александру** "Ростов-на-Дону · Выезжаю по всему городу · Ежедневно 07:30–21:30" Также покажи: **Бесплатный выезд** --- # 11. ФОРМА Поля: * Имя * Телефон * Что требуется сделать Кнопка: **Получить расчёт** Добавь валидацию и success state. НЕ придумывай телефон, email или другие контакты. Оставь placeholders/переменные для последующей подстановки. --- # FOOTER **АЛЕКСАНДР** ЭЛЕКТРОМОНТАЖ "Профессиональный электромонтаж в Ростове-на-Дону" "Выезжаю по всему городу" "Пн–Вс · 07:30–21:30" CTA: **Получить расчёт** --- # КОНВЕРСИЯ Главная задача — привести посетителя к звонку или заявке. Логика страницы: **Кто я → что я делаю → почему мне доверять → как проходит работа → отзывы → заявка** CTA естественно размещаются в Hero, после услуг и в финальном блоке. Не ставь огромные кнопки после каждого блока и не перегружай сайт формами. --- # MOBILE Особенно тщательно проработай mobile: * никакого horizontal overflow; * крупные tap targets; * удобное меню; * читаемый текст; * фотография Александра остаётся заметной; * услуги легко сканируются; * отзывы поддерживают swipe; * CTA всегда легко найти. Можно использовать фиксированную нижнюю mobile CTA: **Получить расчёт** Она не должна закрывать контент. --- # АНИМАЦИИ Только subtle: * fade/slide reveal; * плавный scroll; * hover; * аккуратные button transitions; * micro-interactions. Без тяжёлого parallax, постоянного движения и flashy effects. --- # ФАКТИЧЕСКАЯ ТОЧНОСТЬ Используй только предоставленную информацию. НЕ придумывай: * цены; * адрес; * телефон; * email; * лицензии; * сертификаты; * награды; * бренды; * рейтинги; * количество выполненных объектов. Используй реальные преимущества: * 20+ лет опыта; * 400+ довольных клиентов; * гарантия 2 года; * работа по договору; * фиксированная стоимость; * дополнительные работы только после согласования; * оплата по факту; * поэтапная оплата; * бесплатный выезд; * закупка материалов; * работа без посредников; * выезд по всему Ростову-на-Дону; * ежедневно 07:30–21:30; * 4 группа допуска по электробезопасности. Используй **20+ лет опыта**, так как это заявлено самим Александром в его описании. --- # ЯЗЫК Весь сайт — **ТОЛЬКО НА РУССКОМ ЯЗЫКЕ**. Не используй английские заголовки, кнопки или lorem ipsum. Текст должен звучать как естественная речь профессионального русского мастера. --- # ФИНАЛЬНЫЙ РЕЗУЛЬТАТ Сайт должен создавать ощущение: "Понятно, кто этот человек." "Он профессионально занимается электрикой." "Он работает по договору и даёт гарантию." "Он сам лично занимается проектом." "Стоимость прозрачная." "Есть реальные отзывы." "Можно спокойно позвонить и обсудить мою задачу." Сделай **премиальный персональный бренд Александра**, а не шаблонный сайт электрика. Если приходится выбирать между количеством контента и качеством дизайна — выбирай **качество дизайна, доверие и конверсию**.

A system prompt was added to support web rendering