网站设计总结，（分享网站设计的6大策略）

最近一直在(zai)做一个app的(de)网站网站h5版，结合其中遇到的设计设计各种问题，踩的总结各种坑，做出了一些总结，分享希望大家以后能(neng)够顺利跳过这些坑。策略

一、网站网站功能的设计设计选择和取舍

首先，在做h5版的总结(jie)时候，你一定要明白自己想要什(shen)么，分享想要达到什么要的策(ce)略效果。结合自己的(de)网站网站时间成(cheng)本和人力成本，决定(ding)你应该保留什么功能，设计设计去掉什么功能。总结如果(guo)你觉得必(bi)需都(dou)得(de)有，分(fen)享不好意思，策略出门左拐，你不是我的目标用户。

再者，由于h5页面在手机中打开会存在诸多兼容(rong)性和稳定(ding)性问题，所以保证产品的流畅和轻便就显得更加重要。因此，必(bi)需(xu)想明白保留哪些内容，去掉哪些内容。从而既保证用户的使用效果，又(you)能达(da)到引流效果。

至(zhi)于如(ru)何选择功能，可以(yi)根据自身产品的定位，结合(he)kano模型，对你的功能进行分类，看(kan)哪些功能是满足必备型需求，哪些是满足期望型需求，而哪些是满足兴奋型需求。即使是h5版，满足兴奋型需求的功能还是需要优先考虑的，这个是你产品的核心点，是你的产品价值的体现。

二、缓存优化的问题。

这个算事(shi)一个易用性bug,之前的第一版由于没有考虑到这个问题(ti)，结果页面打开效果不是很理想。后来参考了一下目前市面上的h5,借鉴了以下的加载缓存优化策略：

点击某一个内容的(de)时候，内容进(jin)行加载，给出加(jia)载进度条，确保下级页面打(da)开的时候能够页面完整。图片可以是系统默认图。刷新和导航切换的时候给出加载效果（类似于微博的刷新效果(guo)）。

这样做(zuo)的优点主要有以下两点(dian)：

满足用户对于进程的感知。如果没有给出刷新加载动画，直(zhi)接给出结果，用户会感到不(bu)知所措。加载过的页面不致于出现大面积的错落等情况，给用户留下不好(hao)的体验。

三、触控反馈的(de)问题

触控反馈是让用户感知到产品依然是活的最好的方式。这个在很多细节上都是需要体现的(de)，例如在列表页点击的时候需要有点击效果，按钮需要有三种状态等(deng)。当然，这个是需要(yao)时间成本的。按照kano模型，这个(ge)就应该属于是期望型需求。在时间和人力陈本不允许的情况下可以适当(dang)放弃。

四、避免返回的坑

这里主要有两个问题：首先(xian)是在详情页触发登录操作的时候，如果采用原路返回的机制，则无法达到我们想要的返回到上(shang)一层级的(de)效果。

再者就是app分享出去的内容，用手(shou)机端打开,这个时候如果(guo)你点击返回的话，才用原路返回方式则(ze)打开的是浏览器首页，而我(wo)们想要(yao)的是能(neng)够返回上一级，让用户能在这个h5上多停留一会。当然，这个是有很多策略的，具体的可以参考第五条。

关于分享出(chu)去的页面(mian)主要关注的点是头部和尾部，中间肯定是内容。页面的头部目前来看主要有以(yi)下几种形式。

1、纯内容页分享

类似于网易新闻和(he)懂球帝，分享出去的内容仅仅是(shi)文章的正文，附带下载app的入口。

优势：简洁而统一

缺点：用户无法了解产品

2、加上全局导(dao)航

类似于人人都说产品经理分(fen)享出去的效果，加上一个全局导航。这样(yang)更加便于用户去了解产品。

优势：便于用户了解产品，增加用户停留时间

缺点：较为复(fu)杂

类似于腾讯手游宝，分享出去的页面和用户在原生上看到的效果是一致的，并且，点击返回，也和在原生种一样能够返回(hui)上一层级。

优点：便于用户理解

优点：同样便于用户理解，并且可以将用户带入到平台首页，增加内容的曝光量

5、隐藏头部

类似于兴趣部落，将原生的二级导(dao)航去掉，其它(ta)的点击效果和原生(sheng)一致。

优点：满足用户原先的操作(zuo)习惯

缺点：用户很难理解，实用性(xing)不强

6、原(yuan)页面，返回为原路径返回

缺点：无法讲用(yong)户引导到平台上，没能更好的(de)发挥h5的效能。

关(guan)于页面结尾，大致有以下几种形式(shi)

在文章尾部增(zeng)加相关内(nei)容。（这个可能是热门话题，也可能是首页推荐，每个平台想要展示的不一样，但本质都是将更多的内容曝光出来，从(cong)而增加用户的(de)停留时间。）没有任何修改，和原生中展(zhan)示效果一致。增加下载或者打开app的操作。

六、多(duo)看，多学，多尝试

原本以为h5版的设计应该不会有什么(me)问题，但是，在实际的设计(ji)过程中还是遇到了各(ge)种问题，还好目前市面上可以借鉴的产品较多(duo)。因此每次遇到问题的时候，都(dou)会看很多(duo)现有的h5版，学习和思考别人为什么这么做，有什么优缺点。