Требуется сверстать и адаптировать одну страницу на платформе UMI CMS. Страница будет посвящена монтажу водяного теплого пола. Необходимо обеспечить полную адаптацию под ПК и мобильные устройства, оптимизировать страницу для рекламы и SEO. Работа включает интеграцию форм, установку якорей для метрики, минимизацию скриптов и улучшение скорости загрузки. Предоставляется макет в Figma, все тексты и материалы готовы.
Вёрстка сайта по шаблону
У нас нет исходника, а есть только:
- пример сайта (шаблон)
- и ТЗ на его "переделку"
ИСХОДНИК:
Наши цвета:
#373d95 - синий
#ee3b49 - красный
#727272 - серый
Шрифт:
avanti
ВОТ ТЗ НА ГЛАВНУЮ СТРАНИЦУ (потом по таким же тз делаем внутренние страницы):
АДАПТАЦИЯ
1. Шапка:
https://skr.sh/sDXnqb01pTA?a - исходник
https://skr.sh/sDXl893mysB?a - адаптация
кнопка "каталог":
https://skr.sh/sDXu3B0GUKr?a - работает аналогично, как в шаблоне, список разделов:
- ТСД
- Аксессуары
- ПО
- Новинки и акции
кнопка меню с подразделами, пример - кнопка "О компании":
https://skr.sh/sDXesiinvpR?a - работает аналогично, как в шаблоне, список разделов:
- Кейсы и отзывы
- Сертификаты
https://skr.sh/sDXzVeyIeoo?a - ховеры #373d95
https://skr.sh/sDXuYEJwDiJ?a - ховеры не нужны
https://skr.sh/sDXKtGKDBeS?a - при клике выводим поле для поиска
https://skr.sh/sDXFZ3T4Vc6?a - при клике выводим форму для заявки
Форма для заявки:
- поля: Имя, Телефон*, Email, Город, Сообщение
- чек-бокс и текст про политику (я ознакомлен с политикой конфиденциальности)
- кнопка "Отправить" в стиле сайта (скруглённые края, цвет #373d95, шрифт белый)
2. Слайдер и блок с акционными товарами
речь про него: https://skr.sh/sDY9w1sFj5j?a
что нужно поменять:
- упросить анимацию в главном слайдере
- кнопка останется одна: https://skr.sh/sDYfU1SKEqO?a
- https://skr.sh/sDYtuVbzmy6?a - вот эти баннеры я хочу сделать картинками
3. Карусель с товарами: https://skr.sh/sDYD45g79tH?a
- оставляем 3 вкладки: Терминалы сбора данных, Аксессуары, Програмное обеспечение
- убираем лишние элементы - рейтинг, избранное, сравнение
- цены прописываем в Руб. (ставим их после цены)
- заменем кнопку на "Подробнее": https://skr.sh/sDY4u5ci8hD?a
- и лично не мне понравилось, что в шаблоне управляюшие элементы в карусели видны тлько при наведении... https://skr.sh/sDYwSmVCPCy?a - может их сделать видимыми по умолчанию?
всего на сайте будет в типа стикеров:
- Акция (красный, #ee3b49)
- Новинка (синий, #373d95)
4. Блок с формой для перехвата
https://skr.sh/sDYkuMsD33c?a - блок, который в левой части содержит текст с заголовоком, а в правой такую же фому для вопросов, которую мы делали в модалке шапки
5. Информация о компании
Следующий блок мы берём со страницы: http://gluson.mallthemes.com/about-us/
https://skr.sh/sDYAj1eI5rm?a - вот этот блок переносим целиком, как есть
6. Следующий блок изображаю схематически, в вёртску его пока можно добавить, как 2 прямоугольника:
- слева будет баннер
- справа будет интерактивная карта
7. Блок "Партнёры" - пока о нём инфрации нет
концептуально это будет что-то вроде такого блока:
- наводим - появляется надпись
- кликаем - куда то переходим
8. Футер, почти всё оставляем, как есть
- https://skr.sh/sDYHDsWDrrp?a - избавляемся от этого блока
- https://skr.sh/sDYlUEvJK0U?a - упрощаем тут всё, до ссылки на политику
- https://skr.sh/sDYMX0lQiqw?a - фот этот фон меняем на светло-серый (#727272), чтобы тёмный логотип на нём нормально смотрелся
Заявки фрилансеров
Похожие заказы
- HTML-верстка3 заявкиЗакрыт3 года назад
Необходимо сверстать простой сайт на WordPress, состоящий из 6 страниц. Дизайн для главной и внутренних страниц предоставлен. Ожидаются предложения по стоимости и срокам выполнения.
HTML-верстка19 заявокЗакрыт3 года назадНеобходимо сверстать landing page на платформе Тильда по предоставленному макету из Photoshop. Ожидается качественная HTML-верстка с точным соблюдением дизайна.
HTML-верстка10 заявокЗакрыт3 года назадТребуется добавить мобильный адаптив для сайта с учетом макетов из Figma. Возможно, потребуется перенос на другую CMS. Заявки от посредников и без предварительной цены не рассматриваются.
HTML-верстка1 исполнительЗакрытнет датыТребуется сверстать многостраничный сайт-каталог услуг рекламно-производственной компании. Ориентировочно 8 разделов. Имеются бриф и дизайн-макеты всех страниц в Figma. В макетах размещены тексты и изображения для верстки. Портфолио похожих работ обязательно.
HTML-верстка41 заявкаЗакрыт3 года назад- $50
Требуется верстка 15 страниц с учетом предоставленных макетов для десктопной и адаптивной версий. Каждая страница имеет уникальные блоки, а также требуется несложная анимация. Идеально, если верстка будет интегрирована в существующий сайт на WordPress. Укажите стоимость за верстку и за верстку с интеграцией.
HTML-верстка45 заявокЗакрыт3 года назад Требуется разработка модуля OAuth 2.0 для DLE, который позволит пользователям авторизоваться на сайте через сторонние сервисы, аналогично авторизации через Google. Необходимо реализовать все функции, связанные с авторизацией, а также предоставить документацию по интеграции.
HTML-верстканет заявокЗакрыт3 года назад- $25
Ищется специалист с опытом верстки HTML-письма для рассылок. Требуется табличная верстка с использованием inline CSS, без классов. Полный адаптив не нужен. Письмо не сложное. Укажите ваш телеграм для отправки макета.
HTML-верстка1 исполнительЗавершен3 года назад Требуется сверстать небольшой лендинг для телеграмм канала по ставкам на основе макета из Figma. Задача включает HTML-верстку и адаптацию дизайна. Ожидаются предложения по стоимости выполнения.
HTML-верстка21 заявкаЗакрыт3 года назад