天猫平台特性

作者:onhoo
点击数:

您现在的位置:暗号设计>>设计观点>>天猫店铺体验设计>>
发布时间:2013年06月20日

天猫用户和平台本身有一些自身特性,了解这些特性可以帮助我们更好的适应平台服务用户,下面从分辨率、网站优化角度介绍一下天猫平台特性

天猫用户和平台本身有一些自身特性,了解这些特性可以帮助我们更好的适应平台服务用户,下面从分辨率、网站优化角度介绍一下天猫平台特性

用户屏幕分辨率特点

目前天猫用户屏幕宽度占比如下:

从此我们可以看出:有80%以上的用户已使用1280px宽度以上的屏幕,

而对于我们目前店铺页面仍有许多以950px尺寸设计banner,可以考虑更大尺寸的banner设计,给宽屏用户更好的体验

再来看下目前用户的屏幕高度:

有大概40%的用户屏幕高度800px以内,可以把800px做为基屏线(店铺天猫头部占有130px高度),让重要的内容落在基屏以内保证用户可以在首屏看到

天猫店铺、详情页延迟加载特性及首屏大小:

目前我们对首屏以外的内容延迟加载(即用户滚动到相应的区域再去加载相应的内容)以保证用户首次打开页面的速度

但是如果我们首屏内容体积过大仍会影响用户的首次打开速度,建议首屏整体大小控制在2M以内

图片处理技巧:

为了让我们的内容更快的响应,对于图片可以做一些优化,下面简单介绍一些常用技巧:

1. 大图片的切割:

比如下面图片,在商品详情描述中,当用户浏览速度较慢时,必须等待整张图片完全加载完成才可显示,而在完成之前用户看到的是一片空白;

我们可以将图片尝试切割成上下2部分,让一张较大的图片,变成2张较小图片,这样小的图片可以提前反馈到用户,用户可以提前感知:

2. 设置图片为“连续”

这样的好处是图片加载过程中会逐行呈现,而不用等待图片完全加载再“统一”显示

3. photoshop 图片保存技巧:

储存为“web和设备所用格式”

对于色彩丰富的图片建议保存为JPEG格式,品质可控制在“60%~80%”之间,元数据字段选择“无”;

这样可以让图片大小更小,可以对比一下不同设置图片大小情况:

可见不同的保存方式对于图片大小影响很大,通过适当的方式优化图片,可以令我们用户更快的浏览到我们的内容