2019 年 35 个漂亮的电子商务网站，激发您的灵感
已发表: 2019-07-24设计博客或个人网站是一回事。 您仍然需要担心一般设计方面、可用性和网站功能，但不像设计电子商务网站时那样担心。
电子商务商店需要类似于真正的实体店。 这意味着一切都应该自然流动； 一切都应该易于访问和导航。 在过去的几年里，创建一个壮观的电子商务商店已经不再是一个问题。 在 Colorlib，我们广泛介绍了电子商务：WooCommerce 用户的最佳电子商务主题，以及使用 Bootstrap 构建的 WordPress 最佳电子商务主题的免费集合。 此外，还有一系列电子商务 PSD 模板可供您使用预先启发的设计自由地从头开始编写自己的设计。
虽然它本身非常重要，但只有高质量的产品照片并不能解决问题。 您需要确保浏览您商店的客户能够通过无缝的表单提交来完善和探索他们的制作选项，就像数字目录一样。 设计您的商店，使搜索栏永远不会隐藏并始终清晰显示； 人们喜欢寻找他们获得新想法的事物。 您还应该始终提及物品的可用性； 对于某些人来说，结帐并收到“缺货”消息可能会非常令人沮丧。
问问自己这样做的原因是什么，它会给设计带来什么好处。 不要忘记结合搜索引擎优化的良好做法。 我们可以继续讲几个小时，但今天，我们将概述一些来自流行电子商务商店的最鼓舞人心、精心设计和吸引人的网页设计。
马哈比斯
服从服装
Obey Clothing 系列成功地吸引了大量千禧一代的注意力，它们出现的时间大约在大多数人还年轻的时候。 自该系列成立以来，它已发展成为一个由创意艺术家和街头艺术爱好者组成的大规模运动，为滑板和朋克摇滚界服务。 OBEY 适合那些喜欢独特而热情地表达自己的人。 Obey 在线商店的设计并不复杂。 这是一种将产品置于消费者眼中并毫不费力地完成销售的简约方法。 对于物理 OBEY 地点，情况并非如此，这些地点往往更加活泼和时尚。 这里的黑白设计非常有效。 最后，在结帐页面中，您可以选择一些尺寸和颜色； 结帐按钮相当简单。
马球方吉奥
Polo Fangio 制作了一些非常恶心的 Polo 衫，都是为男士设计的！ Fangio 是另一个家庭品牌，服务于那些喜欢低成本但奢华的舒适和设计的人。 带有流畅导航集成的翻卡设计看起来有点烦人，但这只是因为没有多少在线商店使用它。 这家商店的所有东西都经过组织，以反映特定的方吉奥马球系列，产品页面被构建为每件衬衫的单独主页，让您可以在真实世界中体验它们在真实世界中的样子。 结帐按钮底部的每件衬衫也有许多剧照。 谁知道真正的黑暗设计可以这么好用。
法尔
欢迎来到法尔！ 一个英国设计和瑞士工程手表品牌，迎合那些喜欢手表经典感觉的自由创意人士。 Farer 手表价格合理，赢得了成千上万手表爱好者的赞赏。 他们的系列包括经典手表，对于拥有时尚氛围的人来说，这将是绝佳的礼物。
我们真正喜欢 Farer 的设计的地方在于，它的构建直接支持品牌信息。 一切都回到对手表代表什么的解释上，产品登陆页面在另一个层面上——非常详细地描述了特定的手表是关于什么的，手表所具有的规格的简明纲要，以及有关的关键信息运费和退货政策。 这就是产品登陆页面需要的样子，客户想知道当他们花费超过 500 美元时，他们实际上会得到某种形式的保护，以防不喜欢产品的外观。 他们还出售肩带，甚至对于肩带产品页面，所有内容都经过仔细概述，以支持客户购买产品的决定。
死亡愿望咖啡公司
Death Wish 咖啡被称为最强的咖啡品牌之一，但这些人因许多不同的原因而闻名。 他们的社区参与保证了未来许多年的成功。 他们甚至赢得了一场有奖比赛，保证了他们在超级碗期间的广告位。 自然地，为了让自己暴露在如此高的流量中，他们需要有一个可以处理业务的网站，而他们确实做到了！ 他们的设计理念很简单，制作了一个巨大的介绍性框架，展示了咖啡包装的样子，并直接让客户从他们降落的同一窗口购买； 天才！
以下容器谈论产品，具有非常简洁的描述，然后是一个巨大的滑块，概述了最佳客户评论。 当然，他们有一个导航菜单。 但它已隐藏在您在移动设备上看到的流行汉堡菜单下。 在这里可以清楚地看到，99% 的重点是在用户打开网站时直接销售产品。 这种策略可能有助于您的个人产品销售吗？
全鸟
Allbirds 起源于新西兰，这是一个以羊群而闻名的国家，这是 Allbirds 所有者开始用这种华丽的材料制作鞋子的关键灵感点。 许多年后，Allbirds 是一个全球品牌，提供一些地球上最舒适的鞋子！ Allbirds 以简约而自豪，他们选择在他们的产品上不使用太浮华的标志和品牌形象，而是让人们可以自由选择拥有一款能够真正成为鞋子的鞋子。
他们的在线商店有很多动画内容，这就是为什么我们想指出这种设计，以及您作为品牌产品的所有者如何通过使用演示动画和视频向您的客户解释您的产品成为自己品牌大使的内容。 哦，还有最重要的樱桃——如果您在 4 周内不满意，Allbirds 将为您全额退款。 优秀！
下一位
Robin 是智能手机设备的未来，它也使用 Frickin Android！ Robin 希望通过提供具有无限存储空间的全新革命性智能手机概念来改变手机领域！ 是的，你听到的是对的。 无限存储来自云服务与手机的深度集成。 这将直接将您现有的所有内容同步到这些云平台上，以帮助您实现近乎无限的存储能力。
他们的产品主页分为两个不同的容器。 第一个容器显示了电话，并添加了一些一般信息。 下一页提到了产品的价格，并提供了操作系统的另一个预览。 虽然很简单，但所有其他重要的产品详细信息都列在一个单独的页面中，可以从菜单访问。 这是另一个很好的例子，说明单一产品品牌如何从将产品放在首位并将详细信息放在单独的页面中受益。 那些真正感兴趣的客户会找到一种方法来了解有关您的产品的更多信息。 但首先——让他们可以选择立即购买。
兔爸爸
兔爸爸专注于许多不同领域的产品，其中大部分是作为礼物。 厨房用品、婴儿用品、家居装饰品、浴室用品、教育产品、园艺工具、卧室和洗衣房，许多类别在未来都可以成为很棒的礼物。 兔子爸爸为这么多产品的设计仍然在很大程度上依赖于简单性，有一个很大的导航菜单，可以精确定位所有主要类别及其子类别。 多才多艺的排版将“兔爸爸”网站的优雅联系在一起，产品页面具有丰富的视觉内容，文字内容将彻底谈论您购买的商品，对于经营大量产品的在线商店的人来说，这是另一个鼓舞人心的路标卖。
廷克手表
欢迎来到 Tinker Watches，该品牌可让您打造自己的手表。 那是多么令人兴奋啊！ 主页有一个巨大的内容滑块，上面有几张图片，展示了产品并概述了其最突出的功能。 但是，一旦您单击“构建手表”操作按钮，您就可以通过三个简单的步骤完成构建您自己的手表的过程； 证明了 JavaScript 在前端网页设计中的强大功能。 为新手表选择所有功能后，将出现一个产品描述页面，您可以在其中更改数量、查看手表外观并完成购买。 设计简单，但在让客户从单个网页构建自己的产品方面非常强大。
爱尔兰设计店
爱尔兰设计商店提供礼品、厨房、户外、珠宝和书籍相关产品。 就设计而言，他们的主要卖点是使用清晰的图像，以及易于导航的产品页面，其中显示了“添加到购物车”按钮并为颜色添加了额外的重量。 页脚不会脱离主页网格的其余部分，使所有内容看起来都像是在一张纸上绘制的，而且很可能确实如此。 从简单优雅的设计如何满足重视设计的精致品牌的需求中汲取灵感。
为用户体验而战
UX 和 UI（用户体验和用户界面）是每一个伟大设计的背后。 这两个关键字构成了所有网站的设计，并且使它们都正确对于您的在线业务的成功至关重要。 Fight for UX 销售与网页设计相关的海报，让您和您的设计师同事受到启发，继续创造伟大的事物。 所有 5 张海报在主页布局中都有自己独立的网格框，为每张海报命名，以及海报中将要展示的照片。 您可以单击 5 张海报中的任何一张跳转到产品页面，了解更多关于海报代表什么的信息，当然还有 - 如何购买。
我们希望加入 Fight for UX，因为它展示了美学设计如何在您销售您真正热衷的产品的情况下发挥良好作用。 右侧栏上的展开菜单只有几个简单的选择，再次为简单化提供了空间。
状态音频耳机
Status Audio 诞生于一项研究，该研究得出了专业耳机的外观、感觉和外观，以便为喜欢在耳机后随身携带音乐的一代音乐爱好者提供服务。 耳机市场也是一个很难打入的市场，Beats by Dre 等流行品牌在该行业运营。 很难告诉客户您的产品比其他人似乎评论的要好。
这家初创公司成功打造了世界一流的耳机，世界各地的音乐家已经开始钦佩，他们对简单设计的信念也体现在他们的网站设计上。 你点击你想要的东西，它会带你完成最终销售的过程。 一些漂亮的添加可能是销售页面中的自动产品图像滑块。 此外，滚动到产品页面的第一个元素下方，您可以更详细地了解耳机、它们的技术方面以及包括视频评论在内的客户评论。 反馈是电子商务设计的一个重要方面，这些人已经把它归结为一门关于如何让客户反馈成为设计一部分的科学。
LilGadgets 耳机
LilGadgets 专注于儿童耳机，他们的设计与我们在之前的商店中看到的一样出色。 也许多一点颜色，但话又说回来 - 缺乏审查系统是显而易见的。 弥补这一点的是对每种耳机型号的更详细描述，以及它们将如何帮助您的孩子获得最美妙的音乐体验。 是时候激励您的孩子成为自己的小艺术家了！
肥皂公司
您如何使销售肥皂的品牌以其产品脱颖而出？ 你绝对不想设计一个会抛出大图像和其他耸人听闻的功能的设计，你想在顾客来到你的商店时立即列出产品，在这种情况下可以看到。 您打开 Soap Co. 商店，首先看到的是实际产品，因此是购物的时候了。 这些设计通常是在拥有产品的情况下构建的，但也有一个简洁的营销策略，可以吸引已经有点熟悉该品牌的客户，并且只需要一种快速的方法来补充他们用完的肥皂订阅. 我们一直推荐最小的设计。
Yeezy 供应
由 Kanye West 设计的 Yeezy's 是世界上最负盛名的鞋履系列之一。 获得一双新的 Yeezy 鞋将花费你一分钱。 除非，你真的很幸运在鞋子出来时在商店里买到鞋子。 拿到一双真的很难，而且看起来这个过程不会很快变得更简单。 该网站负责少量销售，但Yeezy的大部分都是直接在实体店销售。
Yeezy 网站是一个简单的标志，上面写着 YEEZY，左角有一个小导航图标，点击后会展开 5 个单独的链接：男士、女士、电影、Kanye 的主页和条款。 这里的两个重要链接是Men和Women，它们是产品的实际收藏链接。 单击其中一个将在非常黑暗的背景上展开产品线，Kanye 似乎非常喜欢这种颜色。 即使要预览产品信息，您也必须单击单独的按钮，这可能是 UX 缺陷，但很可能是因为 Yeezy 品牌在现实世界中的运作方式。
事物产业
当两位可爱的设计师走到一起并决定是时候建造一些独特的东西来回馈世界时，Thing Industries 就诞生了； 一些独特的东西属于以下物品：香蕉枕头、小熊地毯、鸟舍书架、带有动物的奶酪板、祭祀椅、章鱼钩、室内凳子、砖层毯子，以及其他一些很酷的创意物品！ 他们从一开始就坚持自己的原始创造力。 打开任何产品的任何页面，您将获得一张精美的封面照片，了解您所购买的产品，以及一个易于浏览的购买过程。
在菜单项列表中，您会找到：主页链接、商店目录、关于他们的愿景、一个单独的新闻页面，用于展示任何重要的新闻报道（其中有很多）、联系我们页面、库存商和新闻通讯客户可以订阅新产品更新。 这就是您经营小型创意品牌业务的方式。
Bootstrap 主题
我们非常清楚，我们希望包括一些与实际可用技术相关的在线商店，其中之一是 Bootstrap。 我们决定从框架的创建者那里预览官方 Bootstrap 主题“商店”的样子。 我们喜欢通过使用 if 图像、元素框和易于理解的描述来告诉客户整体产品是什么的简单方法。 它继续为样式创建的参与者预览实际的个人资料卡。 这使您可以更灵活地了解有关这些作者正在做的其他工作的更多信息。 这就是 GitHub 的美妙之处：能够探索其他人公开的工作！
软体动物冲浪店
软体动物是您对冲浪公司/品牌所期望的一切。 这些人来自当地有机资源，并不断参与艺术、手工艺、音乐、电影等创意领域。Mollusk 因创造了那种勾勒出冲浪者传统的全休闲风格的服装系列而享有盛誉爱穿。 他们宣传的冲浪板都是由当地的家伙建造的，所以钱不断地回到当地经济中。 他们的商店专注于两个重要方面； 左侧的导航菜单可让任何人探索类别及其子类别。 同时，图像目录显示所有项目。 单击任何产品，您可以看到它的全尺寸，并可以选择更改尺寸并立即购买。
Langly 相机包
到目前为止，Langly 很可能是我们电子商务设计灵感系列中最具体的品牌。 这些人专注于为那些喜欢徒步旅行的冒险人士生产相机包，并沿着危险和令人兴奋的路径拍摄那些令人惊叹的照片。 这些包旨在作为多合一工具以非常有效的方式携带您的相机装备。 有用于镜头、不同相机类型的插槽，以及用于放置任何其他单个相机装备的大量隔间，否则这些装备最终会变得杂乱无章。 价格非常合理，因为这是一种独特的产品，而且它本身就有很大的用途。
Langly 手袋的灵感来自自由摄影师和游牧专业人士的生活，他们寻求以时尚和轻松的方式保护他们的装备。 无论您是在执行任务还是执行任务，Langly 都能确保您的装备安全且贴近。 对于携带配件和必需品等类似物品，您可能无法携带所有物品，但您有足够的空间存放所需的一切。
黑色牛奶衣
Black Milk 背后的故事是真实的，从没有钱投资材料，到获得你能获得的东西并从中创造出独特的东西。 这是一条时尚系列，深受喜欢通过服装风格表达自由和自由思想精神的人的欢迎。 令人惊讶的是，一个由创意艺术家从头打造的时尚系列如何能够吸引完全相同的人群，因为他们有同样的感觉。
散景生活
请记住，一些品牌之所以选择经营在线商店，只是因为少数客户提出了要求，或者因为他们了解拥有在线商店的一些含义。 Bokeh Life 的网站很简单，它有四种样式的大写字母，可以使用 jQuery 导航进行导航。 单击帽子，会出现一个新模式，显示几个戴着帽子的模特，还有一个漂亮的购买按钮，可帮助您将这顶帽子直接运送到您家门口。 这个网页设计中的优雅风格是 Bokeh 融入他们的帽子的优雅的终极反映。
InVision 市场
InVision 被谈论了很多。 它是全球数百万设计师使用的设计工作流程工具！ 有些设计公司会推出自己的平台和商业页面版本，例如电子商务商店。 这让你想知道，接下来这些人会想出什么？
InVision Marketplace 是一家免费商店，粉丝可以在那里为自己购买衬衫以帮助推广品牌。 他们还可以充当品牌大使，告诉全世界您热爱设计。 T 恤当然不仅仅是 InVision； 该系列中实际上有一些非常出色和独特的衬衫。 作为一名设计师，您肯定会发现自己被其中的不少所吸引。 以市场为例。 它非常适合设计，从产品到结账是设计的无缝交互。
冒犯
Afends 了解良好的设计可以具有的镇静作用。 就像你需要让你的肩膀变得更有存在感一样，你需要一个通过视觉外观直接与客户交谈的设计； 与现实世界元素相结合的那种，使设计可以看到它的盛开。 我们也喜欢 Afends 如何使用其网站底部的 Instagram 小部件来显示使用其服装的人的最新 Instagram 帖子。
Lunet 眼镜
如果您经营的品牌拥有许多人已经知道的产品，那么制作一个可以快速销售产品的网站会容易得多。 这就是 Lunet Eyewear 所走的道路； 他们的在线电子商务商店由一个简单的导航标题和一个产品展示位置组成，为您提供清晰的产品信息以及如何购买。 他们还使用 jQuery 通知弹出窗口告诉欧洲客户他们在欧洲提供免费送货服务。 正是像这样的小部件对网站的用户体验产生了很大的影响。
花园
花园编辑重新划定了与购物和花园相关的传统界限。 他们通过汇集体现功能性、永恒性和美感的现代产品系列来做到这一点。 约翰的根源可以追溯到伦敦，那里的风格和热情受到高度赞赏。 他已经将自己的园艺技能变成了一项成熟的业务。 伦敦地区的任何人都可以订购约翰准备的一束鲜花，以及他非凡的园艺技巧。 他还出售园艺工具，所有这些工具都非常现代，适合创意园丁的空间。 显然，在一个页面上列出数百种产品实际上是非常有益的——五颜六色的产品展示让客户保持参与，谁知道他接下来会渴望什么。
生态蜂
Ecobee 出售带有传感器的家庭套件，可以测量区域温度，以及在任何特定时刻房子里的人数。 他们的销售方法是黑白分明，尽可能多地提供有关产品的详细信息。 他们的主要销售页面回到主页。 在那里，他们使用 HTML5 来创建单独的元素框，以讨论产品最重要的功能。
22号自行车公司
在商店里卖自行车很容易，不是吗？ 你展示了这个东西，如果客户真的有兴趣购买专业的自行车件，他们可以试一试。 但是这个结果也可以在网站上实现，尽管不是整个“试乘”的事情。 22号有几款专业自行车出售。 他们的方法是为每辆自行车创建单独的主页并讨论它们的适当规格，同时也包括有关自行车的重要几何信息。 此外，购买过程涉及选择自行车的配置、尺寸和颜色偏好。
按
PRESS 是一家专业书籍和物品商店，专注于绝版和初版艺术、时尚、设计、工艺和反文化书籍、小型独立出版社出版的新书以及来自世界各地的独特文具产品。 它还与图书行业有着密切的联系，这使他们能够以高价出版令人惊叹的产品。 旗舰产品包括摄影、艺术、时尚、工艺品、设计和书籍本身。
斯诺
搬进新房子？ 您可能想要储备一些独特的餐具和眼镜，让您的客人感觉他们已经走进了独特的体验。 但是品牌如何在网络上销售这些东西呢？ 第一步是使用良好的视觉展示内容，在所有可能的情况下展示产品。 这就是斯诺的方法。 除此之外，他们所有的产品卖点仍然是传统的：描述、产品细节和用例。
W+K Studio Goodness
Goodness 专注于可穿戴设备（衬衫）、礼品卡和普通贺卡。 所有的设计都是手工制作的，并提供非常独特的设计体验。 您可以单独选择产品并查看它们的特写图像； 如果它真的对你说话，只需从产品页面本身完成销售。 W+K Studio 还允许“快速购物”选项直接跳转到结帐页面。
巴塔哥尼亚规定
在线销售食品需要承诺。 有这么多讨厌的品牌出售蹩脚食品，需要一套特殊的工具才能将您的有机产品卖给那些能欣赏它的人。 从表面上看，巴塔哥尼亚已经很好地解决了所有问题。 他们以一种向您保证它们不含人工成分的方式谈论他们的产品和成分，并且与它们来时一样有机。 提供大量图片、视频和说明。 他们谈论他们从哪里采购这些东西，以及生产过程。 这些是客户在网上购买美味有机食品时想知道的事情。
Wocket 智能钱包
欢迎使用 Wocket Wallet，您可以放入口袋的最智能钱包！ 他们使用网站上的第一个标题空间通过背景视频来宣传钱包，该视频显示不同的人直接在购物体验中使用它。 然后，当您向下滚动主页时，所有其他元素开始添加。 您实际上将看到进行购买的每个步骤以及购买钱包后如何重新创建相同的体验。 您分享的产品详细信息越多，客户对购买的兴趣就越大。 Wocket 智能钱包也是现代技术如何带您获得惊人体验的绝佳设计示例； 它可以使您看起来好像已经拥有该产品。
360飞
360 度全景相机的发展势头强劲。 顶级 YouTube 博主和品牌正在使用 360 度为他们的品牌体验添加特殊元素； 360fly 可能是您最终在自己的营销工作中使用的工具。 他们的设计是另一个例子，说明用令人惊叹的视觉内容和易于掌握的描述来谈论紧迫的产品点是多么重要。 此外，页面的页脚已专门用于产品的完整技术规格； 另一个可以融入您自己的电子商务设计的好元素。
一本书分开
当然......如果所有其他方法都失败了，那么你可以来看看A Book Apart。 它是讨论网页设计和一般创意设计的书籍的著名资源。 A Book Apart 在他们谈论他们的产品的同一页面内开设了一家直接的在线商店。 令人愉悦的设计，如果不是为了你自己，书籍会满足你的设计感官。 为您的设计师团队获取这些。 因为他们需要所有这些知识来复制我们在本综述中经历的一些令人着迷的设计。
电子商务设计灵感
我们真的全力以赴。 一个地方的鼓舞人心的设计数量是前所未有的。 我们的重点是设计美学，以及通过网页设计谈论您的品牌或产品的能力，让用户感觉他正在成为更大事物的一部分。 嘿！ 电子商务店主，我们希望看到您自己的商店设计。 因此，请留下您自己鼓舞人心的设计的评论； 我们很想检查一下！