Всем веб-девам рекомендую плагин CrocoBlock JetEngine:
https://crocoblock.com/plugins/jetengine/?ref=507
Это движок для кастомных типов записей (CPT) и их использованию. Имеет больше возможностей и лучше чем ACF, Toolset или Pods. По простому, это движок, который раскрепощает WP-блог в WP-любой-сайт.

Связкой WP+Elementor+JetEngine я несколько различных сайтов доводил от нуля до релиза в кратчайший срок, для проектов, которые сперва начинались на OpenCart, Drupal, на Django или Yii. Запуски новых проектов надо делать на чём-то более простом, и это в большинстве случаев это оказывается WordPress.

Браться делать на фреймоврке сразу — это изобретать велосипед. И это совершенно не облегчает основную работу — делать красивую верстку и впечатляющий дизайн, что обязательно нужно на старте для привлечения аудитории. На фреймворк надо переходить когда вы осознали архитектуру и поняли в чём WP перестал устраивать.

Также, вместо того чтобы выбирать Tilda я всем рекомендую выбрать WordPress с плагинами Elementor и JetEngine.
Из Тильды через год вы захотите вылезти, потому что почувствуете её потолок и потому что там примитивная CMS за ощутимую стоимость. Но окажетесь в западне миграции контента.

У Crocoblock огромное коммунити на гитхабе (Pro) и на фэйсбуке (казуал), и большой зоопарк сопутствующих плагинов, которые все друг с другом дружат. Тут я об том чуть подробнее расписал: https://podhod.ru/blog/crocoblock

WordPress база

Иногда говорят что WordPress медленный. В WP из коробки нет кэширования и оптимизации отдаваемых страниц. Поставьте один любой плагин:

• WP Super Cache
• WP Fastest Cache
• W3 Total Cache

они все примерно одинаковые.

• А лучше всего LightSpeed Cache в связке c сервером LightSpeed на VPS.

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

• Wordfence Security
• All-In-One Security (AIOS)
• Jetpack (я не использую за излишние функции)
• Solid Security Basic — самый удачный на мой взгляд.

В чём вундерваффе?

Управлять контентом и SEO умеют многие CMS.

Делать красивые страницы из блоков и анимации умеют многие конструкторы сайтов.

Создавать и выводить данные умеют все фреймворки.

Но только у WP с Elementor и Crocoblock есть все эти возможности в единой среде.

Продвинутое применение

С Elementor не нужна Figma для прототипирования. Собирать страницы можно сразу в конструкторе из реальных блоков и слайдеров, с переменными цветами, правилами шрифтов, мобильными версиями и пр. То есть аналогичная простота, но на одно звено в пайплайне создания меньше — на превращение рисованного макета в вёрстку. То есть можно сразу всё кликать, реализовывать гипотезы, легко переделывать, и будут видны все проблемы на реальной странице. А когда всё устраивает, то перейти к украшательству. Посмотрите тут: https://podhod.ru/elementor

По красоте с Framer в Elementor сложно тягаться, в нём меньше направленность на анимацию и WOW-эффект. Но повторить это можно, ведь многое решается анимациями при скролле, они есть. Например, моя визитка, собрана за 3 дня:
https://podhod.com/vladimir/
Выбирая Фреймер это замыкает сайт на её неразвитую CMS и малое число платных расширений.

Но главное в WordPress с Elementor и Crocoblock — скорость работы и практичность. Опыт показывает, что сайты на этом стеке быстро уходят в релиз, долго живут, причины сменить их на другой движок не возникают.

Очень важно что новые люди WP легко осваивают. В WordPress есть роли — права редактора, не позволяют менять вёрстку сайта, испортить её, редактор может только править текст в подготовленных дизайнером-разработчиком местах и публиковать. Если дать пользователю права автора, он не сможет опубликовать, сможет только готовить черновики, которые проверит редактор. Есть плагин User Role Editor для создания дополнительных ролей, в котором можно создать любую нужную комбинацию прав.

Важно, что Google и Yandex заточены анализировать страницы на Вордпресс, а на непопулярные CMS нет. На сайте сделанном на фреймворке надо специально заниматься SEO кодом. А для сайта на WP есть несколько мощных бесплатных плагинов для помощи с SEO, которые помогают заполнить и автоматически решают все задачи видимости в поисковиках, это:

• Yoast SEO
• All in One SEO
• RankMath
• SEOPress — сейчас предпочитаю его, за отсутствие лишнего и детализацию в нужном.

И всё это касается любых сайтов: визитки, лендинги, каталоги, блоги, СМИ, объявления, интернет-магазины, бронирование, дашборды личных кабинетов. Посмотрите эти демо-сайты. Приобретя Crocoblock их можно установить к себе за минуту. У каждого в основе JetEngine: https://crocoblock.com/dynamic-templates/?ref=507

Случайно обнаружил замечательный движок PuzzleScript и за вечер сделал ремейк своей игры-головоломки, которую делал давным-давно.

Поиграйте:
https://www.puzzlescript.net/play.html?p=82a11696801f5375f3fb383867c20848

Если интересно разобраться — под плеером с игрой ссылка на редактор кода этой игры.

Оригинальная игра называется Vampire’s Gold Logic Puzzle, в ней 100 уровней, вот ссылка:
https://play.google.com/store/apps/details?id=ru.podhod.vampire.

Буду рад, если вы поиграете в мою игру!

Сегодня нет никакого смысла с нуля создавать стили для типовых интерфейсов, кроме случая когда это является самим предметом вашей работы. В Figma в полном доступе есть сотни готовых решений. В каждую дизайн систему UI вложено сотни часов труда, и лучше сперва потратить свои несколько часов на изучение готовых решений, в поисках подходящего, чем окунаться с головой в создание своего.

Если вы про дизайн-системы ничего не знаете — начните изучение вопроса с этих библиотек дизайнов интерфейсов доступных в Фигме или просто используйте их:

Bootstrap 5 https://www.figma.com/community/file/1044316192441037087

United UI https://www.figma.com/community/file/1020079203222518115

Tailwind CSS UI https://www.figma.com/community/file/768809027799962739

Medusa UI https://www.figma.com/community/file/1278648465968635936

Align UI https://www.figma.com/file/PJ630SzPS3x2D807GYKHOk/

Для оформления веб-страниц часто нужна тень. В CSS есть тень, которую назвали почему-то «box-shadow», которая создаёт тень как от плоского прямоугольника, которая выглядит как его размытая исходная форма, а, не как ожидается из названия, как тень от коробки (box).

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

И, соответственно, стоило бы назвать такие тени по их объёмности: тень, которая создается от плоского прямоугольника назвать «rectangle-shadow», а тень которая имитирует выдавливание прямоугольного параллелепипеда — «box-shadow».

Опубликовал на сайте студии «Разумный подход» рассказ про ФУД-систему Лукино. Автоматизация учёта обработки заказов на кухне интернет-магазина.
https://podhod.ru/portfolio/lukino-kitchen

Давно сделал.
Если это не продуктовый дизайн, то что.