Оптимизация вёрстки действующего сайта-визитки на Bootstrap, добавление новых разделов и страниц, форм связи.
Цена фиксированная, желаемый срок - к началу следующей недели (до 9-10 го декабря). Работа под сейф, комиссию оплатим сами.
Если готовы сделать наперед с оплатой по Приват24 (Украина) - % сейфа и + 125 грн пойдет Вам в вознаграждение, в случае отсутствия критичных ошибок, сдачи в обещанный срок.
Взаимодействие будет происходить с маркетологом (мной), я штатный сотрудник этого бизнеса. Формирую белый список исполнителей, для будущих проектов - лендинги на автотематику, доработки и создание нового сайта на WP.
Ссылки на примеры и контакты есть в тексте тз (там дублируется нижеописанная информация c контактами)
https://docs.google.com/document/d/1cRJTH695rMJSB_dVxh6YnQQ2HLByRSUTnRQtyp7xSDU/edit?usp=sharing
Для оценки технического состояния, ссылку на скачивание сайта и макет, отправлю всем написавшим в личку\мессенджер, пишите срок выполнения в комментарии, сообщениях. Рассматриваю всех исполнителей с опытом от 2-5 макетов на Bootstrap
Макет будет отдаваться и выполняться параллельно, сделается за три дня - на сегодня есть мобильная\десктоп версия главной страницы, большая часть элементов переиспользуется на др. страницах. Ничего сложного в дизайне не будет, возможно к моменту старта - Вы уже получите полную картину и psd под каждый экран.
auto-marka.com.ua
Новые функциональные элементы с js
- форма обратной связи с компонентом Bootstrap DateTimePicker (запись клиентов с временем и календарем),
Всегда присутствует в статике перед футером и нажатие на кнопку в секции быстрого доступа ("Записаться на точное время" или "Быстрая запись" с кнопкой "Записаться") приводит к переходу к форме, скроллится до места якорной ссылкой.
Должна отправлять полученную информацию сообщением по почте
содержит "Имя", "Телефон", "Марка/Модель автомобиля", "Год выпуска",
+ поля из предложенного компонента:
"Желаемая дата", при клике выдающая календарь и
"Удобное время", при клике выдающий выбор часа и минут в 24х часовом формате.
+ атрибут или любой элемент в html с названием услуги, забираемый с кнопки и также отправляемый на почту, страницы будут клонироваться - менеджеру нужно понимать до звонка, по какой конкретной услуге обратился клиент
С минимальной валидацией на пустые поля (выводится предупреждение на отправку) и проверкой вводимого телефона на отсутствие символов и мин. длину.
пример: autoexpert.kh.ua/services/regylirovka-klapanov
- любая простая форма заявки на звонок по Вашему усмотрению, с минимальной валидацией на пустые поля (выводится предупреждение на отправку) и проверкой вводимого телефона на отсутствие символов и мин. длину, которая !обязательно! должна вызываться в необходимых разделах и страницах сайта без проблем и отправлять информацию сообщением по почте, отслеживаться ГуглАналитикой.
Содержит Имя - Номер телефона - Текст сообщения
Вызывается в модальном окне при нажатии на кнопку "Заказать звонок" в хедере, присутствует в секции с табами во вкладке "Остались?"
пример в конце страницы: autoexpert.kh.ua/services/regylirovka-klapanov
- секция с табами |"Преимущества"|"Акция"|"Остались вопросы?"|, на вкладке вопросов простая форма, описанная выше (телефон + имя + текст)
пример работы: xmotors.com.ua/services/promyvka-forsunok/#advantagesb851-d429
- секция с табами "Стоимость планового ТО"
включает три вкладки, расположенные слева "ТО - 15 000 КМ", "ТО - 60 000 КМ", "ТО - 105 000 КМ", переключающими прилегающую справа таблицу с заголовком "Цена", колонками описания услуги и стоимости
*** заполните по 6 строк текстом-рыбой и любыми цифрами
пример работы: elcars.ua/service/
- стандартный слайдер отзывы на странице "О нас"
- стандартный слайдер в секции "Наша специализация" на главной странице и в "О нас"
- стандартный слайдер-карусель для акционных баннеров и фото на главной странице, каждый слайд содержит текст УТП и кнопку, первый слайд - кнопка с линком на стр. "О нас", второй слайд - кнопка с линком на стр. "Бесплатная диагностика"
пример в библиотеке бутстрапа, дефолтной теме CMS Opencart, !ширина на всю длину экрана, за пределы контейнера
demo.opencart.com/
- стандартный слайдер для карточек "Популярные услуги" на главной странице
интерактивный пример на гл. странице: ps-auto.kh.ua/
- стандартный слайдер для фотографий на странице с конкретной услугой, как типичная карточка продукта в любом магазине
- стрелка "Вверх" - появляется на моб. версии, фиксированная при нажатии - скроллит страницу в начало, реализовать по возможности плагином или анкером.
*** можете использовать любой слайдер и свои заготовки, с которыми хорошо умеете работать, лишь бы не было проблем с адаптивностью
*** Существующие формы и лишнюю разметку, подключения не используемых скриптов и плагинов требуется удалить из разметки, т.к они не работают корректно: отправляются пустые данные, запускаются все через раз, если можете довести до ума - был использован formoid
Новые полноценные страницы:
Акции
О нас
Бесплатная диагностика (пример страницы с конкретной услугой)
Изменение существующих:
Главная
Услуги и цены (общая страница со списком всех возможных услуг, для перевода на каждую отдельно)
Запчасти
В целом главное меню состоит из пунктов: Главная | Услуги и цены | Запчасти | Акции | О нас
*** Удалить из проекта страницу контакты ( или переделать в "О нас")
Предыдущими исполнителями использована тема
* Mobirise v4 theme (mobirise.com/) -- точно не смог определить какая, возможно это поможет Вам выполнить задание
Согласовывания классов, переменных и прочего не требутся, главное - довести до работоспособного состояния
(Сохранить минимальное время загрузки, по возможности оптимизировать графику и скрипты. Если обладаете навыками, есть заготовки таск-менеджеров и сможете отдать не только компилируемые файлы стилей и скриптов).
По максимуму используйте существующие стили для верстки новых элементов, добивайтесь минимального объёма нового кода. Не перебивайте всю каскадность !important, грамотно используйте селекторы.
Адаптив фиксированный, проверяться будет на трёх брекпоинтах - мобильная версия, планшет и десктоп. Используйте flexbox, везде, где выходите за рамки логики css фреймворка и готовых компонентов. Учитывайте возможное переполнение текстом по высоте, возможность добавления нового блока услуги, пункта меню, где это требуется.
В качестве отправной точки берите представленные примеры конкурентов, где потребуется делайте скроллинг внутри блока (возможно потребуется на моб.версии, где не учтено макетом)
!!Используйте готовые компоненты Bootstrap - верстка с 0 не требуется. Где возникнут незначительные расхождения по внешнему виду: отступы и размеры секций дефолтные или на свое усмотрение, чтобы не резало взгляд и сохранялись пропорции. Описания и заголовки заполняйте текстом-рыбой, детали текста из макета будут меняться, заполнение правильным контентом на нас!
Навигация по подпунктам на моб. версии не требуется. (скрываются выпадающие списки, остается просто переход на стр. списка всех услуг). Меню как и раньше выпадает вертикальным списком поверх слайдера (не толкая контент! - добавить свойство)