Какие есть лучшие практики верстки изображения в карточке товара?
Работаю над темой woocommerce, в дальнейшем думаю о продаже темы.
Встал вопрос, как реализовать лучше карточку товара, а именно изображение в ней.
Либо сделать div с background в виде изображения товара, или сделать его картинкой img.
Как задать размеры изображения чтобы сетка не скакала?
Либо сделать допустим квадратное изображение, а пользователи будут самостоятельно кадрировать фото в фотошопе. (наверно сложно)
Нужен совет как реализовать это с точки зрения удобства и чтобы хорошо смотрелось.
над темой woocommerce, в дальнейшем думаю о продаже темы
смешно. А посмотреть реализацию тем на templatemonster или выбранной площадки для стартапа не судьба?
Froggyweb, не вижу ничего смешного, больше скажу есть маркетплейсы с темами.
Но под капот не взглянуть, может на уровне woo кадрируются хитро как то. Да и вообще услышать мнение тех кто сталкивался, практики разные есть.
ресайз картинок на бэке можно реализовать по разному в зависимости от фронта.
по умолчанию в WP это стандартные значения + full size
можно реализовать свой например от верхнего угла, или с помощью анализа изображения всякие там умные алгоритмы машинное обучение и пр.
Смешно - это про коммерческий успех темы при таких вопросах. Сорян
ЗЫ фото товара это точно контент и он должен присутствоватьт в поиске как это будет разруливаться дальше - вопрос разработчика
Используй элемент picture в него можно вставлять заранее подготовленные изображения под разные экраны. Так же есть замечательное свойство css object-fit: cover, оба варианта легко гуглятся с примерами использования.