Правка дизайна + верстка страницы с сайта-образца
Для участия присылайте пожалуйста ссылки на созданные вами аналогичные страницы, где вами делалась доработка дизайна плюс вёрстка.
Сделать всё вполне реально меньше чем за 1 день, т.к. дизайн почти весь берём с готового сайта. Оплата по факту выполнения.
Техническое задание
Задача: изменить некоторые элементы дизайна, добавить новые элементы (описаны ниже) и сверстать страницу подписки по образцу другого сайта с контентом и плавающей формой подписки.
Для выполнения задачи необходимо знание html, css, javascript и навыки работы в photoshop или аналогичном редакторе.
За основу берём сайт грандстартап : http://grandstartup.ru/
от грандстартапа берём верхнюю серую область (самый верх), серую рамку с цифрами, плавающую форму (переделываем цвета под наши) и футер (подвал)
Наши цвета — это цвета с этого сайта: http://serialstartup.ru/video-1/?setuser=1198
То есть серый, кирпично-красный как на шапке, черный с логотипа и темно-серый у некоторого текста.
Насчет фона с клетками вопрос открыт: нужно сделать два варианта - один с фоном клетками, второй без фона. Клетчатый фон приложен к задаче.
В самом верху будет кирпичного цвета шапка, которая приложена к задаче.
Под шапкой будет верхнее меню с мелкими иконками (иконки надо подобрать) на том сером фоне грандстартапа.
Меню это 4 кнопки с небольшими картинками - "Программа", "Отзывы", "О тренере", "Контакты".
Кнопки ведут на соответствующее место в тексте (просто прокручивают эту же страницу вниз)
Под меню идёт слоган «Как с нуля гарантированно создать свое дело и заработать в нем 300 000 рублей за 4 месяца"
Ниже должна быть большая форма подписки на всю ширину блока. Цвет большой формы должен быть в цветах нашего сайта, кирпичным, но другим оттенком чем шапка (чтобы не сливались). Большую форму сделайте пожалуйста красиво, с аккуратной красивой кнопкой. Задача страницы — собирать контакты людей, поэтому большая форма должна быть заметной, и привлекать внимание своим оформлением.
Ниже идёт серый блок с цифрами (как на грандстартапе) - там сделать следующие записи вместо установленных (должна быть возможность, пусть и в ручную, но менять эти цифры):
оставшиеся места: 023
ученики уже заработали: 7311800
городов: 19
Человек, заходя на страницу, получается должен видеть шапку, верхнее меню, слоган, форму подписки и блок с цифрами учеников и городов. Остальные данные появляются при прокрутке.
Под блоком с цифрами появляется плавающая форма как на сайте-образце, которая дублирует основную, но которая не должна быть видна, пока видна форма вверху страницы. Эта плавающая форма тоже должна быть в цветах нашего сайта. Код формы и скрипт можно взять с сайта-образца, но нужно немного переделать: если начинать страницу прокручивать, должна появиться та маленькая форма справа которая видна при прокрутке и висит на одном месте.
В форме есть таймер, и если он доходит до конца, то большая форма исчезает, а маленькая пишет, что время истекло.
Текст на обеих формах:
"Заполните форму и получите бесплатно:
- больше 6 новых видео
- 3 ключевых майндмепа
- 2 миникниги
- рабочую тетрадь
подарки от Юрия Строганова"
Соответственно в широкой форме текст в строку, чтобы занимала меньше в высоту, но пункты должны разделяться как-то. например, значками буллетов.
Поля формы: имя и email. Напись на кнопке "Получить сейчас"
Далее идёт текст страницы, который должен быть шириной не больше 600 пикселей и должен быть не по центру страницы, а слева, левая граница контента выровнена по левому краю шапки. Справа остаётся место для плавающей формы.
Заголовок: Программа (на этот заголовок должен ссылаться первый пункт меню в начале страницы)
и красиво оформленными булетами:
Как выбрать идею для бизнеса, которая точно сработает?
Как обеспечить продажи Вашей продукции?
Как сделать бесплатную рекламу?
Как почти бесплатно создать сайт?
Как написать бизнес-план?
Где найти деньги? Занять, или найти инвестора?
Что выбрать – ООО или ИП?
Отзывы (это пункт меню 2):
взять отсюда: http://ystroganov.ru/otziv/ (оформить так же)
Вставлять не все, а только следующие:
Игоря Глоткина
Евгения Святенко
Алексея Корзуна
Дмитрий Шапошник
Баир Жамсуев
Максим Сафронов
Следующий раздел:
О тренере
взять информацию отсюда http://100dollarov.ystroganov.ru/ (оформить можно так же). Страница большая, вам нужен кусок начиная с ЮРИЙ СТРОГАНОВ с круглым фото слева. Остальных авторов со страницы брать не нужно.
Раздел Контакты:
Если у вас возникли какие-то вопросы, вы можете задавать их здесь:
http://ystroganov.support-desk.ru
или позвонить по телефону
8 800 333 13 87
После этого должна быть ещё раз форма во всю ширину экрана как в начале. Узкая плавающая форма не должна залазить на широкую, а останавливаться около нее, ниже уже идти не нужно.
Оформление футера берём тоже с сайта-образца, но делаем аккуратней и ставим вместо той информации свою:
Copyright © 2013 Юрий Строганов. Тел. (800) 333-13-87, служба техподдержки (ссылка http://ystroganov.support-desk.ru), партнерская программа (ссылку попозже дадим)
ИП Строганов Юрий Леонидович. ОРГНИП 111333555000077. ИНН 778800000002.