В 2007 году, сайт «Get Elasic» опубликовал интересную подборку кнопок «Положить в корзину» из различных интернет-магазинов, сопроводив это некоторым анализом надписей и внешнего вида кнопок. Я решил, что будет полезным освежить эту тему. Было собрано более двухсот кнопок «Положить в корзину», в том числе с сайтов самых популярных онлайновых продавцов.
![](https://habrastorage.org/r/w780q1/storage/d3c870e4/76835620/b451f292/02f9757b.jpg)
Кнопки «Положить в корзину»
Как вы вы видите на картинке выше, кнопки «Положить в корзину» бывают любых размеров, цветов, с самыми разными надписями. Давайте посмотрим какие тенденции можно выделить.
Для цветового выделения кнопок как правило используются следующие цвета: красный, синий, серый/черный, зеленый, оранжевый, розовый или желтый.
Серый (или черный) и красный — наиболее популярный выбор — доли примерно по 20%, затем следует зеленый и синий — по 15% с лишним. Независимо от цвета кнопок, надписи чаще всего делаются белым цветом.
Серый/Черный — 19,70%
Красный — 19,70%
Синий — 16,26%
Зеленый — 15,27%
Оранжевый — 11,33%
Другой — 6,90%
Розовый — 6,40%
Желтый — 4,43%
![](https://habrastorage.org/r/w780q1/storage/d32ce863/46ed51b6/6603c417/30ddea4f.jpg)
Цвета кнопок «Положить в корзину»
Все кнопки имеют прямоугольную форму, но если говорить о более тонких деталях, скругленные уголки побивают прямые в соревновании за популярность в соотношении 2:1.
Скругленные уголки — 63,41% (Rounded Corners)
Прямые уголки — 36,59% (Square Corners)
![](https://habrastorage.org/r/w780q1/storage/b45d58bd/88816863/68833c05/a8d94d54.jpg)
Стиль уголков у кнопок «Положить в корзину»
Взглянем на статистику по надписям. «Add To Cart» — бесспорный фаворит с долей в 56%. Следует сказать, что в коллекции в основном представлены сайты ориентированные на США, а вот в Британии «Add To Basket» будет гораздо популярнее, чему в штатах.
(От переводчика: Текст надписей не переводился, чтобы не вносить путаницу. Для русскоязычного интернета термины и цифры будут сильно отличаться.)
![](https://habrastorage.org/r/w780q1/storage/26bb3046/25d4912a/5768c422/dc73dbf8.jpg)
Текст на кнопках «Положить в корзину»
Когда речь заходит о регистре, в котором набран текст, то «все прописные» — оказываются наиболее популярными с долей в 53%.
Все прописные — 53% (ALL CAPS)
Смешанный тип — 39% (Mixed case)
Все строчные — 8% (lower case)
![](https://habrastorage.org/r/w780q1/storage/566bd226/7b50b45c/b36167ba/0760987a.jpg)
Регистр текста на кнопках «Положить в корзину»
Лагеря за и против пиктограмм разделены почти поровну, но кнопки без пиктограмм всё же чуть популярнее, чем кнопки с пиктограммами того или иного сорта.
Без пиктограммы — 52% (No Icon)
С пиктограммой — 48% (Icon)
![](https://habrastorage.org/r/w780q1/storage/0808e16c/624813e0/9948bf7f/8c517952.jpg)
Использование пиктограмм на кнопках «Положить в корзину»
В качестве пиктограммы наиболее популярно изображение магазинной тележки(40%), далее следуют разнообразные стрелочки.
Магазинная тележка — 40% (Shoping Cart)
Стрелка — 28% (Arrow)
Плюсик — 15% (Plus Symbol)
Сумка/Корзина — 14% (Bag/Basket)
Другое — 3% (Other)
![](https://habrastorage.org/r/w780q1/storage/9d58a523/830b583a/e4b678e3/23d3b976.jpg)
Типы пиктограмм на кнопках «Положить в корзину»
UPD от переводчика: В комментариях было указано на то, что не хватает картинки самой типичной, стандартной кнопки, соединяющей в себе самые популярные черты. Исправляю недостаток:
![](https://habrastorage.org/r/w1560/storage/1d95ebe8/b119e9c7/532c190c/a1074bbe.png)
Вот они — наши «мисс популярность»: красные, со скругленными уголками, с надписью «ADD TO CART» (все прописные) и без пиктограммы.
![](https://habrastorage.org/storage/d3c870e4/76835620/b451f292/02f9757b.jpg)
Кнопки «Положить в корзину»
Как вы вы видите на картинке выше, кнопки «Положить в корзину» бывают любых размеров, цветов, с самыми разными надписями. Давайте посмотрим какие тенденции можно выделить.
Цвета кнопок
Для цветового выделения кнопок как правило используются следующие цвета: красный, синий, серый/черный, зеленый, оранжевый, розовый или желтый.
Серый (или черный) и красный — наиболее популярный выбор — доли примерно по 20%, затем следует зеленый и синий — по 15% с лишним. Независимо от цвета кнопок, надписи чаще всего делаются белым цветом.
Серый/Черный — 19,70%
Красный — 19,70%
Синий — 16,26%
Зеленый — 15,27%
Оранжевый — 11,33%
Другой — 6,90%
Розовый — 6,40%
Желтый — 4,43%
![](https://habrastorage.org/storage/d32ce863/46ed51b6/6603c417/30ddea4f.jpg)
Цвета кнопок «Положить в корзину»
Форма кнопок
Все кнопки имеют прямоугольную форму, но если говорить о более тонких деталях, скругленные уголки побивают прямые в соревновании за популярность в соотношении 2:1.
Скругленные уголки — 63,41% (Rounded Corners)
Прямые уголки — 36,59% (Square Corners)
![](https://habrastorage.org/storage/b45d58bd/88816863/68833c05/a8d94d54.jpg)
Стиль уголков у кнопок «Положить в корзину»
Текст на кнопках
Взглянем на статистику по надписям. «Add To Cart» — бесспорный фаворит с долей в 56%. Следует сказать, что в коллекции в основном представлены сайты ориентированные на США, а вот в Британии «Add To Basket» будет гораздо популярнее, чему в штатах.
(От переводчика: Текст надписей не переводился, чтобы не вносить путаницу. Для русскоязычного интернета термины и цифры будут сильно отличаться.)
![](https://habrastorage.org/storage/26bb3046/25d4912a/5768c422/dc73dbf8.jpg)
Текст на кнопках «Положить в корзину»
Когда речь заходит о регистре, в котором набран текст, то «все прописные» — оказываются наиболее популярными с долей в 53%.
Все прописные — 53% (ALL CAPS)
Смешанный тип — 39% (Mixed case)
Все строчные — 8% (lower case)
![](https://habrastorage.org/storage/566bd226/7b50b45c/b36167ba/0760987a.jpg)
Регистр текста на кнопках «Положить в корзину»
Пиктограммы на кнопках
Лагеря за и против пиктограмм разделены почти поровну, но кнопки без пиктограмм всё же чуть популярнее, чем кнопки с пиктограммами того или иного сорта.
Без пиктограммы — 52% (No Icon)
С пиктограммой — 48% (Icon)
![](https://habrastorage.org/storage/0808e16c/624813e0/9948bf7f/8c517952.jpg)
Использование пиктограмм на кнопках «Положить в корзину»
В качестве пиктограммы наиболее популярно изображение магазинной тележки(40%), далее следуют разнообразные стрелочки.
Магазинная тележка — 40% (Shoping Cart)
Стрелка — 28% (Arrow)
Плюсик — 15% (Plus Symbol)
Сумка/Корзина — 14% (Bag/Basket)
Другое — 3% (Other)
![](https://habrastorage.org/storage/9d58a523/830b583a/e4b678e3/23d3b976.jpg)
Типы пиктограмм на кнопках «Положить в корзину»
UPD от переводчика: В комментариях было указано на то, что не хватает картинки самой типичной, стандартной кнопки, соединяющей в себе самые популярные черты. Исправляю недостаток:
![](https://habrastorage.org/storage/1d95ebe8/b119e9c7/532c190c/a1074bbe.png)
Вот они — наши «мисс популярность»: красные, со скругленными уголками, с надписью «ADD TO CART» (все прописные) и без пиктограммы.