Верстка landing + parallax на open source cms
Необходимо сверстать резиновый landing, с эффектом parallax scrolling и натянуть на какой-то бесплатный cms.
Адаптивность и кроссбраузерность под все браузеры обязательна, без ошибок и понятным кодом, так как есть большая вероятность изменения текста и названия тех же кнопок.
тз + jpeg привожу ниже
landing page с эффектом parallax scrolling
1)Heder (меню сайта)
a1) должно быть шесть кнопок меню
b1) последовательность кнопок (слева на право) : тарифы, о компании,новости,контакты, личный кабинет, подключение.
c1)при наведении курсором на любую из кнопок, она должна изменять цвет букв с белого на красный (кроме кнопки "подключение")
d1) при наведении курсором на кнопку "подключение", она должна изменять цвет букв с белого на черный
e1) при нажатии на кнопку в меню, должно происходить перенаправление вниз сайта, на соответствующий кнопке блок (раздел). кроме кнопки "личный кабинет"
f1) при нажатии на кнопку "контакты" или "подключение" должно происходить перенаправление вниз сайта, на блок (раздел) "обратная связь"
g1) при нажатии на кнопку "личный кабинет", будет происходить простой редирект на урл биллинга.
2) галерея для рекламы ( movingboxes)
a2) галерея должна показывать только большие рекламные изображения на весь блок (раздел), с активной кнопкой "подробнее" и так называемого меню самой галереи в виде точек (черные-желтые), в правом нижнем углу.
b2) галерея должна быть рассчитана на два-четыре баннера ( минимальное количество- 2, максимальное- 4)
c2) при нажатии на кнопку " подробнее" должен происходить переход на отдельную страницу, не относящуюся к структуре самой landing-page. На отдельной странице будет только описание акции и кнопка "домой" перенаправляющая обратно на landing-page
d2)независимо от количества рекламы (два или четыре баннера) она должна быть всегда зациклена по кругу и время показа одного баннера, не должно превышать 5сек
3) тарифы
a3) " тарифы для физических лиц" и "тарифы для юридических лиц и частного сектора" должны быть одним блоком с тремя активными кнопками "заказать"
b3) при нажатии на кнопку "заказать" должно происходить перенаправление вниз сайта, на блок (раздел) "обратная связь"
4) о компании
a4) тут просто текст с пиктограммами, активных кнопок или ссылок в этом блоке нет
5)новости
a5) в блоке (разделе) должно быть три новостных блока, с жирными заголовками новостей, дата написания самой новости и под каждым заголовком внизу небольшое привью самой новости с активной кнопкой "читать далее"
b5) при нажатии на активную кнопку "читать далее" должно происходить перенаправление на отдельную страницу, не относящуюся к структуре landing page, с полным текстом самой новости и активной кнопкой "домой" перенапрвляющая обратно на landing page
c5) в этих трех новостных блоках, должны показываться всегда только последние три самые свежие новости компании. ссылки на архивные новости, будут внизу дублироваться на отдельных страницах, под той или иной новостью.
6) контакты она же форма обратной связи
a6) в этом блоке (разделе) должна присутствовать форма заполнения для обратной связи
b6) обязательные поля самой формы: (сверху в низ) Ваше имя, Ваш e-mail, Ваш номер телефона, желаемый тариф. справа от перечисленных полей, большое окно " Ваше сообщение"
c6)поле "желаемый тариф" должно быть выпадающим окном с четырьмя названиями наших тарифов.
d6) заявка должна отправляться на указанный email компании.
7) footer (подвал сайта)
a7) обычный текст с копирайтом + тремя активными пиктограммами социальных сетей
b7)активные пиктограммы социальных сетей: vk, twitter, facebook