Форма прийому донорів

Потрібно зверстати сторінку на основі дизайну в Figma https://www.figma.com/design/ctUULCDdE4pCsqxnJjsVb3/7453_Zagorye_03?node-id=1-114&t=m0mzTt1D7SzLA4eq-0

На основі вже наявного шаблону дизайну сайту зробити верстку для фреймворка Laravel. Макет дизайну зроблений у Figma. Більш детально опишу вже в особистих повідомленнях.

Є воронка продаж для інтернет-магазину, яку ми хочемо повторити у себе Виглядає вона ось так Основний лендинг (товар, який основний у продажу, наприклад, сорочка) Потім сторінка чекауту (де людина вводить свої дані і вибирає, скільки, наприклад, сорочок вона хоче купити) Потім він йде далі по воронці, і йому пропонують допродаж 1 (шкарпетки) + потім допродаж 2 (труси) і фінал сторінка дякую Як це має працювати в плані переходу по сторінках і логіці, ви можете подивитися тут (потрібно дійти до кінця до сторінки дякую) https://3plus3.heroman.com.ua/standard/ У нас є приклади сторінок, які ми хочемо зробити у себе Тобто для нас по суті ми скопіюємо дизайн - верстатимемо - заповнюватимемо під наш товар Сторінки з допродажами будуть такі ж за дизайном і структурою, як на сайті, що скинув вище (труси) Вам заповнювати не треба буде сторінки інформацією, тільки зібрати скелет - щоб заявка правильно приходила Також придумувати структуру теж не потрібно для сторінок Від вас по суті Скопіювати і сверстати Налаштувати, щоб технічно правильно працювало Показати, як з цим працювати, щоб могли самі це робити Є 2 конструктори сайтів на приміті, з 1 плотно працюємо зараз і потрібно зрозуміти, чи можна на ньому таке розгорнути (але я читав в гпт, що можна)

Завдання Потрібно створити стильний адаптивний email-шаблон за наданим текстом і підготувати його для завантаження в сервіс email-розсилок. Що потрібно зробити Розробити дизайн email. Зверстати адаптивний HTML email. Вставити наданий текст. Підготувати блоки під зображення та іконки. Додати CTA-кнопки. Підготувати посилання з UTM-мітками. Зробити plain-text версію листа. Перевірити відображення в основних email-клієнтах. Підготувати фінальний файл для завантаження в сервіс розсилки. Вимоги до дизайну Потрібен чистий, сучасний, premium-style email. Лист має бути легко читабельним, не перевантаженим, з зрозумілою структурою, короткими текстовими блоками, візуальними акцентами та кількома CTA-кнопками. Технічні вимоги адаптивна HTML email-верстка; коректне відображення на desktop і mobile; table-based layout; ширина контейнера приблизно 600–700 px; inline CSS / email-compatible CSS; кнопки повинні бути HTML/CSS, не картинками; всі важливі дані повинні бути HTML-текстом; зображення повинні мати alt text; без JavaScript; без форм всередині email; коректна робота посилань; підготовка UTM-міток для CTA. Перевірка Потрібно перевірити відображення мінімум в: Gmail; Apple Mail; Outlook; мобільних email-клієнтах. На виході потрібно отримати Готовий HTML-файл email. Plain-text версію. Preview або скріншоти desktop/mobile. Інструкцію, де змінювати посилання, текст і зображення. Файл/версію, готову для завантаження в сервіс розсилки. В відповіді, будь ласка, прикладіть приклади HTML email-розсилок, які ви робили, і вкажіть, з якими сервісами розсилок працювали.

Потрібно максимально точно відтворити:– структуру сторінок; – розташування блоків; – сітку каталогу; – розміри елементів; – відступи; – типографіку; – кольори; – хедер і футер; – картки товарів – структуру меню; – категорії меню; - модальні вікна – адаптивну поведінку; – hover-, active- і mobile-стани. – сторінка з продуктами повина мати мікророзмітку для продуктів – Сторінки мають бути оптимізовані під рекомендації Google SEO1. Тип сайтуАдаптивний інтернет-магазин доставки суші.Основні версії:– desktop – від 1280 px; – tablet – 768–1279 px; – mobile – 320–767 px.2. НавігаціяГоловнаКатегоріїАкціїПро насДоставка та ОплатаКонтактиМенюКартка продуктуКошик товаруШаблон сторінкиБлок “Шаблон сторінки” повиннен містити:– хедер;– breadcrumb ;— стрілку “вгору”— Перемикач світлої та темної теми зі збереженням вибору користувача.— На фоні сторінки зробити водяний знак з логотипу— На фоні закріпити зображення китайських паличок з правого краю— Футер РезультатПередати:– Figma-макет desktop і mobile; – HTML-файли; – CSS; – JavaScript; – папку із заглушками; – адаптивну версію сторінки; – архів готового проєкту.Головна вимога – максимально точне відтворення структури, дизайну та поведінки сторінки example.com