如何让我们的网站像手机一样简单

  目前,最流行的手机也就当属苹果4代了,为什么会这么火呢?用户体验,这也是苹果公司一直强调的工作重点并产品长久不衰的因素。那我们的网站呢?下面就以剖析手机界面元素和手机硬件、界面元素和软件要求之间的关系,寻找一下设计思路,我们的网站又该怎么做用户体验呢?

  1. 内容:指的是整个界面中包含的所有信息,界面上内容来源于流程图中限定每个界面完成的功能。内容受手机屏幕影响。a)屏幕:手机上每个界面显示的内容有限,最好每个界面完成单个任务,并保证用户能很流畅地操作,尽量避免字符输入。

  

  2.交互:具体表现在用户如何选择主功能,如何选择子功能,如何退出软件等等。交互设计就是在既定的内容框架下,根据用户的使用习惯去安排界面上内容的显示顺序、显示方式和界面操作方式(静态)。交互主要受手机操作方式和处理能力影响。a) 手机操作方式:触摸屏比物体按键操作更方便,例如触摸屏的手机选择某个功能时,只选点击该功能即可,而物理按键的手机需要按手机上下键,再按手机确认键。b)处理能力:手机处理能力强,软件运行的更快,软件和用户之间的信息交互就更快。

  

  3.色彩:指的界面上采用的色系及显示精度。界面色彩设计由主要受屏幕、软件大小和适配性影响。a)屏幕:屏幕的分辨率高,色彩区分更为明晰,细节更丰富,视觉效果更好。b)软件大小:软件大小有限制,例如JAR包必须在400K以下,界面设计就不能使用过多的图片,优先考虑程序自绘。现有界面设计主要采用图片横向填充,如使用2*25像素的图片,横向填充成240*25的背景图。c)适配性:为了保证软件的可适配性,界面设计尽量使用单向色彩渐变效果,如2*25的图片只有上下渐变效果。另外,参照手机QQ等软件和近期程序实现的情况上来看,设计上尽量少用圆角和半透明效果。

  

  4. 排版:指的是界面上的整体布局,包括图片和文字的大小,图片和文字在界面中的位置。界面排版主要受操作方式、屏幕和适配性影响。a)手机操作方式:触摸屏可以使界面设计更为灵活,不拘泥于现有的界面设计这样上下或者左右排版。b)屏幕:屏幕大,界面排版可以宽松些,比如标题栏可以大些。c)适配性:尽量避免使用滚动条,最好是界面上的内容一屏能完全显示,如主界面上的子功能控制在7个以内。

  

  5.动态效果:指界面切换的变化过程。动态效果受手机操作方式、处理能力和软件大小的影响。a)手机操作方式:多点触摸时,会增加动态效果。b)处理能力:手机处理能力强,可以增加复杂的动态效果。渐变效果要花费不少时间去编写,这部分设计和编程上都有点难度。c)软件大小:动态效果会增加程序负担,还有可能增加图片数目,势必增加软件大小。如果有动态效果,也要放在用户经常使用的界面上。

  

  综合以上论述,当主流手机操作方式改变时,界面的交互、界面排版和动态效果就可以相应地调整;软件的大小可以增加时,界面色彩和动态效果也可能相应的调整。那么我们的网站呢?请大家一起思考下我们的网站的设计是否适合苹果的产品一样简易操作呢?

  原文作者:羽翼seo团队成员--呆呆,原文地址:http://www.sem0571.com,欢迎大家拍砖,seo高级交流群54626945一起交流沟通!

时间: 2024-07-31 21:35:21

如何让我们的网站像手机一样简单的相关文章

js-我想让网站只能手机查看,电脑看不了,该怎么办?

问题描述 我想让网站只能手机查看,电脑看不了,该怎么办? 网页只想让手机查看,电脑看不了.用什么办法能解决. 最好是js. 解决方案 用js判断用户的ua,如果是电脑的,直接给出一个拒绝页面,如果是手机则可以正常跳转.注意,ua是可以模拟的,也就是说,用电脑多的用户是知道怎么去模拟一个手机的UA. 具体参考: http://www.hi-docs.com/article/detail-ODU=.html 解决方案二: 一个是判断user-agent字段,区分是手机还是pc.另一个就是根据ip判断

微信网站与手机网站在技术上有差别吗?

问题描述 微信网站与手机网站在技术上有差别吗? 感觉微信网站与手机网站的基本是一样的, 差别在于微信网站的入口是微信公众号,通过公众号的菜单进入网站. 而手机网站是网址或者一个图标进入. 但进入了网页后是一样的. 是这样的吗? 解决方案 显示一样,但是对js的支持有点小不同,如浏览器可以打开新窗口,微信不行..所以就没有opener对象之类的

