Изображения и тексты для использования в дизайне только сделанные своими фотографом и копирайтером, на фото должна присутствовать эмблема сайта. Примеры https://www.gc-diamond.com/news/details/pressroom/novaya-vodka-valenki/
Повторяющиеся элементы на всех страницах сайта
Шапка сайта
Шапка сайта состоит из двух элементов, горизонтальной и вертикальной полос.
Первый элемент, горизонтальная полоса, содержит:
- сменный баннер с лозунгами компании. Можно перещелкивать вручную.
- иконка «Valenki silver» с их характеристикой
- иконка «Valenki gold» с их характеристикой
Второй элемент, вертикальная полоса, содержит:
- логотип компании
- вертикальное главное меню сайта
Шапка имеет вид:
2. Подвал сайта
Подвал сайта содержит:
- Столбец с указанием карты сайта, компании и ссылками на лицензию, правила пользования, контакты
- Обязательная надпись «чрезмерное употребление алкоголя вредит вашему здоровью»
- Мотивационное послание к присоединению в соцсетях. Иконки соцсетей: facebook, vk, google, twitter
- Кнопка поиска
- Информация где разработан сайт
Главная страница
Теги <title> Водка «Валенки» - www.valenkivodka.com </title>
Содержимое страницы
- Повторяющиеся элементы, такие как шапка, футер.
- Большой блок с меняющимися рекламными баннерами с возможностью перехода в соответствующие разделы. Иконки для перелистывания баннеров.
- Текстовое представление продукта.
Модульная сетка главной страницы
Вариант модульной сетки при ширине экрана 320 пикселей (мобильные телефоны портретная ориентация)
Вариант модульной сетки при ширине экрана 480 пикселей (мобильные телефоны альбомная ориентация)
Вариант модульной сетки при ширине экрана 600 пикселей (небольшие планшеты портретная ориентация)
Вариант модульной сетки при ширине экрана 800 пикселей (небольшие планшеты альбомная ориентация)
Вариант модульной сетки при ширине экрана 768 пикселей (планшеты уровня Apple IPad 2-3, mini портретная ориентация)
Вариант модульной сетки при ширине экрана 1024 пикселей (планшеты уровня Apple IPad 2-3, mini альбомная ориентация)
Вариант модульной сетки при ширине экрана 1280 пикселей (широкоформатные мониторы)
Вариант модульной сетки при ширине экрана 1600 пикселей (широкоформатные мониторы)
Страница «О продукте»
Теги <title> Водка «Валенки» - www.valenkivodka.com </title>
Содержимое страницы
- Повторяющиеся элементы, такие как шапка, футер.
- При переходе на страницу начинает проигрываться красочный анимационный фильм о продукте. Можно пропустить. По окончанию сворачивается в компактное окно.
- Текстовое представление продукта.
- Упоминание наград продукта.
Модульная сетка страницы О продукте
Вариант модульной сетки при ширине экрана 320 пикселей (мобильные телефоны портретная ориентация)
Вариант модульной сетки при ширине экрана 480 пикселей (мобильные телефоны альбомная ориентация)
Вариант модульной сетки при ширине экрана 600 пикселей (небольшие планшеты портретная ориентация)
Вариант модульной сетки при ширине экрана 800 пикселей (небольшие планшеты альбомная ориентация)
Вариант модульной сетки при ширине экрана 768 пикселей (планшеты уровня Apple IPad 2-3, mini портретная ориентация)
Вариант модульной сетки при ширине экрана 1024 пикселей (планшеты уровня Apple IPad 2-3, mini альбомная ориентация)
Вариант модульной сетки при ширине экрана 1280 пикселей (широкоформатные мониторы)
Вариант модульной сетки при ширине экрана 1600 пикселей (широкоформатные мониторы)
Страница «Производство»
Теги <title> Водка «Валенки» - www.valenkivodka.com </title>
Содержимое страницы
- Повторяющиеся элементы, такие как шапка, футер.
- Большой блок с описанием плюсов в производстве продукта.
- Ниже динамические иконки (меняются при наведение), отражающее основные этапы производства. Они же ссылки на подробное описание данного этапа (повторяют ссылки с основного меню в подкатегории «Производство»).
Модульная сетка страницы Производство
Вариант модульной сетки при ширине экрана 320 пикселей (мобильные телефоны портретная ориентация)
Вариант модульной сетки при ширине экрана 480 пикселей (мобильные телефоны альбомная ориентация)
Вариант модульной сетки при ширине экрана 600 пикселей (небольшие планшеты портретная ориентация)
Вариант модульной сетки при ширине экрана 800 пикселей (небольшие планшеты альбомная ориентация)
Вариант модульной сетки при ширине экрана 768 пикселей (планшеты уровня Apple IPad 2-3, mini портретная ориентация)
Вариант модульной сетки при ширине экрана 1024 пикселей (планшеты уровня Apple IPad 2-3, mini альбомная ориентация)
Вариант модульной сетки при ширине экрана 1280 пикселей (широкоформатные мониторы)
Вариант модульной сетки при ширине экрана 1600 пикселей (широкоформатные мониторы)
Страницы «Экологичность», «Технологичность», «Качество воды», «Контроль этапов»
Теги <title> Водка «Валенки» - www.valenkivodka.com </title>
Содержимое страницы
- Повторяющиеся элементы, такие как шапка, футер.
- Большой блок с анимацией, описывающий выбранный этап.
- На нем же динамические иконки (меняются при наведение), отражающее основные этапы производства. Они же ссылки на подробное описание данного этапа (повторяют ссылки с основного меню в подкатегории «Производство»).
- Текстовое описание одного из выбранных этапов (Экология, Технология, Качество, Контроль).
Модульная сетка страниц этапов производства
Вариант модульной сетки при ширине экрана 320 пикселей (мобильные телефоны портретная ориентация)
Вариант модульной сетки при ширине экрана 480 пикселей (мобильные телефоны альбомная ориентация)
Вариант модульной сетки при ширине экрана 600 пикселей (небольшие планшеты портретная ориентация)
Вариант модульной сетки при ширине экрана 800 пикселей (небольшие планшеты альбомная ориентация)
Вариант модульной сетки при ширине экрана 768 пикселей (планшеты уровня Apple IPad 2-3, mini портретная ориентация)
Вариант модульной сетки при ширине экрана 1024 пикселей (планшеты уровня Apple IPad 2-3, mini альбомная ориентация)
Вариант модульной сетки при ширине экрана 1280 пикселей (широкоформатные мониторы)
Вариант модульной сетки при ширине экрана 1600 пикселей (широкоформатные мониторы)
Страница «История валенок»
Теги <title> Водка «Валенки» - www.valenkivodka.com </title>
Содержимое страницы
- Повторяющиеся элементы, такие как шапка, футер.
- Страница в стиле Windows 8. Самый большой блок отражает один из выбранных более маленьких блоков про истории.
Модульная сетка страницы История валенок
Вариант модульной сетки при ширине экрана 320 пикселей (мобильные телефоны портретная ориентация)
Вариант модульной сетки при ширине экрана 480 пикселей (мобильные телефоны альбомная ориентация)
Вариант модульной сетки при ширине экрана 600 пикселей (небольшие планшеты портретная ориентация)
Вариант модульной сетки при ширине экрана 800 пикселей (небольшие планшеты альбомная ориентация)
Вариант модульной сетки при ширине экрана 768 пикселей (планшеты уровня Apple IPad 2-3, mini портретная ориентация)
Вариант модульной сетки при ширине экрана 1024 пикселей (планшеты уровня Apple IPad 2-3, mini альбомная ориентация)
Вариант модульной сетки при ширине экрана 1280 пикселей (широкоформатные мониторы)
Вариант модульной сетки при ширине экрана 1600 пикселей (широкоформатные мониторы)
Страница «Конкурсы»
Теги <title> Водка «Валенки» - www.valenkivodka.com </title>
Содержимое страницы
- Повторяющиеся элементы, такие как шапка, футер.
- В центре 3D страницы-флаеры с ярким дизайном и кратким описанием акций. Слева перелистываются уже закончившиеся акции, справа – действующие (в меню дублирующие ссылки).
- Текстовое более подробное описание выбранной акции/конкурска.
Модульная сетка страницы Конкурсы
Вариант модульной сетки при ширине экрана 320 пикселей (мобильные телефоны портретная ориентация)
Вариант модульной сетки при ширине экрана 480 пикселей (мобильные телефоны альбомная ориентация)
Вариант модульной сетки при ширине экрана 600 пикселей (небольшие планшеты портретная ориентация)
Вариант модульной сетки при ширине экрана 800 пикселей (небольшие планшеты альбомная ориентация)
Вариант модульной сетки при ширине экрана 768 пикселей (планшеты уровня Apple IPad 2-3, mini портретная ориентация)
Вариант модульной сетки при ширине экрана 1024 пикселей (планшеты уровня Apple IPad 2-3, mini альбомная ориентация)
Вариант модульной сетки при ширине экрана 1280 пикселей (широкоформатные мониторы)
Вариант модульной сетки при ширине экрана 1600 пикселей (широкоформатные мониторы)
Страница «Контакты»
Теги <title> Водка «Валенки» - www.valenkivodka.com </title>
Содержимое страницы
- Повторяющиеся элементы, такие как шапка, футер.
- Левее располагается карта проезда, ниже адрес, телефон и e-mail.
- Справа контактная форма от jotform.com (она же подписка на новости).
Модульная сетка страницы Контакты
Вариант модульной сетки при ширине экрана 320 пикселей (мобильные телефоны портретная ориентация)
Вариант модульной сетки при ширине экрана 480 пикселей (мобильные телефоны альбомная ориентация)
Вариант модульной сетки при ширине экрана 600 пикселей (небольшие планшеты портретная ориентация)
Вариант модульной сетки при ширине экрана 800 пикселей (небольшие планшеты альбомная ориентация)
Вариант модульной сетки при ширине экрана 768 пикселей (планшеты уровня Apple IPad 2-3, mini портретная ориентация)
Вариант модульной сетки при ширине экрана 1024 пикселей (планшеты уровня Apple IPad 2-3, mini альбомная ориентация)
Вариант модульной сетки при ширине экрана 1280 пикселей (широкоформатные мониторы)
Вариант модульной сетки при ширине экрана 1600 пикселей (широкоформатные мониторы)
Страница «Где купить»
Теги <title> Водка «Валенки» - www.valenkivodka.com </title>
Содержимое страницы
- Повторяющиеся элементы, такие как шапка, футер.
- В виде сетки перечисление всех мест, где можно приобрести рекламируемый продукт (фото места, название, краткое описание, адреса).
Модульная сетка страницы Где купить
Вариант модульной сетки при ширине экрана 320 пикселей (мобильные телефоны портретная ориентация)
Вариант модульной сетки при ширине экрана 480 пикселей (мобильные телефоны альбомная ориентация)
Вариант модульной сетки при ширине экрана 600 пикселей (небольшие планшеты портретная ориентация)
Вариант модульной сетки при ширине экрана 800 пикселей (небольшие планшеты альбомная ориентация)
Вариант модульной сетки при ширине экрана 768 пикселей (планшеты уровня Apple IPad 2-3, mini портретная ориентация)
Вариант модульной сетки при ширине экрана 1024 пикселей (планшеты уровня Apple IPad 2-3, mini альбомная ориентация)
Вариант модульной сетки при ширине экрана 1280 пикселей (широкоформатные мониторы)
Вариант модульной сетки при ширине экрана 1600 пикселей (широкоформатные мониторы)
Страница «ошибка 404»
Теги <title> Водка «Валенки» - www.valenkivodka.com </title>
Содержимое страницы
- Повторяющиеся элементы, такие как шапка, футер.
- Заставка «ошибка 404».
- Текст «Увы, но данной страницы не существует. Приносим свои извинения. Вы можете вернуться к просматриваемой странице ранее, нажав на эту кнопку».
- Иконка указывающая на кнопку возврата.
- Кнопка «Обратно»
Модульная сетка страницы ошибки 404
Вариант модульной сетки при ширине экрана 320 пикселей (мобильные телефоны портретная ориентация)
Вариант модульной сетки при ширине экрана 480 пикселей (мобильные телефоны альбомная ориентация)
Вариант модульной сетки при ширине экрана 600 пикселей (небольшие планшеты портретная ориентация)
Вариант модульной сетки при ширине экрана 800 пикселей (небольшие планшеты альбомная ориентация)
Вариант модульной сетки при ширине экрана 768 пикселей (планшеты уровня Apple IPad 2-3, mini портретная ориентация)
Вариант модульной сетки при ширине экрана 1024 пикселей (планшеты уровня Apple IPad 2-3, mini альбомная ориентация)
Вариант модульной сетки при ширине экрана 1280 пикселей (широкоформатные мониторы)
Вариант модульной сетки при ширине экрана 1600 пикселей (широкоформатные мониторы)
Страница «Карта сайта»
Теги <title> Водка «Валенки» - www.valenkivodka.com </title>
Содержимое страницы
- Повторяющиеся элементы, такие как шапка, футер.
- Блок, где перечислены все разделы, подразделы сайта (текстовое представление карты сайта).
Модульная сетка страницы Карта сайта
Вариант модульной сетки при ширине экрана 320 пикселей (мобильные телефоны портретная ориентация)
Вариант модульной сетки при ширине экрана 480 пикселей (мобильные телефоны альбомная ориентация)
Вариант модульной сетки при ширине экрана 600 пикселей (небольшие планшеты портретная ориентация)
Вариант модульной сетки при ширине экрана 800 пикселей (небольшие планшеты альбомная ориентация)
Вариант модульной сетки при ширине экрана 768 пикселей (планшеты уровня Apple IPad 2-3, mini портретная ориентация)
Вариант модульной сетки при ширине экрана 1024 пикселей (планшеты уровня Apple IPad 2-3, mini альбомная ориентация)
Вариант модульной сетки при ширине экрана 1280 пикселей (широкоформатные мониторы)
Вариант модульной сетки при ширине экрана 1600 пикселей (широкоформатные мониторы)
Страницы «Лицензия», «Правила пользования»
Теги <title> Водка «Валенки» - www.valenkivodka.com </title>
Содержимое страницы
- Информация по лицензии, по правилам пользованиям сайта.
Модульная сетка страниц Лицензия, Правила пользования
Заставка к сайту
Принцип работы
Пользователь должен подтвердить, что ему уже есть 18 лет, в противном случае доступ к сайту будет невозможен.
В соответствующих полях нужно указать месяц, число и год своего рождения. Есть чекбокс для запоминания этих данных и кнопка «готово». Внизу можно выбрать основной язык сайта.
После подтверждения о том, что пользователю есть 18 лет и более, открывается главная страница сайта.
Административная часть сайта
Теги <title> Водка «Валенки» - Админ </title>
Содержимое страницы
- Повторяющиеся элементы, такие как логотип, кнопка просмотра сайта, кнопка выхода, имя вошедшего пользователя, навигация по админке.
- Формы редактирования текстов, формы загрузки фото, слайдов, флаеров, иконок, видео.
- Формы добавления акций, мест продаж. Формы управления списками.
- Форма контактных данных. Формы данных сайта и смены пароля.
Модульная сетка административной страницы Главная
Модульная сетка административной страницы О продукте
Модульная сетка административной страницы История
Модульная сетка административной страницы Конкурсы
Модульная сетка административной страницы Контакты
Модульная сетка административной страницы Где купить
Модульная сетка административной страницы Настройка
