Сайт хостинг-компании, дизайн + верстка

Хостинг-компании нужен новый сайт

Название компании - Дата-Хата

Текущий сайт - www.data-xata.com

Основной профиль - аренда интернет-серверов в европе

Основная фишка - легкость выбора среди сотен вариантов серверов и тарифных пакетов от европейских партнеров.

Примерный ескиз “на коленке” - во вложении.

Нужны страницы (дизайн, верстка, минимальный JS):

1) Главная

2) Страница заказа

3) Страница ошибки (404, 503 и тп)

4) Страница с сообщением а-ля “Заказ получен, спасибо!”, “Оплата не прошла” и т.п.

5) Страница на которой будет просто текст - статьи, описания и т.п.

Основные требования:

- контрастные цвета

- большой, легко читаемый шрифт

- нестандартные елементы форм (select, checkbox, radio button, …) в общем дизайне сайта

- работа в основных браузерах

- должен хорошо выглядеть на iphone/android

Хотелось бы получить стильный, современный, минималистичный и запоминающийся сайт

Предложите цену и сроки

Главная:

Хидер:

- Логотип (в разработке)

- Телефон (044) 23-88-946 + какой-то елемент, при нажатии на который показываются список телефонов других городов

- icq

- ссылка на skype

- ссылка на “личный кабинет”

- большая надпись “АРЕНДА СЕРВЕРА”

- ссылки “Как заказать?”, “Как оплатить?”, “Тех поддержка”

Тело:

- Баннер как сайте firstdedic.ru или ihc.ru - 5 слайдов: фоновая картинка + текст поверх нее

- Большие блоки с услугами как на сайте server.ua:

-- Все серверы

-- Горячие серверы

-- Серверы Hyper-V

-- Виртуальные серверы (VDS)

- Пять больших иконок с нашими преимуществами, под иконкой - название преимущества и трех-четырех строчное описание: аптайм, бекап, поддержка, безлимитный трафик, большой выбор

- Новости (будут импортироваться из твиттера):

-- Заголовок “Наши новости”

-- Три новости - дата, короткий текст

- Отзывы клиентов

-- два отзыва - лого клиента, имя, ссылка на сайт, три-четыре строчки отзыва

-- внизу 5-6 логотипов других клиентов

При нажатии на блок с услугами - “выезжает” основной контент (пример во вложении):

- фильтр

-- при выделении галочки - фильтруются соответствующие поля в таблице

-- при выделении галочки с локацией - фильтруется также список локаций, остаются только выделенные

список локаций с описанием их преумуществ

- таблица с серверами

Поля:

-- Локация - две строчки

-- Модель сервера - две строчки

-- Память - select с выбором возможных опций

-- Диск - select с выбором возможных опций

-- RAID - select с выбором возможных опций

-- Скорость

-- Трафик

-- Цена

-- Кнопка-ссылка “ЗАКАЗАТЬ”

В google docs есть таблица, из которой можно взять данные о серверах и апгрейдах

https://docs.google.com/spreadsheets/d/115ccBDX-W_AAUMxrUD5rl3gqo_pT2vBzGcckIRufrLo/edit?usp=sharing

в ней примеры конфигураций и возможные апгрейды памяти, дисков (для соответствующих select’ов). Первая строчка - название вкладки на которой перечислены апгрейды.

Футер:

- Телефон, е-мейл

- Онлайн чат zopim.com

- Значки Visa, mastercard, web money, paypal

Страница заказа.

Хидер и футер те же что на главной

Тело (эскиз во вложении):

Большая надпись “ОФОРМЛЕНИЕ ЗАКАЗА”

Поля заказа:

- локация

- модель

- память (select с вариантами апгрейда)

- диски (select с вариантами апгрейда)

- Рейд (select с вариантами апгрейда)

- Скорость

- Трафик

- Количество IP (select с вариантами апгрейда)

- Операционная система

- Панель управления

- Галочка IPMI/IP-KVM

Какой-то разделитель типа

- Выслать доступ на e-mail - большое поле для ввода е-мейла - обязательное поле, проверяем его перед отправкой формы

- Ссылка “Хочу указать больше данных о себе” - при нажатии:

появляются дополнительные поля - имя, компания, телефон

текст ссылки меняется на “Я передумал - не хочу указывать данные”, при нажатии на него - дополнительные поля сворачиваются

Какой-то разделитель типа

- radio button “срок предоплаты” - 1 мес, 3 мес, … в скобках пишем размер скидки в процентах, абонплату за 1 мес со скидкой, сумму к оплате за период

- radio button “способ оплаты” - Visa/MC, Webmoney, PayPal, безнал (при выборе безнала - открываем поля “Хочу указать больше данных о себе” и все поля там становятся обязательны для заполнения)

- текст “оформляя заказ вы соглашаетесь с правилами”

- кнопка “оплатить и получить доступ”

Варианты апгрейда, скидки - в файлике на google docs, ссылка выше.