c#-iis发布asp.net网站,手机使用流量输入公网域名无法访问,但是其他电脑可以

问题描述 iis发布asp.net网站,手机使用流量输入公网域名无法访问,但是其他电脑可以 win10搭建的iis,已做好了端口映射 1.如果手机和电脑都处在同一个路由器之下,那么是可以正常访问的,无论是输入公网地址还是我pc的内网地址.当然pc本身也是可以正常访问. 2.其他电脑输入公网地址也可以正常访问我的网站 3.但是手机使用流量却无法访问??? 求解?难道是手机运营商的问题吗?手机流量的网络和电脑又有什么区别吗?而为何百度这种网渣就可以正常的被手机使用流量访问到?是哪里的区别导致了这个结

现有网站转手机

问题描述 刚刚工作,技术不强,只会简单asp.net语句.公司给我一个已经运行很多年的web网站,让转成手机显示,可以自适应调整布局,我不知道从哪里入手.各位大侠能否给点建议,我应该从哪里入手进行修改,或者开始学习哪些技术? 解决方案 解决方案二:布局要重新弄吧解决方案三:网站转手机,通常有两种做法,你看看哪一种适合你.1.使用同样的后台数据库和业务逻辑,重新写支持手机的前台,单独发布一个网站.比如你原来的网站是abc.com,那么新的网站是m.abc.com.如果你的网站很陈旧了,不适合修改了

请帮忙推荐一个vb.net的在线学习课程、网站或手机APP,付费的也行

问题描述 请帮忙推荐一个vb.net的在线学习课程.网站或手机APP,付费的也行.主要是给自已充点电,基础入门类的最好.最好是有在线的指导老师,培训班形式的 解决方案 本帖最后由 jnzznj2 于 2016-03-30 14:47:54 编辑解决方案二:没有什么好介绍,不过我比较想知道是什么原因让你学VB,而不是C#?解决方案三:引用1楼君之飞云的回复: 没有什么好介绍,不过我比较想知道是什么原因让你学VB,而不是C#? 因为我对vba有点基础,想减少时间成本解决方案四:引用1楼君之飞云的回复

商务SNS网站与手机的结合将形成真正的“商务通”

随着网盛生意宝的"生意人脉圈"与阿里巴巴的"人脉通"相继推出,表明商务SNS应用迅速升温,得到更多人的重视,可以说是我最高兴的事情了! 一直以来SNS都很娱乐化,以至于引起了若干http://www.aliyun.com/zixun/aggregation/39402.html">社会问题,这些我认为都属于正常,因为任何新鲜事物的诞生都会有其正反两面性,也一定会引起一阵不小的热潮,但这都是短暂的.狂热过去后,确实应该冷静下来好好考虑如何把SNS商用化

教你给自己网站做一份简单的优化分析方案

随着现在互联网的发展,搜索引擎优化也越来越受广大人们的关注,不管是小型公司.大型企业还是个人娱乐网站都会去通过搜索引擎优化技术来获得排名.流量.人源.所以,当网站上线后或者已经有网站的站长们都希望自己网站能够做到以上这些,但很多新手站长站长都非常失望,自己不会分析网站的优化方案,对网站的发展和未来的前景一筹莫展,导致自己的网站排在竞争对手网站的后面.然而很多公司都是花钱找优化公司做网站优化方案,那么,今天笔者教大家给自己网站做一份简单的优化分析方案,这也是笔者把自己的经验写了出来,不能说帮助SE

网站优势就是在于简单实在

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断淘宝客 站长团购 云主机 技术大厅 网站做到极致就是简单.可用性与易浏览.百度,GOOGLE,只有一个输入框,在输入框里面输入不同的关键字,产生不同的效果和结果.其给网民体验的方式就是网民通过思想通过键盘输入所需要要查询的东西加上一个机械性的动作:点击按钮,就可以查询到你想要查询的资料与数据,极其简单的操作,无论网民电脑知识多低,操作有多笨,均可以很快适应和应心使用.这

牡丹江机场网站正式开通,该网站主题突出,链接简单、功能齐全

作为服务旅客和宣传机场的信息平台,该网站主题突出,链接简单.功能齐全,既能够为旅客.货主和航空公司提供便捷的资讯导航服务,又可以借助这一平台让外界了解机场的服务能力,向外界展示机场整体形象,提升机场的知名度和美誉度. 据介绍,牡丹江机场网站涵盖机场介绍.机场展示.航班时刻.航班即时动态.票务信息.乘机常识.合作商.客户留言.联系我们等9个板块的内容. 网站建设是一项需要长期持续改进的系统工程,牡丹江机场网站的建立和开通迈出了借助互联网拉近牡丹江机场与社会公众距离的第一步.机场可以通过这个平台展示