音效素材网提供各类素材,打造精品素材网站!

站内导航 站长工具 投稿中心 手机访问

音效素材

国内外网页浏览器的设计思路评测
日期:2021-09-08 17:14:11   来源:脚本之家

一、准备工作

1研究目的

对比评测针对国内市场的浏览器和国际市场浏览器设计思路的不同。面向国内市场的浏览器针对国内用户做了哪些改变,以及为什么这么做。(若赶时间,请翻到最后,直接查看总论)

注①:本文中出现的浏览器均指桌面版网页浏览器,Win7平台。
注②:文章很浅,希望对大家有点儿价值。欢迎拍砖评论!

2浏览器分类

国内浏览器市场占有率 2010年5月(数据来源)
国内外浏览器设计对比初探
国内外浏览器设计对比初探

 


国外浏览器市场占有率 2010年5月(数据来源)
国内外浏览器设计对比初探 

根据这次研究的目的,我们把浏览器做这样的分类。(均按占有率顺序排列)

 国内组:IE6、360浏览器、遨游、腾讯TT、世界之窗、搜狗
 国际组:IE7&8、Firefox、Chrome、Safari、Opera

更常见的分类方法——按照浏览器的4大内核来分类。

 Trident:IE系列、国产系列(360浏览器、遨游、腾讯TT、世界之窗、搜狗)
 Gecko: Firefox
 Webkit:Safari、Chrome
 Presto:Opera

特例:国产Trident和Webkit双核心浏览器

 遨游3 beta版
 QQ浏览器5 预览版
 搜狗浏览器2.0 正式版

二、界面设计对比

左侧图片为国内组,右侧为国际组。
按照前面给出的市场占有率顺序排列(IE7和IE8放在一起)
国内外浏览器设计对比初探
注1:各种浏览器都有一定的界面定制功能,这里的截图均为默认界面。
注2:除IE6外,其他浏览器都支持多标签浏览(现代浏览器最基本特征)。

视觉效果对比:

国内组:丰富、花哨、艳丽的界面;追求娱乐性、卡通化——个性化的IE6外壳
国际组:简洁、清爽、严谨的界面;讲求实用性、商务化——平台化的上网入口

界面布局设计对比结果:

国内组:
1. 由于均采用IE核心,这些浏览器从IE6进化而来,给IE6穿上了各自的卡通图标服装。
2. 国产浏览器都保留了IE6的标题栏,增加了可显隐的书签栏,同时将导航按钮、地址框、搜索框合并到一栏。其中360、TT和搜狗浏览器保留导航按钮“停止、刷新、主页”的位置和顺序;遨游交换了“停止、刷新”按钮的位置;世界之窗将“停止、刷新”合二为一。
3. 除IE6外,均有换肤功能。

 

国际组:
1. Firefox与IE8有着相似的界面,只有菜单栏和“刷新停止”按钮的位置不同,几乎可以无缝切换。
2. Chrome采用了超简洁的界面,并且带来了浏览器界面设计的趋势(下文有详述)
3. Safari与 Chrome一样把“菜单栏”整合进了最右侧的两个按钮“控制当前页”和“自定义和控制浏览器”,保留传统的标题栏。
4. Opera默认也把“菜单栏”整合进了最左侧的一个设置按钮(也可以调出来显示),同时学习Chrome的标签页显示方式,但是仍然保留传统的标题栏。

界面设计趋势

从上到下依次是:Chrome6,Firefox4,遨游3,QQ浏览器5
国内外浏览器设计对比初探

浏览器界面设计趋势——最大程度显示页面本身的内容。表现在:

 

1. 学习Chrome去标题栏,采用“上标签页”的方式显示标签
2. 将菜单栏和工具栏的功能整合为一个或者两个“设置、功能”按钮
3. 整合地址框和搜索框为一个(这个趋势待定)
4. 可选择隐藏的状态栏,把布局的选择留给用户才是最好的体验。

三、功能设计对比

对比各自的宣传语

国内组:

 IE6:未知
 360浏览器:安全好用的浏览器
 遨游:您上网必备的全能浏览器,上网从遨游开始
 世界之窗:最强的广告过滤、最快的浏览速度、最小的资源占用
 腾讯TT:快速、稳定、安全的浏览器
 搜狗浏览器:上网最快的高速浏览器国际组:
 IE8:Faster, Easier ,Safer 快捷、简单、安全的上网新体验
 Firefox:Faster,more secure&customizable 更快更安全,可随心定制的浏览器*
 Chrome:A fast new browser高速的免费网络浏览器*
 Safari:Browse the web in smarter,more powerful way以全新眼光纵览网络世界
 Opera:Faster&Safer Internet 更快更安全地浏览网络*

