刘俊潇张敏言
（西安工程大学，陕西西安710048）
【摘要】随着PC浏览器的发展日趋完善和市场竞争的增强，越来越多的浏览器希望能够占领市场，寻求新的机会。通过研究用户体验，以人为本，分析PC浏览器的交互界面以及布局，探讨不同浏览器的优势特色，总结提出了一些有利于PC浏览器发展的新交互原则和理论。
教育期刊网 http://www.jyqkw.com
关键词 用户体验；交互；布局结构
AnalysisoftheＣomputerＢrowserＩnterfaceＥxperience
LIUJun-xiaoZHANGMin-yan
（Xi’anPolytechnicUniversity，Xi’anShaanxi710048,China）
【Abstract】WiththegradualperfectionOfthePCbrowser’sdevelopmentandtheenhancementofthemarketcompetition,moreandmorebrowsersexpecttocapturethemarketandseekmorenewopportunities.Throughstudyingtheuserexperience,thispaperbearsthepeople-orientedprincipleandanalyzesinterfaceaswellaslayoutofthePCbrowsertodiscussthedistinguishedfeaturesandadvantagesamongdifferentbrowsers.Basedontheaboveanalysis,thispaperconcludessomenewinteractiveprinciplesandtheorieswhicharebeneficialtothePCbrowsersdevelopment.
【Keywords】Userexperience;Interaction;Layoutstructure
０引言
随着移动互联网的蓬勃发展，传统互联网的流量占比份额不断减少，但是在生产力以及工具化的层面，传统互联网依然有着不可替代的作用，然而，浏览器是PC端的流量入口，有着举足轻重的作用。它是互联网的一扇窗户，随着技术的不断提升。浏览器被赋予了更大的使命。从chrome带头，拥有自己的软件商店已经成为了新晋浏览器的标配，HTM5的发展和小插件对于浏览器的提升已经让浏览器不仅仅限于浏览，使得其更像一个平台。所以，探究PC端浏览器交互设计以及用户体验，分析优缺让浏览器的体验更上一层楼。
1浏览器现状以及用户体验
根据百度统计——流量研究院数据报告，从2014年1月1日到2015年2月28日之间的14个数据显示各个浏览器流量占比如下：IE48.63%、Chrome28.56%、搜狗高速4.76%、猎豹2.51%、QQ2.32%、23451.75%、其他11.47%。注：奇虎360浏览器份额在2010年10月至2011年3月，和2012年9月以来，两次大幅下降，是因为360浏览器去掉了原本的浏览器特征（User-Agent），而表现为IE等浏览器特征所致。其各大厂商对于浏览器的争夺越来越激烈，从浏览器界面分析其特点，提升用户体验，才能获得用户的认可。①
国际权威的人机交互专家Norman博士强调,一个完好开发的、有凝聚力的品,应该看上去美观,用起来舒心,使用户能愉悦地欣赏,快乐地使用,同时增强心灵和思想的感受。②
2浏览器的设计特征
2.1浏览器的操作方式
浏览器的操作方式大概分为鼠标操作和触摸操作，触摸操作必须有触摸屏的支持，但是由于大部分厂商并没有针对触摸屏进行浏览器的优化，所以我们这里主要以研究鼠标操作方式的浏览器为主。
2.2从交互设计的原则分析
2.2.1基于用户的心理模型而不是工程实现模型
把复杂的工程化的东西转换为易于理解的生活化的东西。
以上分别是Chrome、Firefox、Opera、QQ四款浏览器的标签页，可以看出，Chrome的标签是一个反向的小标签，可以让用户很容易的感知它就是新建标签页的按钮，而其他三款采用“+”图标，生动和美观性不及Chrome。
2.2.2更少的输入
在地址搜索栏或者搜索栏进行搜索时，如何最大限度的减少用户的输入，让浏览器变得更聪明，感知用户额需求。让用户只需要告知一点信息，结果变展现出来。如：用户搜索“搜狗”，当时用户是希望用搜狗搜索引擎去查找自己想找的东西。
上图分别为Chrome、Firefox、猎豹。其中只有Chrome告知用户其可以直接使用TAB键来用搜狗搜索引擎进行搜索。Firefox没有展示任何内容，Chrome和猎豹都分别展示了相关推荐，值得注意的是，Chrome的结果用户可以直接进入网站结果，直接跳过了搜索引擎界面。让用户更少的操作和思考。
2.2.3提高响应速度，设计时需要一些“善意的谎言”：
上图分别为Chrome、Opera、Firefox。其中Chrome在加载的过程中先逆时针和服务器进行通信，取得数据后才顺时针进行加载，不但让用户易于区分数据进度，图形又展现给人一种很快的感觉。不光是技术层面的加速，界面给人的心理感受也提升了用户体验。而其余几款浏览器采用直接顺时针的加载方式给人等待加载过长的感受。
2.3影响用户体验的因素
2.3.1安装与启动进程
安装与启动过程与用户体验息息相关。一个快速简洁的安装过程加上极快的启动速度会让体验增加。
下图分别是Opera、QQ、猎豹、360浏览器。他们分别在第一次启动界面直观的向用户表达了他们的特性和优点。Opera的国际化、QQ的多彩和简洁、猎豹的酷炫、360的安全。一个产品的目标定位准确才能让用户感知。但是也有一些浏览器不采用启动说明的方式，直接进入主页面，这也是简洁的一种体验。
2.3.2用户界面
用户界面是一个仁者见仁智者见智的主观性感知，但是，作为浏览器产品，我们应该找准自己的定位，理念决定一切。Chrome官方博客曾经在这款浏览器刚出来的时候说过“Content,notchrome”内容为王的理念才是一款优秀的浏览器应该有的体验。浏览器不应该喧宾夺主，如何让用户最大限度的浏览内容而不是专注于浏览器本身才是重点。下面，我们对比市面上几款常见的浏览器，通过市场占有率发现什么样的浏览器才是赢得大众喜爱的。
上图可以看出，IE、Chrome、QQ这三款浏览器的界面都是非常简洁的，颜色搭配清爽，符合现在的设计趋势，达到了内容为王。Chrome通过将导航栏与搜索进行整合，是整个界面更加清爽，其界面分布也更加合理，第一列有“标签页、最小化、全屏、关闭”这几个按钮。而IE只有上述的后三个按钮，并没有很好地利用空间布局。
2.3.3快捷功能和应用扩展
随着浏览器的平台化发展，快捷操作以及应用扩展已经变得不可或缺，没有上述功能的浏览器正在逐渐被淘汰。为我们从界面布局的角度来分析几款浏览器的快捷功能和扩展功能。
通过点击Chrome按钮，就弹出了所有设置、快捷方式、下载内容、甚至包括开发者使用的编码、源代码、javaScript控制台等功能。这种方式有利于用户集中查找。
Chrome的所有选项都包含在此，灰度化的Ctrl+X明确表示了当用户希望快捷操作时应该按哪些按钮。这里有一项“更多工具——创建用户快捷方式”选项，可以方便的将用户喜爱的网站转换成一个快捷方式保存在桌面，让用户更快的点击。
应用扩展功能是Chrome浏览器突飞猛进的一个因素，正因为数以万计的应用使得这款浏览器有了无限的可能，以至于现在浏览器的标配都具有了自己的应用商店和扩展功能。有很多浏览器本身并没有的功能都可以通过插件来扩展升级。
其他的浏览器大多数都是基于Chrome+IE的双组合，这样既能够拥有相应的扩展性又能够兼容传统网页。但是基本上都是“套壳”软件。所以主要研究Chrome和IE之间的差别。
３每个阶段用户体验的关键原则和方法
3.1战略和产品特点
一个产品在这个企业中代表什么样的角色是至关重要的。这款浏览器在其公司内部占据什么样的战略点是很重要的，例如：Chrome是Google为了占据平台入口和创造一款跨时代的浏览器而打造的。产品特点具有快，简洁，平台化等特点。360是奇虎公司以安全为名义打造的一款浏览器，根据马斯洛需求理论，它直击“安全需要”这一层面，所以依靠这种基本需要而拥有了一大批用户。Sougou是以快速，无限扩展，教育网加速等名义打造的浏览器，主要推广其搜狗搜索，也是为了抢占流量入口的一种形式。
3.2功能设计
浏览器的功能最基础的应该是浏览。但是随着时代的发展，浏览器已经不仅仅是浏览这么简单，很多应用和数据以后都将通过浏览器来实现。Chrome就是因为拥有无限的扩展功能从而夺取了IE的大量份额。例如屏蔽广告，下载地址分析，微信电脑版，视频小窗口，12306抢票等等这些功能都是大众所喜爱的功能，如果一款浏览器并没有上述的功能，那么这款浏览器还会受到大众的喜爱吗？所以，功能的创新是一款浏览器的精髓。
3.3界面布局设计
其中包括布局的艺术性，突出重点，便捷性和友好性。我们以Chrome为例说明。
3.3.1浏览器的Tab栏
交互理论的常识——Fitts定律，该定律指的是：使用指点设备到达一个目标的时间与两个因素有关：（1）设备当前位置和目标位置的距离；（2）目标的大小。这里Chrome浏览器的标签页做的很大。有利于第二点的进行。当Chrome最大化时，边框消失，Tab栏位于整个屏幕最上面的位置。其鼠标不会跑出屏幕以外，所以用户可以随意将光标向上移动都不会跑出浏览器的界面以外。降低了指向的难度以及时间。
另外，当浏览器的标签页变得非常多的时候，用户需要关闭标签页，这时Chrome会在用户关闭一个标签页时会等待，等待一段时间用户没有进行关闭操作后，Tab才会调整（保证Tab的关闭icon在用户操作期间一直在鼠标下方）。
3.3.2ToolBar
用极端简洁的方式展现，最基本功能:后腿、前进、刷新、输入框、设置这5项，非常利于用户短期记忆。不需要额外的学习。
3.3.3后台同步
设置简单，保证了现在多平台的同时运作。并将设置同步至云端。能够保证用户可以方便的不同终端上使用自己的常用操作。
3.4界面视觉设计
浏览器的界面视觉设计不但需要图形的语义，它们相互之间需要有一致性，对其进行简单的艺术性处理，也有了一定的装饰效果。随着现在UI设计的发展，用户的审美水平也不断地提升，近期比较火热的“扁平化”设计风格和“Metro”都是引领了新的审美感受。现有的浏览器已经开始支持了主题和外观的变化来满足不同用户的审美需求。
４总结
当今，PC端浏览器的发展已经越来越快，从原始的最简单的浏览已经开始慢慢拿转变为平台化的软件，通过分析浏览器的交互特征，交互方式，用户体验等等以及研究各个浏览器的优势特色，总结了浏览器的界面设计在启动、界面分布、快捷功能、结构、布局等方面的体验。好的浏览器能够增加用户的使用效率和体验感受。为设计师们提供了一些新的理念和思想。从而设计更为高效和体验很好的浏览器。随着更新的技术发展，新的插件和布局都会有新的发展和变化，本文不足之处，希望广大专家学者批评指正。
教育期刊网 http://www.jyqkw.com
参考文献
［１］[美]唐纳德·A.诺曼.设计心理学[M].北京:中信出版社,2003(1):100.
［２］[美]霍夫曼.Web界面设计如何让用户心动[M].向怡宁,译.北京:人民邮电出版社,2009.
［３］[美]威尔森曼.重塑用户体验[M].刘吉昆,刘青,译.北京:清华大学出版社,2010.
［４］洪柳,郭佳逸,葛仕钧.心流理论与用户体验设计[J].艺术与设计,2009(3):178-80.
注释：
①数据来源于百度统计——流量数据研究院http://tongji.baidu.com/data/browser.
②DonaldAN.情感化设计[M].北京:电子工业出版社,2005.
［责任编辑：邓丽丽］