• Сайт: madeinsmolensk.ru
• Регион: Смоленск
• Тип сайта: VIP-решения

Задача: нарисовать современный и красивый дизайн в соответствии с пожеланиями клиента, запрограммировать и заверстать его на сайте

Новостная часть сайта

Может показаться, что создание такого сайта — весьма тривиальная задача, не требующая больших усилий. Действительно, здесь нет каталога или функций интернет-магазина, никакой интеграции со сторонними сервисами.

Однако новостная часть задумывалась нестандартной. На сайте требовалось завести три типа записей.

• Новости. У каждой новости должны быть фотография, заголовок, дата, анонс и полный текст.
• Статьи. Как и в новостях, здесь нужны фотография, заголовок, дата, анонс и полный текст, но дополнительно — имя и фотография автора.
• События. Мероприятия могут длиться несколько дней, поэтому здесь уже выводятся две даты: начала и окончания. Неактивные события менее важны, поэтому их необходимо отделять графически.

Дизайн сайта

Для того чтобы сайтом хотелось пользоваться, он должен быть удобным и привлекательным. Наш арт-директор изучил интернет-ресурсы ряда российских и зарубежных СМИ и представил свое решение, которое отличалось от стандартной информационной сетки сайтов, разработанных на Canape CMS.

• Все новости были поданы с большими картинками, чтобы посетители могли удобнее ориентироваться и быстрее находить нужные новости
• Самый свежий материал сделан больше остальных, чтобы собрать больше просмотров, которые он заслуживает (это главная история на сайте в текущий момент)
• На внутренней странице новости мы ограничили ширину блока для удобочитаемости, потому что невозможно не сбиться с нужной строки, когда читаешь сайт, растянутый во всю ширину экрана. так делают абсолютно все СМИ
• Внизу на внутренней странице добавили отзывы, чтобы пользователь не уходил с сайта, а продолжал чтение. Так растет среднее время визита и лояльность аудитории
• В событиях применили цветовое кодирование, которое однозначно и максимально быстро позволяет понять, завершено ли мероприятие или на него еще открыта регистрация
• Добавили изображения авторов, чтобы пользователь почувствовал себя ближе к команде, наполняющей ресурс

Главная страница, десктоп

 

Список новостей, десктоп

Детальная страница новости, десктоп

Клиент утвердил дизайн сразу же, и мы приступили к реализации.

Особенности программирования нестандартного дизайна

1. Первая новость на главной странице крупнее остальных

Из-за этого нам пришлось запрограммировать дополнительный, более крупный, формат галереи в новостях (под большое фото). Возникшее пустое пространство справа мы заняли формой подписки на рассылку.

2. Каждый тип записей выглядит по-своему

Из-за того, что мы нарисовали каждую группу записей (новости, статьи, события) в уникальном стиле, а сам сайт был адаптивным, существенное время ушло на то, чтобы разнести эти записи на разные шаблоны, а потом заверстать каждый из них под все разрешения, включая планшеты и телефоны.

Кроме того, нам понадобилось программировать уникальные поля, такие как «фото пользователя» и даты начала-окончания.

3. События могут длиться несколько дней, быть активными и неактивными

Неактивные события мы решили выводить после активных и выделять серым цветом как наименее важные. Для этого нам пришлось предусмотреть все возможные комбинации дат в событиях, придумать систему сортировки по датам внутри активных записей и внутри неактивных, а затем по всем событиям сразу. 

4. Детальная страница с уникальным дизайном

Внутренняя страница записи сделана не в рамках основной сетки сайта, имеет другую ширину контента и две боковых колонки, содержимое которых отличается от содержимого остальных страниц сайта. Для этого пришлось запрограммировать отдельные шаблоны. Кроме того, внизу читателю предлагается еще две случайных записи из той же категории — новости, если мы читаем новость, и так далее. Для работы этой выборки программист написал ряд дополнительных запросов.

5. Правая колонка с выборкой последних записей.

Здесь программист вывел по две последних записи каждого типа, которые имели полный текст. На каждую можно кликнуть и перейти к прочтению. Сложность реализации заключалась в том, что у нас имелось несколько разных шаблонов, и потребовалось собирать информацию из них в единый блок.

Проект в цифрах

Количество разработчиков	8 человек
Потрачено времени	170 часов
Дней в разработке	57 дней
Оценка клиента	5/5

Отзыв клиента

Заложили отличный фундамент для создания полноценного СМИ, охватывающего деятельность предпринимателей Смоленской области. Работой довольны, на всех устройств сайт, независимо от размеров экрана, радует глаз. Никаких косяков, работает как надо!

Центр кластерного развития Смоленской области

Хотите заказать разработку сайта, продвижение или контекстную рекламу? Свяжитесь с нами по телефону: 8-800-200-94-60, доб. 321 или оставьте запрос на электронную почту az@web-canape.com.

Перейти на сайт