(注:带*号的中文翻译为非官方。)

从宣传口号上来看,国内组与国际组浏览器没有明显的区别,都着重强调“快速和安全”。但是由于国产浏览器使用IE核心,它强调的安全恐怕不是真正的安全。

功能设计之别

现代浏览器必备特色功能:

1. 对web标准的支持
2. 多标签浏览,隐私浏览
3. 广告弹窗拦截,内置下载工具
4. 智能地址栏,搜索栏
5. 插件、扩展程序

国内组浏览器——强调增加针对中国网民实用的功能,把许多国际版浏览器需要扩展的功能直接添加到浏览器上。

 视频弹出播放、鼠标手势、双击关闭标签页
 网络收藏夹(需要账户)
 附带导航网站(360导航、遨游的2798网址大全、搜狗的导航)
 网银、安全网址检测(多数国内网银仅支持IE)
 下载管理(实用的预下载功能)
 换肤、截图、缩放、网页静音
 ……

国际组浏览器——提供基本的功能和强大的扩展,以下是国人不常用的基本功能

 RSS订阅、阅读
 Email发送
 开发人员工具
 ……

浏览器功能设计趋势

浏览器功能设计趋势——平台化(集合多种应用、可扩展),像miniOS。

表现在:
我们的很多上网时间都花在了浏览器上:如搜索、聊天、收发电子邮件、购物、使用网上银行、阅读资讯以及观看在线视频,而这些活动通常都是通过浏览器进行的。

四、研究结果分析

界面设计上

国内组:丰富、花哨、艳丽的界面;追求娱乐性、卡通化——个性化的IE外壳
国际组:简洁、清爽、严谨的界面;讲求实用性、商务化——平台化的上网入口

功能设计上

国内组:增加针对中国网民实用的功能,如视频弹出播放,网络收藏夹,换肤,截图等。
国际组:平台化的浏览器(集合多种应用、可扩展),像miniOS。

总结
 国内浏览器采用了保守的界面(仿IE6),适当增加了现代浏览器的通用功能,技术上针对国内网民的娱乐等需求集成了一些实用的功能。

 国际浏览器则争相采用新的界面,技术上提供基本的功能和强大的扩展,以满足人们对web2.0时代拥有众多应用的平台化的浏览器的需求。

原因如下:
(数据图表取自CNNIC《第25次中国互联网发展报告中》)

2009年中国互联网普及率为28.9%。
网民结构的最大的特点是年轻化,40岁以下占83%;低学历化,高中及以下学历占75.8%。这样的年龄结构也就决定了国内网民的互联网应用以“信息获取”和“网络娱乐”为主。
国内外浏览器设计对比初探

国内外浏览器设计对比初探

相比之下,2009年美国互联网普及率为74.1%。美国网民(没有欧美整体的数据)以“信息获取”和“网络消费”为主。

国内外浏览器设计对比初探

注:
信息获取:搜索引擎和网络新闻
网络娱乐:网络音乐、网络视频、网络游戏
网络消费:在线购物、网络支付、在线旅行和酒店预订

总论

因为国内网民低端化,年轻化,娱乐化。表现:
1. 不知道什么是浏览器,只知道点击那个e图标可以上网。(注意360浏览器的图标)
2. 从来不在地址栏输入网址,所以需要导航网站。
3. 上网以娱乐为主,习惯使用IE6浏览器,更高效的浏览器对他们没有吸引力。
4. 现在使用的浏览器通常是被动安装的。
5. ……

 

引用keso的话: 中国的互联网,基本上是给30岁以下的年轻人设计的,这跟中国互联网的用户构成有关。在这样的环境中做产 品,其实是一件很幸福的事,因为你的用户都是最具好奇心,最好学,最喜欢尝试,最没成见,最有冒险精神的一群人。困难的不是让他们弄明白,而是让他们产生 兴趣,或者感到需要。他们不笨。

另有一种中国互联网ABC类用户1:10:100的说法,也是指网民结构以低端用户为主.

国内的浏览器设计要围绕着IE6转,是因为大家已经习惯了,大幅度改变习惯成本太高。决定了国内浏览器的界面丰富、花哨、艳丽;追求娱乐性、卡通化——个性化的IE外壳。

