Коллекция HTML шаблоны

Издатели каталогов, кураторы, розничные продавцы и визуальные бренды могут представлять сгруппированные товары, не перестраивая разделы страниц с нуля. Готовые HTML-макеты позволяют структурировать карточки коллекций, описания, изображения и вспомогательные разделы в адаптивном режиме.

Готовые HTML-шаблоны коллекций, которые можно экспортировать и редактировать

Магазин с сорока керамическими изделиями и архивом из нескольких сотен принтов сталкивается с одной и той же проблемой: десятый предмет должен выглядеть так же органично, как и первый. HTML-шаблоны коллекций — это готовые дизайны для каталогов, галерей или архивов, а HTML-тег указывает, куда в итоге будет помещен проект. Nicepage экспортирует его как статический сайт, поэтому визуально упорядоченная вами коллекция превращается в HTML, CSS и JavaScript, которые вы можете разместить или редактировать в коде.

Что включает экспортированная галерея

Экспорт осуществляется из приложений Nicepage и из онлайн-редактора, поэтому результат не зависит от того, в каком из них вы работали. Экспорт в папки и по FTP является частью приложений, что важно, если способ публикации уже определен. Руководство по экспорту HTML-сайтов описывает доступные режимы.

Экспортированный из Nicepage сайт-коллекция включает в себя:

  1. Разметку каждой созданной вами страницы, включая индекс коллекции;

  2. Таблицу стилей и скрипты, на которых основан дизайн;

  3. Изображения, используемые в качестве фона для фотографий товаров, страниц лукбуков и архивных сканов.

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

Ячейки сетки на узких экранах

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

Одни и те же несколько мест, как правило, требуют внимания, когда ширина уменьшается:

  1. Названия товаров длиннее, чем текст демонстрации, которые выталкивают карточку;

  2. Подписи, которые отклоняются от изображения, к которому они относятся;

  3. Галереи, в которых размещается больше столбцов, чем может вместить экран.

Макеты для товарных линий и художественных серий

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

Фотографии в коллекции редко имеют одинаковую форму, и это обычно определяет, выдержит ли шаблон замену. Фотографии товаров поставляются обрезанными до одного соотношения сторон; художественные работы и архивные сканы редко бывают такими. Самый быстрый тест — создать раздел, заполненный вашими собственными изображениями и названиями товаров, особенно таким, название которого вдвое длиннее, чем в демонстрационном разделе. Что бы ни делал дизайн в этом разделе, он будет делать это и в остальной части каталога.