电子商务网页中常见的网页元素
网页中的常见元素主要包括以下几种类型：文本、图象、动画、视频音乐、超链接、表格、表单和各类控件等。
电商首页包含哪些元素 电商首页布局
电商首页包含哪些元素 电商首页布局
一、文本：文字能准确地表达信息的内容和含义，且同样信息量的文本字节往往比图象小，比较适合大信息量的网站。
二、图像：在网页中使用GIF,JPEG(JPG),PNG三种图象格式，其中使用广泛的是GIF和JPEG两种格式。
说明：当用户使用所见即所得的网页设计软件在网页上添加其他非GIF,JPEG,或PNG格式的并保存时，这些软件通常会自动将少于8位颜色的转化为GIF格式，或将多于8位颜色的转化为JPEG.另外，JPG是静态图，GIF则可以是动态。
电商首页、详情页内容设计
入职至今的核心工作，基本是围绕网站页面优化展开，具体来说是网站的首页和商品详情页。在项目过程中，也进行了不同电商网站首页和详情页的内容设计探索调研，一点总结分享给大家。
根据马斯洛需求层次理论，人的需求可以按照生理需求、安全需求、需求、尊重需求、自我实现依次递进。生理需求泛指基本的生存需求，吃穿住行都可以归纳进来；安全需求指的是人身安全、健康保障、财产安全、工作等；到一级的自我实现，则已经上升到了精神的层次，带头作用、价值观、力等等，所以，电商可以满足这其中的哪些需求呢？
从广义角度来讲，一切可以在网络上进行交易的业务都可以归到电商的范畴，并且电商发展至今，模式形态已然非常丰富，包括o2o、新零售等概念在内，终的交易环节可能提前可能置后，可能在线上也可能在线下，但都离不开让商品更高效得触达用户。上述这些用户需求，或多或少都可以通过物质得到满足，无论是实物还是虚拟资产，因而可以说，电商的业务范畴可以涵盖用户所有层次的需求，或深或浅。举个例子，人们生存于世，需要一个能遮风避雨的住所，这个住所首先满足了人们的生理需求，能住；其次，如果这是一套安全设施完备的房子，甚至还能增值，则可以满足人们的安全需求，包括生理和财产；再进一步，如果这套房子是坐落于市中心的别墅，价值不菲，那么它在一定程度上也能体现主人的实力，可以满足一定的尊重需求；甚至因为这套房子价值太不菲了，已然成为了主人实力的象征，那么自我实现也可以通过这套房子有一定体现。针对这套房子，从找房到终交易，都可以通过电商实现。
所以，电商的业务范畴，可以涵盖人们有关物质，不论虚拟还是实物，所有的需求。
电商的业务范畴如此之广，详尽研究的话是一项浩大的工程。在这里笔者只就综合类电商（淘宝、京东等）、生活服务类（美团、大众点评、每日优鲜、京东到家、去哪儿等）、大宗商品类（链家、瓜子二手车等）进行展开讨论。
对于综合类电商，用户需求场景基本可以分为：
1、有明确的需求：朋友家的那款冰箱不错，我也想买；
2、有品类的需求：我想买冰箱、我想买海尔的冰箱（只要没具体到某一个商品）；
3、闲逛类需求：我就想逛逛；
综合类电商的商品概念等同于一个大型的购物商场，内容非常丰富。有的用户需求明确，有的用户想逛一逛碰碰眼缘，而用户决策的考量范围也比较广：合不合眼缘、品质如何、价格如何、评价如何、物流速度怎样···当然每种考量因素的权重根据不同商品会有所区别。
对于生活服务类电商，需求场景可能是：
1、有明确需求：昨天在朋友家吃的xxx不错，我也买点儿做一做；那款旅行产品的评价很好，我也想买一个体验一下；
2、有品类需求：我想买菜、我想去旅游；
生活服务类电商再细分下来，可以是快消类（生鲜蔬果等）和旅行团购类（旅行产品、团购服务等）。快消类区别于综合类电商的一个重要场景因素是，用户更注重交易的实效性，并且很多是基于地理位置的交易。你可以等一件衣服等3天，但不能等一斤午饭需要的蔬菜等3天，以及考虑到运费，显然家门口的店比另一个城区的店更合适。而旅行团购类商品，用户往往更看重评价。
对于大宗商品类电商，需求场景可能是：
1、有明确需求：我想买一辆不超过10万的奥迪a6、我想买一套一室一厅南北通透不超过100万的房子；
2、有品类需求：我想买一辆还不错的车、我想买一套还不错的房子；
大宗类商品涉及的交易金额一般比较大，各种手续相对复杂，用户往往更看重品质和服务。像房子、车子这种，网络上的和文字信息略显单薄，基本需要实地“验货”，当然，随着各种新技术如全景、3d、ar、vr逐渐发展成熟，让用户在网络上即可“身临其境”，并且能下购买决策，也不是不可能。
在上述这些需求分类里面，明确的需求和品类的需求，需要针对不同业务场景具体探讨，大致是根据用户选择条件的颗粒度来进行归类。而闲逛类需求，基本只会发生在综合类电商中，因为当人们来到具体到某一品类的电商形态中时，必然是已经有某种购买需求的。
用户行为路径的详尽分析，需要具体到每一种电商形态中具体探讨。整体而言，可以从新用户、需求明确、品类需求、闲逛需求来进行划分，具体如下：
根据用户的行为路径特点，可以得出电商首页、详情页的页面目标：
1、首页：确认用户目标位置，促进快速向下转化；没有目标时，创造目标；
2、详情页：确认用户对当前商品的意向值，促进决策；没有意向时，拓展意向；
首页需要完成流量的精准分发，针对当前用户的需求，至相应的下一级页面；详情页，则需要详尽且易读得展示当前商品的内容，促进用户完成决策。先具体说说首页内容设计，拿大宗二手商品举个例子吧，受品类等实际情况所限，能来到首页的用户，基本是有需求的用户，可是该用户想要什么呢？
分为两种情况，在用户需求比较明确的情况下，直接给一个搜索-筛选入口即可，当然结果的展示策略会比较复杂，需要考量用户行为、商品自身品质等，并且是按照sku维度还是按照spu维度进行展示，也是一个需要考虑清楚的问题。二手商品并非标品，貌似天然是sku维度，但是当一名用户想花10万元选一辆车时，是推一堆大众出来，还是将品牌聚合起来，展示出不同品牌呢？这里还涉及到用户路径深度的问题，电商都有一个漏斗原理，用户路径越长，流失率越高，怎样兼顾这几类因素，给到用户合理的展示策略，是需要分情况具体讨论的。
而对于需求不明确的用户，此时在展示策略方面，可能是热门的服务内容、品类标签展示，因为热门可能等于80%的用户需求；对于老用户，则是根据用户浏览、收藏等行为圈出来的服务、商品露出，这是定量的的触达。用户在首页找到下一级出口时，就需要一个包含更详尽内容的页面来承接，大概率是某一类商品的聚合页，甚至可能是商品详情页，总之是接得住入口指向的页面。
对于平台服务繁多的情况，比如阿里、京东等，业务内容十分丰富且复杂，大家都想占据一个有利的流量入口，那么怎样决定业务露出的优先级呢？基本是两条腿走路：用户偏好和战略推动。用户偏好即上述的根据用户行为计算出的展示策略；而战略推动，则是指公司重点推进的服务内容，这个不倚靠用户的选择，在推动业务时期，必然是强行推到用户面前的选择。
至于具体展现形式，如下图所示，内容虽然千千万，但核心就是尽可能贴合用户真实需求。
再来说说详情页的内容设计。电商的商品详情页是提袋转化的一环，是用户黄金购买流程中重要的页面，直接决定用户买不买这件商品（对于大宗商品，可能是肯不肯花时间去实地看），因此各家的商品详情页基本都是商品信息的堆积呈现，通过不同展示手段（、视频、图文等）展现商品，通过不同的排列组合手段，提高用户浏览效率，也会结合营销、服务内容，促进用户决策，还会提供流量出口，促进用户再看、多看。
对于页面具体的内容展示策略，这里就不展开讨论了，本质还是需要跟业务定位相结合，才能打造出真正贴合用户需求的产品。
首页作为流量分发的首要页面、详情页作为流量转化的一环，重要性自不必说。各家在研究首页、详情页应该怎样满足用户需求、业务需求时，需要根据公司战略和用户的显性、隐性需求进行系统化的适配，以此来取得平衡。像电商这种起家就是商业变现的产品，怎样平衡用户需求和业务需求也是一个被反复探讨的命题，好在随着技术的发展，这两者已经从相对对立转变成相辅相承了，前提是页面需要活起来，这个入口究竟加不加，你不知道我也不知道，但是用户知道，根据用户的行为反馈选择性展示，用户需要时就出现，不需要时硬怼也没有意义，不断的测试加数据分析，可以解决80%的争议。
emmm这段又扯到数据产品的话题了，还不太熟，暂且到此吧。
淘宝店铺装修首页的时候主要包含哪些模块？
网店店铺装修的时候，主要就是首页所有的设计，从你的店铺logo，店招，导航装修，海报设计，全屏，还有页面布局对各个装修模块都很重要，整体的色彩搭配，总之整个首页的装修都在店铺装修里，比如我找灵猫电商做的装修店铺，首页我就不用管了。
这个范围就看你了
一个自定义就包括所有你想做的
你想要做成什么样的就可以做成什么样的
还是看个人的产品
想要的风格
和你的要求
具体的可以找得到我来
给到你适合的建议和解决办法
电商首页怎么设计
电商首页怎么设计才能吸睛？看看上面这款电商首页的设计中是如何搭配的。我们先来看，这里用到的是白纸背景，我们可以把拖入里面，调整的尺寸，然后调整大小，调整到合适的距离，并且保持一个贯穿整个视觉的线性效果。再来看下，一步步推动我们视觉中心，使其成为一个贯穿整个页面的网格线。这里面可以有很多其他的设计元素。比如电商详情页的，主图和辅图的结合。这里面的有大有小，主图和辅图之间的结合，文案的大小和位置，以及下方的文字内容。还有一个图就是我们要做的功能，那就是对角呼应，也就是你看到的一个，左对我不知。
电商APP首页设计，终于有人讲明白了！
移动端产品设计的难点在于在很小的屏幕上展示所有的业务。屏幕限制和移动端的客户碎片化阅读的习惯和高流失率。对于业务复杂的App产品设计难度更高。电商产品就是典型的复杂业务产品之一，是要展示内容多、难做的一类App。
电商APP首页设计结构
电子商务网站的首页是网站的形象页面，一个网站能否吸引浏览者留在该站中漫游，全凭首页设计效果的好坏。所以，首页设计对于任何网站都是至关重要的。
首页从根本上说，就是全站内容的目录，也是一个索引。一般的电商app都有页头、页中和页尾这3 个设计区：
l 页头： 包括网站名称、搜索组件、焦点广告、导航等版块。
页头首先要体现网站主题。用企业名称、标语、徽号或图像概括地反映企业形象、经营理念和服务定位。搜索、导航提供了对关键页面的浏览链接，通过图标和文字表明产品其他页面载有的主要信息；用户能够在短时间、便捷的作迅速地到达他们所需信息的其他页面中。
l 页中： 包括公告、活动、个性化产品、友情链接等版块。
在首页上公告信息，到达率非常高。同时，产品中在进行的各种活动信息，也是吸引用户停留并购买的重要手段。随着互联网产品设逐步创新，数字化，原来千人一面的首页分类产品列表由简单罗列，变成了根据用户喜好和行为习惯进行个性化的商品，产品变得更了解用户也更能触发用户购买行业发生了。
l 页尾： 包括版权、联络方式、计数器等版块。
版权的常见做法是在首页底部标示简短的声明，再用链接附带一个有详细使用条款的说明页面，既避免首页的杂乱又把重要内容说清楚了。页面底部的，方便用户与产品相关人员取得联系，让产品所属企业获得用户反馈。
页尾的内容在web端界面设计中是不可缺少的区域，但在移动端首页基本都被移到了”设置”中进行展示，这是由于移动端界面空间实在太少，而且移动端多以手式向上不断滑动查看新内容，造成页尾信息如果放在页面尾端查看十分不方便。
首页设计组件介绍
一、搜索栏
大多数用户发生购买行为有明确的目的性。我知道我想要买什么，所以我需要快速的搜到商品。因此App把显眼的位置留给搜索栏。
一个完整的搜索组件设计应该由三个阶段组成：
1.找到搜索框
2.录入
3.搜索结果展示
搜索框的设计需要注意：
电商App的搜索框通常放在界面的上面，明显、惹眼，用户可以直接进入信息录入阶段。
电商App的首页搜索框，即使用户需要查找的内容属于不同类别，在设计上也给用户简单的全站内容搜索组件。
搜索框的设计风格应该和整体产品风格保持一致
信息录入的设计需要注意：
提供多种信息录入方式，常见的文字录入当然还是主流，除此之外可以提供语音、录入搜索等方式。
除了多样录入方式，还应配套提供信息录入提醒设计，如：用户历史搜索记录、搜索热榜、录入时联想响应
搜索结果的设计需要注意：
搜索结果设计重点在于展示不同类型和级别的内容。例如在淘宝搜索账单，结果包括账单相关信息，店铺和资讯等，不同应用加图标展示。不同内容类别以tab切换的形式展示。
搜索结果过多，可以加检索组件帮助用户在搜索结果中进行二次查找，减少花时间翻页或滑动查询。另外搜索结果为零的时的空页面，给用户设计合适的说明界面。
二、导航
电商App中，必不可少的两个导航：
l产品主导航
l商品分类导航
产品主导航
电商App中的主导航设计为用户提供了跳转相对的信息内容的路径。例如：
淘宝的主导航项：淘首页、逛逛、消息、购物车、我的淘宝
京东的主导航项：首页、分类、发现、购物车、我的
发现、消息、购物车、我的这些内容之间没有很强的关联，但又是用户在电商平台购物过程中必不可少要查看的信息。
京东、淘宝主导航
同时，从“商品买卖”的业务角度来看，有几个重要的业务信息，无论做任何电商产品，都应该让用户可以快速、方便的查找到是毋庸置疑的。它们是：
1.用户的购物车---购物车模块
2.用户在产品的中的个人信息---我的模块
3.用户买卖过程中的交流信息---消息模块
这些重要的业务信息，多数都放在了电商App的主导航中，即使没有放在主导航，也一定能够在首页的副导航中看到。
商品分类导航
不同类型的电商平台，商品分类导航有一些区别。
如下图中淘宝、京东平台，这两个平台是成熟的综合电商平台，在平台中不但有各类第三方商品销售，而且平台也有自营的品牌和应用在平台内销售，如淘宝的天猫商城、饿了么、天猫超市；京东的京东超市、就东到家等。
因此，商品分类导航中的商品分类覆盖十分广泛，尤其商品分类导航的C位往往加入了平台自营的品牌和应用。
垂直类的电商App，商品分类导航中的内容覆盖面窄很多，以商品类型分类用户查找商品的特点更明显示。
例如下图中唯品会的商品分类导航，因为唯品会的产品定位在折扣女士用品，所以导航中的分类都集中在服装、鞋帽、箱包等商品类别。
另外，在设计上不像主导航设计需要控制导航项数量，商品分类导航中的分类项数量往往大于5个，因此使用双排、可左右滑动的拖拽导航几乎成为常见的商品分类导航样式。
三、活动
电商产品中的活动类型很多，常见的有16种：
1. 打折
2. 秒杀
3. 免单
4. 满减
5. 满送
6. 满返
7. 买送/捆绑
8. 搭售
9. 包邮
10. 好评晒图
11. 试用
12. 抽奖
13. 积分/会员
14. 团购
15. 预售
16. 众筹
在电商App首页，见到多的是前两种活动：打折、秒杀。而且，首页的活动往往都带有极强的时效性表示，例如在规定的时间才可以享受更加优惠的商品价格。
因此，活动在首页上的设计要向用户传达三个要素，即用户关心的：
什么时间有活动
有什么活动商品
活动的价格有多优惠。
如下图的“京东秒杀”的设计就非常完整的呈现了这3个要素。当然，并不是所有的活动表达都一定要遵循这一规律，淘抢购的设计就打破了3要素传达的规则，隐去了商品促销价格。
京东秒杀与淘抢购
四、商品
个性化的商品现在在电商App设计中己经十分成熟，推存商业被用户接触到的地方就是首页。
用户在电商App或有意、或无意浏览的商品，都会被产品记录下来。再由商品模块根据你近的浏览记录，一些相关的商品、分享或者店铺。由于每个人关注的商品都不一样。所以产品对于每个人呈现的界面内容也都是不一样的。
例如下图，淘宝通过性别判断，如果产品发现你是男性用户，默认“男神范”；如果判断你是女性用户，则默认“爱逛街”。
淘宝内容
不仅仅如此，用来展示电商平台每个细分商品品类商品的区域，也都引入了个性化商品的设计。
在使用全品类商品展示+优惠价格来打动用户进行消费的同时，现在的电商App往往会再融合情感因素、参考用户的特点、喜好展示各品类中可能吸引用户的商品，促使用户在产品中“逛街、购物”。
例如京东精选中了全品类的商品，以用户行为进行时实的个性化。
案例：主流电商App首页分析
一、淘宝
首页内容：
1.搜索，淘宝把搜索二级页面直接展示在一级搜索位置下方，相当于搜索功能层级上升；
2.banner；
3.8个平台型导航，主要是从淘宝诞生，已经可以运营的产品；
4.活动广告位，占据banner大小的位置，平台活动快捷入口；
5.淘宝，根据分类滚动产品的文章；
6.二级购物功能区，展示各个频道，如天天特卖，每日好店。
7.商品列表，安卓和苹果展示不一样。安卓每个版块半屏往下铺开。苹果是上方做了分类导航，下方列表。
二、京东
首页内容：
1.搜索；
2.8个banner；
3.活动广告位；
4.平台型功能区，有部分是的应用如京东生鲜，还有部分是京东的商品类别频道；
5.京东快报；
6.二级购物频道，放了些主推的购物板块；
7.活动板块，铺开了活动的每个类别；
8.频道，把频道纳入到10个标签里，每个频道都有超过5个二级标签。
三、苏宁易购
首页内容：
1.搜索；
2.8个banner；
3.活动广告位；
4.平台型功能区，这一块主要是频道和分类，分类有16个。
5.苏宁；
6.二级购物频道；
7.活动板块，展开了活动的每个类别；
8.频道，展示很多二级频道，分的特别细。
四、小米有品
首页内容：
1.搜索；
2.活动板块，动画展示活动的交互很新颖；
3.平台型功能区， 5个功能频道，销售榜单作为一个功能很实用；
4.banner，共5张；
5.活动板块，分了各活动分类的专场；
6.特色频道，含榜单（把榜单部分商品展示出来）、限时购、年货节热卖、小米众筹、有货集市、品味生活，和功能区呼应，以商品展示为主；
7.类别频道，每个展示一屏，以商品展示为主。
五、严选（自营平台）
首页内容：
1.搜索和导航；
2.Banner；严选没有功能区，直接开始商品或者频道。
3.标签的商品，焦点位给了个性化，非常重视更精准得来个性化；
4.VIP会员的服务特权，重点突出了这一块；
5.二级功能频道，只放了三个频道；
6.猜你喜欢。
六、考拉（垂直综合平台）
首页内容：
1.搜索；
2.banner；
3.品类场馆，像商场的楼层一样，逻辑清晰；
4.活动板块；
5.特色频道，标签下面细分了很多相关的功能频道；
6.用户专享；
7.精选活动，以每个板块商品列表来展示；
8.个性化，以三个角度列表展示。个角度是个性化商品，第二个角度度是商品清单类文章；第三个角度是品质商品。
七、拼多多（综合平台）
首页内容：
1.Banner；
2.功能区，所有的平台频道和分类功能都在这里面了，有16个，偏重社交分享，如拼团；
3.活动板块；
4.商品列表展示，分商品和店铺两个角度商品，穿插了一排品牌馆。
手机端电商首页应该如何设计?
宝贝类 ①单列宝贝。单列宝贝的模块只能够使用一次，在使用中可以添加6个宝贝和链接。系统直接调取PC端宝贝主图，不能进行手动设置，模块使用的大小不受限制。
②双列宝贝。双列宝贝不受模块的使用限制，可以手动添加宝贝标题、链接、自动，也可以通过价格、、排序规则、类目来筛选宝贝。自动可以更合理地根据主推宝贝优先选择，系统直接调取PC端宝贝主图，不能进行手动设置。 ③宝贝排行。宝贝排行是自动调取PC端高销量、高人气的宝贝，不能进行手动设置。如果PC端热销宝贝较多，可以使用该模块来吸引买家，如果没有销量建议不要添加该模块。
图文类 ①标题模块。在标题模块可以设置20字以内的标题，也可以为该标题添加链接，,让用户点击该模块后，打开一个新的页面。一般来说店铺里首页大多数都是，我们可以使用标题模块来将产品图划分区域。
②文本模块。文本模块是所有模块中不能添加超链接的模块，利用文本模块可以对店铺进行介绍，相当于PC端的公告栏模块。模块中文案可以自由发挥。 ③单列。在单列模块中可以自定义产品，利用该模块能够展现出卖家所需产品图，也可以添加超链接，跟PC端首页的海报图有同等功效。
④双列。在双列模块中可以自定义产品，这是手机店铺不可缺少的模块这一，利用该模块可以做宝贝的分类、优惠券的领取等。 ⑤多图。多图模块多只能添加6张，少不能少于3张，而且不能使用超过两次。
⑥辅助线。辅助线主要用来提升两个模块之间的层次感，如果相邻两个模块的色调过于接近就可以使用辅助线来间隔。 ⑦焦点图模块。焦点图是手机端首页的重要模块，相当于PC端的首焦图。该模块放在手机端首页的屏，做得亮眼一些，能给买家留下深刻的印象。
营销互动类 ①电话。电话可输入手机号和座机号码，便于买家联系卖家。
②活动。活动不能进行手动设置，多可以添加一个活动信息，系统自动调取活动数据。 关于手机端电商首页应该如何设计，环球青藤小编就和您分享到这里了。如果您对页面排版、网站设计、图像处理等有浓厚的兴趣，希望这篇文章可以对您有所帮助。如果您还想了解更多关于平面设计的素材及技巧等内容，可以点击本站的其他文章进行学习。