同时,由于个性化功能的需求,国内浏览器统统集成了网民最常用的一些功能,各有特点和针对性(就像山寨机一样)。长期来看,随着网民年龄结构的变化和成熟,互联网应用需求的增加(大量Ajax程序如:Gmail,Twitter,Foursquare……),对浏览器的要求会越来越高,平台化可自行扩展的浏览器是趋势。

    您感兴趣的教程

    在docker中安装mysql详解

    本篇文章主要介绍了在docker中安装mysql详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编...

    详解 安装 docker mysql

    win10中文输入法仅在桌面显示怎么办?

    win10中文输入法仅在桌面显示怎么办?

    win10系统使用搜狗,QQ输入法只有在显示桌面的时候才出来,在使用其他程序输入框里面却只能输入字母数字,win10中...

    win10 中文输入法

    一分钟掌握linux系统目录结构

    这篇文章主要介绍了linux系统目录结构,通过结构图和多张表格了解linux系统目录结构,感兴趣的小伙伴们可以参考一...

    结构 目录 系统 linux

    PHP程序员玩转Linux系列 Linux和Windows安装

    这篇文章主要为大家详细介绍了PHP程序员玩转Linux系列文章,Linux和Windows安装nginx教程,具有一定的参考价值,感兴趣...

    玩转 程序员 安装 系列 PHP

    win10怎么安装杜比音效Doby V4.1 win10安装杜

    第四代杜比®家庭影院®技术包含了一整套协同工作的技术,让PC 发出清晰的环绕声同时第四代杜比家庭影院技术...

    win10杜比音效

    纯CSS实现iOS风格打开关闭选择框功能

    这篇文章主要介绍了纯CSS实现iOS风格打开关闭选择框,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作...

    css ios c

    Win7如何给C盘扩容 Win7系统电脑C盘扩容的办法

    Win7如何给C盘扩容 Win7系统电脑C盘扩容的

    Win7给电脑C盘扩容的办法大家知道吗?当系统分区C盘空间不足时,就需要给它扩容了,如果不管,C盘没有足够的空间...

    Win7 C盘 扩容

    百度推广竞品词的投放策略

    SEM是基于关键词搜索的营销活动。作为推广人员,我们所做的工作,就是打理成千上万的关键词,关注它们的质量度...

    百度推广 竞品词

    Visual Studio Code(vscode) git的使用教程

    这篇文章主要介绍了详解Visual Studio Code(vscode) git的使用,小编觉得挺不错的,现在分享给大家,也给大家做个参考。...

    教程 Studio Visual Code git

    七牛云储存创始人分享七牛的创立故事与

    这篇文章主要介绍了七牛云储存创始人分享七牛的创立故事与对Go语言的应用,七牛选用Go语言这门新兴的编程语言进行...

    七牛 Go语言

    Win10预览版Mobile 10547即将发布 9月19日上午

    微软副总裁Gabriel Aul的Twitter透露了 Win10 Mobile预览版10536即将发布,他表示该版本已进入内部慢速版阶段,发布时间目...

    Win10 预览版

    HTML标签meta总结,HTML5 head meta 属性整理

    移动前端开发中添加一些webkit专属的HTML5头部标签,帮助浏览器更好解析HTML代码,更好地将移动web前端页面表现出来...

    移动端html5模拟长按事件的实现方法

    这篇文章主要介绍了移动端html5模拟长按事件的实现方法的相关资料,小编觉得挺不错的,现在分享给大家,也给大家...

    移动端 html5 长按

    HTML常用meta大全(推荐)

    这篇文章主要介绍了HTML常用meta大全(推荐),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参...

    cdr怎么把图片转换成位图? cdr图片转换为位图的教程

    cdr怎么把图片转换成位图? cdr图片转换为

    cdr怎么把图片转换成位图?cdr中插入的图片想要转换成位图,该怎么转换呢?下面我们就来看看cdr图片转换为位图的...

    cdr 图片 位图

    win10系统怎么录屏?win10系统自带录屏详细教程

    win10系统怎么录屏?win10系统自带录屏详细

    当我们是使用win10系统的时候,想要录制电脑上的画面,这时候有人会想到下个第三方软件,其实可以用电脑上的自带...

    win10 系统自带录屏 详细教程

    + 更多教程 +
    网站运营微信营销网络赚钱