Адаптивная верска + немного программирование.

работаем над сайтом https://goodtoys.com.ua/ Он на вебасисте. Всё, что не описано с особенностей функционала, уже и так реализовано на сайте, и нужно это только прикрутить...

1) У нас адапт должен быть сделан под: чистая адаптивная верстка HTML5/CSS3 сайта без bootstrap.

валидный код

http://validator.w3.org

http://jigsaw.w3.org/css-validator 

Верстаем темплейт вебасиста. Работаем на поддомене, на копии сайта.

320/576/720/1024/1200(такой же, как на 1024 + по бокам фелый фон...)/1600 http://joxi.ru/12Mlj74Uzdw9mJ/ Если больше 1600, добавляем белый фон по бокам. Основной сайт под 1600.

По ховерам, для версий 1024+... для пк...:

2) Шапка. http://joxi.ru/gmvzg6OTPBMkma Ховер https://tympanus.net/Development/CreativeLinkEffects/ (5-й с низу в верх) http://joxi.ru/EA4jvn1UQZMbmb Меняет цвет и появляется подчеркивание при наведении, и если открыта эта страница.

3) Шапка. горизонтальное Меню. http://joxi.ru/xAe60NEUk6l7ry и правый левый угол http://joxi.ru/52aEYNys7ZxM20 "Регистрации" и "Личный кабинет", при наведении или нажатии (если перешли на эту страницу), появляется тот же ховер (подчеркивание), что и в предыдущем пункте. Только цвет не меняется.

4) Ховер на кнопки Купить (база белый, при наведении, салатовый), кнопка НАЙТИ (поиск, база зелёный, ховер при наведении салатовый), в фильтре, выбор пола ребёнка (база белый, при наведении и при нажатии, остается желтым) понравился вариант D  http://dbmast.ru/4-prostyh-hover-effekta-dlya-knopki-na-chistom-css 

5) Ховер стрелки на баннер понравился этот Circle Pop https://tympanus.net/Development/ArrowNavigationStyles/  https://tympanus.net/codrops/2014/05/28/arrow-navigation-styles/ Если у нас присутствует только 2 баннера, тогда стрелки не видны...

Сами баннеры... нужно реализовать в таком стиле: http://www.cjgammon.com/ Предусмотрена возможность в Админке редактировать и создавать таке баннера.

6) Всесь контент, на всех страница, появляется аяксом при скроле в низ, пример: http://rozetka.com.ua 

Таким образом мы ускоряем  скорость загрузки страницы. Сделать в точности так же.

7) В футере, и на странице товара, новые иконки социалок, с ховер эффектом http://joxi.ru/n2Yv5RBtvnMWA6 Проложу css файл и иконки. Только нужно его почистить от стороннего кода... В футере значки должны вести на эти группы социалок...

Футер. Модификация. Убираем эти социалки  http://joxi.ru/DrlRV7liwg4J2P , Ставим ссылки на эти категории http://joxi.ru/bmonV6dtP4Mxry (с продакшена)

8) Ховер для меню. Модификация. Используем этот ховер https://s-sd.ru/blog_studio_design/kak_sozdat_vertikalnoe_menyu_dlya_sajta_na_css/ Только не полностью... А только вторую часть: http://joxi.ru/Vm6l75zUa9daAZ

А именно, при наведении курсором, идёт подсветка, при нажатии, так же. Миниатюра категорий "выпригивает" с низу, и стаёт "на место". Подкатегории и ниже, присоединяются с права. Если вдруг мета на мониторе нет для нового выпадения меню с права, тогда подтягивает слева.

9) Для фильтра делаем соответствующие ховверы... Как и на товар (увеличения).. .расписывать нет надобности...

10) Сейчас доделывают иконки, дя преимуществ (на главной над меню и ниже категорий). Нужно соответвенно это всё вставить в сайт.

11) В карточке товара. иконки сейчас делают. Нужно сделать всплывающим попапом Доставка, Оптата, Гарании http://joxi.ru/12Mlj74UBPv9mJ 

Для верисий меньше 1024:

Никаких попабов (кроме увеличения изображения товара). Всё размещается на сайте. Но по прежнему, аяксом подтягивает всю информацию при скроле.

Функциональные доработки по движку:

1) В категориях, в админке, добавить место для мини-изображения, что будут выводится в меню http://joxi.ru/MAjZl7JHPlyWAe 

2) Отображения категоий. Для категорий 3-го и ниже уровня, выводим их в виде "фильтра", пример реализации: https://toys.com.ua/bolshie-kukly http://joxi.ru/E2pXgWLHPLLj2Y

Само левое меню "свернуто" Для меню используем плавный ховер.

3) Никаких циклических ссылок.

4) Через неделю, после совершения заказа через сайт, на эмейл должно прийти письмо с просьбой оставить отзыв о отваре. И само собой, переходим в товар, в раздел отзывов

5) в Админке предусмотрен выбор цвета... цвета товара... предусмотреть возможность вывода его под названием товара.

6) Акция... если мы выставляем, то идёт посекундный отчёт по времени. Структура: Дни/часы/минуты/секунды

7) Доработать возможность, проставления ссылки на другой товар http://joxi.ru/52aEYNys7o1920 Суть: Если у нас есть модель с уценкой, мы ее добавляем, и прописываем ссылку на тот товар. Система подтягивает и цену на него.

Это двухсторонняя ситуация, в которой на товаре с уценкой, идёт ссылка на нормальный товар пример: http://rozetka.com.ua/14790617/p14790617/ http://joxi.ru/D2PGQVESVPL7m3  

8) чпу. убрать из чпу /category/ , /product/ . сделать системные редиректы, как со старых уролов на новые, так и в БД поправить внутреннюю перелинковку (Если в товаре или категории с описания идёт ссылка на товар или категорию, и от туда убрать это).

9) Нужна зелёная зона на ПК и на моб версии https://developers.google.com/speed/pagespeed/insights/

Прорисованы все страницы. Нужно будет обсудить особенности адапта для категорий/товара и тд... Прикладываю основные страницы здесь.. а так.. ссылка на все страницы  в архиве здесь: https://yadi.sk/d/qMJi7SZD3FLNPH В целом... диз очень подробно прорисован... и все страницы показаны... расписывать полностью всё остальное.. .по опыту не стоит. Ибо всё, что изображено, всё должно сверстать и работать 🙂 Но можем обсудить все моменты, что вас волнуют. 

Что же, дамы и господа, ожидаю от вас формирование цены и сроков. И Ваше портфолио, важная часть принятия решения об исполнителе... Успехов!