Morin.dev
1 subscriber
1 photo
1 video
1 link
Разрабатываю сайты, которые не просто “есть”, а работают
Объясняю каждое решение: от дизайна до кода
WordPress / Bitrix / Frontend/Backend
Download Telegram
Channel created
Channel photo updated
Привет, я Данил 👋

Делаю сайты, которые приводят клиентов!

Немного обо мне:

Работал в компании «Цифровые сервисы» — участвовал в разработке проектов для сетей аптек (Laravel + Vue).
Сейчас работаю на себя:
погружаюсь в задачи бизнеса и выстраиваю сайты, которые реально работают.

Создал этот канал не просто чтобы «выкладывать работы»

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

Сейчас параллельно делаю дипломный проект — сайт с нуля (дизайн → верстка → запуск).

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


Если хочешь посмотреть, как я работаю:
1-Дизайн

2 -Творческие проекты

3-Программирование
Please open Telegram to view this post
VIEW IN TELEGRAM
Начал делать дипломный проект — сайт с нуля. В целом, я укомплектовываю фирму с нуля: в процессе мной уже был разработан логотип, макет сайта и дизайн, сейчас идёт этап разработки веб-сайта.

Решил подойти к нему не как к “учебной работе”, а как к реальному проекту, который будет запущен и приносить пользу предприятию. 

Первое, с чем столкнулся — модный дизайн ≠ продающий сайт.

В макете можно сделать чересчур красиво, добавить много эффектов, анимаций, текста, но это не увеличивает КПД, а может, наоборот, снижать эффективность сайта, особенно если фирма работает в строительной отрасли.

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

Сейчас как раз проверяю это на своём проекте.

Дальше покажу, где пришлось переделывать и почему
Morin.dev pinned «Привет, я Данил 👋 Делаю сайты, которые приводят клиентов! Немного обо мне: Работал в компании «Цифровые сервисы» — участвовал в разработке проектов для сетей аптек (Laravel + Vue). Сейчас работаю на себя: погружаюсь в задачи бизнеса и выстраиваю сайты,…»
Сделал главный экран для сайта и словил типичную современную ошибку. Хотел сделать модно и красиво, использовав сгенерированное искусственным интеллектом изображение. В какой-то момент понял, что это не помогает пользователю понять, что у компании есть реальный опыт, а наоборот — снижает доверие. Поэтому важно правильно подбирать изображение и текст на главной странице, чтобы коротко и ясно передать деятельность компании и вызвать доверие.

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

Главная задача первого экрана — не “вау-эффект”,

а ответить на 3 вопроса за несколько секунд:
— чем занимается компания
— какую задачу она решает
— почему стоит выбрать именно её

Если этого нет — пользователь просто уходит, так не узнав вашу ценность в решение его проблем.

В итоге упростил дизайн и сделал акцент на ясности текста и фото, которое помогает формировать доверие.
Что должно быть на первом экране, чтобы он реально работал?

Первый экран сайта — это не только про дизайн. В первую очередь — это про структуру.

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

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

Первый экран должен не “впечатлять”, а вызывать интерес и удерживать внимание.

Он как витрина. Пользователь должен сразу увидеть, что здесь есть решение его задачи.

В этот момент у него появляется ощущение: “возможно, я нашёл то, что искал”. Дальше важно не потерять этот интерес. Вся структура страницы должна быть выстроена так, чтобы постепенно раскрывать информацию и усиливать доверие, а не перегружать пользователя лишними деталями.
Каким должен быть текст на сайте?

Есть ошибка, которую часто допускают - пытаются написать “правильно”, но не думают, как это читается. Я тоже грешил этим, но через время стало получаться писать текст, так чтобы было его легко понять. Пользователь не читает текст, он его сканирует.

Пробежал глазами, поймал смысл, идёт дальше.

Если текст сложный, длинный или перегруженный, его просто пропускают.


Поэтому задача не “написать только красиво”, но и просто.

Если подытожить, то текст должен быть:

- простым;
- коротким;
- по делу.

Если текст нужно неоднократно перечитывать — он не работает.
Media is too big
VIEW IN TELEGRAM
Почему я решил рассказать об услугах через слайдер?

Когда начал продумывать блок с услугами, понял одну вещь: если просто вывалить всё списком, человек даже читать не будет. Особенно при первом просмотре сайта, поэтому решил сделать формат со слайдером.

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

Плюс это помогает сделать страницу визуально спокойнее и информативнее, а использование фото с объектов добавляет доверие.
Админка на сайте: когда она действительно нужна?

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

Например, есть страница “Проекты”. На старте можно вручную добавить туда несколько работ прямо в коде сайта. Это быстрее и дешевле. Но через месяц или полгода у компании появляется новый проект. Его нужно добавить на сайт: загрузить фото, написать описание, оформить карточку. Если страница сделана статично, без возможности редактирования через админку, для каждого такого изменения снова придётся обращаться к разработчику.И чем чаще обновляется контент, тем дороже становится поддержка сайта.

Поэтому перед разработкой важно заранее понять:

— какие страницы будут обновляться
— кто будет добавлять новый контент
— как часто будут появляться новые проекты, услуги или новости

Если контент планируется обновлять регулярно, админка становится не лишней функцией, а способом сэкономить деньги и время в будущем. Также можно попросить разработчика подготовить понятную инструкцию, как вы могли бы самостоятельно работать с контентом через админ панель без помощи контент менеджера или самого разработчика.
Хороший сайт — это не только дизайн и верстка. Это ещё и удобство дальнейшего использования.
Использование ИИ в разработке.

На днях я закрыл свою часть работы над одним проектом — делал верстку сайта. По плану, дальше должны сажать верстку на 1С-Битрикс. Сажать верстку должен другой разработчик, но в моменте я задумался, что можно попробовать с помощью искусственного интеллекта проверить весь проект: найти блоки, где вместо section используется div, убрать дублирование кода, найти код, который можно переписать в лучшую сторону, изменить структуру, но сохранить внешний вид страницы.

Это привело к написанию своего скилла, который будет подготавливать верстку к посадке на 1С-Битрикс, тем самым уменьшая головную боль как верстальщику, так и разработчику.

Первый этап для меня — создание набора правил, промптов, чеклистов и примеров для подготовки HTML/SCSS/JS-верстки к будущей посадке на 1С-Битрикс. Конечно, полноценным скиллом назвать нельзя, но данный набор сильно облегчил поиск недочётов в проекте, тем самым увеличив КПД. Получилось переписать div на section, добавить alt, что в дальнейшем будет помогать в продвижении сайта SEO. Убрали дублирующий код, привели код к понятной и правильной архитектуре.

Правильное внедрение ИИ значительно улучшило проект за короткий период времени, и при этом выиграли как разработчики, так и заказчики.