+7 (961) 211-15-51

Здравствуйте.

Представляю вашему вниманию дизайн—макет для вёрстки сайта «Teagrej». Если вы только начинаете верстать сайты, то этот макет будет полезен для тренировок в написании кода.

Это дизайн-макет сайта-визитки компании, изготавливающей и продающей чай. В макете присутствует десять страниц: главная; наша история; наша коллекция; страница отдельного товара; страница мероприятий; страница отдельного мероприятия; контакты; отзывы; страница 404 и политика конфиденциальности. Каждая страница в двух вариантах компьютерная и мобильная версия.

Надеюсь этот макет поможет вам отточить навыки вёрстки сайтов — приятной работы.

Дизайн макет для вёрстки сайта — Teagrej

Что было сделано

На первом этапе разработана карта лендинга — продумана структура сайта и количество основных страниц.

Карта сайта — Teagrej

Далее разработан простой логотип.

Логотип — Teagrej Логотип — Teagrej

Далее разработан прототип (схема текстов и изображений) и на следующем этапе на основе прототипа отрисовывался дизайн всех страниц.

  • Изображение главной страницы (desctop)

    Изображение главной страницы — desctop версия
  • Изображение главной страницы (mobile)

    Изображение главной страницы — mobile версия
  • Изображение страницы — Наша история (desctop)

    Изображение страницы — Наша история
  • Изображение страницы — Наша история (mobile)

    Изображение страницы — Наша история
  • Изображение страницы — Наша коллекция (desctop)

    Изображение страницы — Наша коллекция
  • Изображение страницы — Наша коллекция (mobile)

    Изображение страницы — Наша коллекция
  • Изображение страницы товара (desctop)

    Изображение страницы товара
  • Изображение страницы товара (mobile)

    Изображение страницы товара
  • Изображение страницы — Мероприятия (desctop)

    Изображение страницы — Мероприятия
  • Изображение страницы — Мероприятия (mobile)

    Изображение страницы — Мероприятия
  • Изображение страницы — отдельного Мероприятия (desctop)

    Изображение страницы — отдельного Мероприятия
  • Изображение страницы — отдельного Мероприятия (mobile)

    Изображение страницы — отдельного Мероприятия
  • Изображение страницы — Контакты (desctop)

    Изображение страницы — Контакты
  • Изображение страницы — Контакты (mobile)

    Изображение страницы — Контакты
  • Изображение страницы — Отзывы (desctop)

    Изображение страницы — Отзывы
  • Изображение страницы — Отзывы (mobile)

    Изображение страницы — Отзывы
  • Изображение страницы политики конфиденциальности (компьютерная версия)

    Изображение страницы политики конфиденциальности
  • Изображение страницы политики конфиденциальности (мобильная версия)

    Изображение страницы политики конфиденциальности
  • Изображение страницы 404 (компьютерная версия)

    Изображение страницы 404
  • Изображение страницы 404 (мобильная версия)

    Изображение страницы 404

Скачать макет

Дизайн-макет распространяется по лицензии CC BY 3.0 — авторство в футере должно быть сохранено.

Скачать html-шаблон по этому дизайн-макету

Стоимость шаблона: бесплатный (CC BY 3.0).

Поделитесь статьёй в соц. сетях:

Вконтакте
linkedin
Одноклассники

Если нашли ошибку

Нашли ошибку в тексте? Выделите её мышкой и нажмите сочетание клавиш CTRL+ENTER. Я обязательно исправлю ее и вам будет приятнее читать мои тексты!

Раскрытие информации:

Эта страница может содержать внешние партнерские ссылки, если вы перейдёте по ним и решите приобрести указанный продукт я получу партнёрскую комиссию.

Мнения и идеи на этой странице принадлежат автору — я не получаю дополнительных бонусов за положительные отзывы, если вы захотите их оставить :).

Спасибо за заявку!

Заполните форму, нажмите отправить

и я свяжусь с Вами в ближайшее время

Закрыть