Верстка в HTML двух страниц сайта (главная и её мобильная версия)

Всем привет. 

Для передачи разработчикам необходимо сверстать две страницы (Html). Главная и мобильная версия главной.

Страница статичная. Две всплывахи - опросник и информационная (как это работает)

Пример главной страницы - во вложении.

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

Все кнопки, шрифты и тп предоставим отдельным файлом.

ТЗ:

Платформы: Windows, MacOs.

Браузеры: IE7-9, Chrome (15+), Firefox (15+), Opera (12+), Safari 5 – верстка полностью соответствует дизайну, скрипты работают в соответствии с ТЗ. В IE7-8, могут быть незначительные упрощения, скрипты, связанные с анимацией, могут работать в упрощенном виде.

Стандарты: HTML5/CSS3. HTML - должен проходить валидацию. CSS - обязательно.

HTML код:

• Кодировка – utf-8
• Структурный, комментируемый код (обозначается начало/конец крупных блоков). Отбивка табами.
• Семантическая разметка на уровне грамотного использования тегов.
• Имена классов и идентификаторов – осмысленные, на наше усмотрение.
• Классы служат для привязки оформления, идентификаторы – скриптов.

• Структурный, отбивка табами.
• Комментариями обозначены начало/конец крупных модулей/блоков разметки.
• Допускается использование вендорных префиксов.
• Стили для IE7-8 вынесены в отдельные CSS.
• Для IE7-8 для реализации не поддерживаемых CSS свойство допустимо использование Javascript и expression.

• Структурный, отбивка табами.
• Имена переменных осмысленные, на наше усмотрение.
• Снабжен комментариями: описаны назначения
  • методов/классов
  • функций
  • условий.
• Для объемных задач используется ООП, для простых – обычные функции.
• Код должен быть без ошибок.
• При использовании Ajax и не предоставления заказчиком api для взаимодействия с серверной частью, api делаем на свое усмотрение.

Имена файлов осмысленные, на наше усмотрение.

Проходят базовую оптимизацию на уровне оптимизации для Веб в Photoshop.

Малые изображения оформления объединенные по назначению и склеиваются в спрайты.

Файловая организация:

HTML файлы лежат в корне. Главная страница – index.html. Остальные – по именам макетов.

Стили в папке /css/

Javascript - /js/

Изображения оформления - /img/

Изображения содержания - /pic/