数极客首页

从微软得到的教训:十个要避免的网站设计陷阱

从微软得到的阅历:十个要避免的网站设计圈套

今天,我们将剖析

大名鼎鼎的软件公司的网页设计做法和倾向,看看我们能否
能够

学到一些东西,以避免

在我们自己

工作的失误。

同意或不同意我的见地
,随时在下面评论倡议

。作为专业设计师,你的观念
是有价值的,我等候

着你的想法。

偶尔

的数落

假定

你厌恶
文章充溢
隐恶扬善
般的唠叨,我很负疚
,这个文章偶尔

会有点挑剔。我通常喜欢赞扬好的设计而不是批判
坏的设计,但是当大卫.阿普尔亚德和我决议
写一个微软设计倾向剖析

的文章后,似乎

不得不见识一下什么是杂乱,丑陋,致使

(或者)失败的东西。

为了避免

评论沦入口舌之争,我在下面的剖析

中不会提及苹果或者跟苹果单独对比

。这并不是由于
PC对MAC是最没争论的,而是由于
我们只是想看看那些我们以为
真的缺乏理论
的网站设计和开发。微软是一个很胜利

的公司,这不会由于
有些问题而掩盖。理论

上,正如后面指出的,微软在某些站点团队中有一些很优秀的设计师,我们只是提出,应该有一个更高更全面的质量控制。

出于这样的思索
,让我们来剖析

微软一些短少

设计和开发理论
的中央
,从中你能够

受益于这种学问

#1 谨防某些强迫
插件

苹果和Adobe之间最近的摩擦让我们认识到,依赖完好

封锁
的第三方插件创建

网站最终会招致
一些严重的结果
。微软似乎要重蹈这样的错误,网站越来越多的依赖Silverlight。

从微软得到的阅历:十个要避免的网站设计圈套

我阅读
微软的站点准备这篇文章的资料

是,是经常遭到
弹出窗口的骚扰,通知我系统没有装置

Silverlight因而

不能用原本

的方式阅读
这些网页。我的疑问是,“为什么要走这条路呢?” 特别是关于
一些简单的幻灯片效果的话,能够

用的技术遍地都是。诚然,这是微软自己

的Silverlight,所以从良好的商业认识
动身
要支持它,但这并不意味着参与

他们就是最好的选择。

无论你能否
是Silverlight的粉丝,我的倡议

是假定

你网站的功用
依赖于任何Silverlight或相似

技术,要十分

谨慎

。有关继续采用Flash开发网站能否
愈加
合理的争论还在持续升温,像Silverlight这样的二线系统的采用变得更具赌博性。如有可能,请坚持跨阅读
器,契合
规范

的代码和工具——别央求

你的访客额外的操作或者装置

#2 留意
分辨率

这是我对微软最大的埋怨

,由于
它看起来就像设计得很草率。毫无疑问,尽量减小文件大小而增加适用
性和坚持
图片明晰
分明

之间是一条狭窄的路,但我还是不由
觉得,相比那些专业的站点,微软似乎更倾向于显现
丑陋的锯齿状的JPG。

拨号上网用户数据量
曾经
逐年减少,可接受

的图像尺寸曾经
越来越大。不过这也不意味着你能够

不用再留意
尽量把有必要小尺寸的图片尺寸弄小,但往常

这里,设计的重量
变得这么重,分辨率过小会大大降低了网站的外观质量,图片变得弄巧成拙!

这会是很讽刺

的,原本

你希望运用
图片让你的网站更美观
,但在这个过程中,最终降低了你的美感。假定

可能,在不同的显现
器预览你处置
的图片,要留意
有多少失真,多少人工痕迹你能够

接受

的。

#3 组织紊乱

有时你依照

常规的设计规则,到最终
还是有些东西似乎视觉欠佳。阅读
微软的网站我就遇到很多这样的页面,例如下面这个,固然

尝试运用
了基于排列的组织,看起来还是那么紊乱

从微软得到的阅历:十个要避免的网站设计圈套

那么问题在哪里呢?简单地说,在于这里一个相对狭小的空间里要放一大堆东西。即便

他们肯定的曾经
试图对内容排版,还经过
图标增强

视觉可读性,最终结果依然

是相当失衡。

假定

你认真
看看,你会发现这页面的四个栏目似乎是由四个不同的人来设计的,只是把它们都挤在一同
。左边的图片相关于
右边看起来真的的繁重
,文字颜色有点断断续续,内容是蠢笨

交错

,各列之间缺乏足够的空白喘息空间,难看出它们的版面独立性。

这里得到的阅历

是要包装你页面的栏目信息时,留意

内容信息过于庞杂。毫无疑问,有很多状况

下都会央求

增加更多的内容,但应在统一调和
且有吸收
力的方式组织处置
,比如

下面这个漂亮的例子(来自非微软的网站)。

从微软得到的阅历:十个要避免的网站设计圈套

从微软得到的阅历:十个要避免的网站设计圈套

#4 矛盾

从Microsoft.com开端
,翻开
了庞大的导航下拉菜单,选择站点不同中央
访问,你会发现,无论哪个链接,你点击出来的页面相比主页是相当不同,即便

在同一个下拉菜单出来的页面都是如此大差别


从微软得到的阅历:十个要避免的网站设计圈套

阅读
微软的网站就像玩一个旋转的轮盘赌。你已简直

猜不到你要去的中央
和所等候

的下一个页面。部分

页面有swooshy(漂亮
作风
的曲线)背景,而其它页面则是突变
的背景,致使

是发散的圆环。大多数网页似乎倾向于蓝色,但又不是相同的蓝,也有一些网页完好

疏忽

了蓝色倾向。

问题是,不论

你网站是2页或者200页,分歧
性还是必需的。在有限的时间内对一个网站的运作方式和界面变得熟习
时,用户会感到愈加
温馨
。每隔几页就给一些截然不同的东西会使阅读
愈加
紊乱
,用户体验也变得很低效。

除此之外,发明

一个强有力的统一的品牌就是一个良好的业务,由于
它辅佐

客户以更独立的方式去联想你公司。当然了,微软有许多不同的品牌,这些分站都是从主页延伸出来的,但即便

是Microsoft.com中心
的网页中,图片作风
和导航办法

似乎大大不同。

#5 剪贴画中心的设计

看看剪贴画在微软Office很无可避免

的存在,这个倡议

会显然是有点荒唐
。但是,ICON设计自1995年以来曾经
走了很长的路,是时分
放弃图片中你看到的那种特定作风
了。
从微软得到的阅历:十个要避免的网站设计圈套

上面这些从微软网页拿来的例子让我感到鸡皮疙瘩,特别
是那个丑陋的“Beginner Developer” 标志。我搞不懂一个回力标为什么要攻击一个神奇的植物,悬浮着显现
器是辅佐
攻击还是逃离现场?我所知道

的是,视觉传达在这里是一团糟。

这就是为什么CSS画廊像我们自己

一样存在世上的主要缘由
。不这样的话你就能够

窃取他人

的设计,但这样你就能够

一瞥你正在开发的设计十年来的展开

状况

。阅读
这些CSS画廊,就像在商场盛行
服饰店一样去,以显现
给你的猖獗
姑姑她没必要穿得似乎

要去参与
Sunny和Cher的扮演

记得时辰
坚持
自由

无疆界,从自我开端
超越于盛行
设计。世界都在变化,留意

过于顽固
激进

#6 文本对齐与溢出

微软网站的另一个不容忽视

的倾向就是文本总是不时
的破坏

行列,很显然
的溢出边境
.

从微软得到的阅历:十个要避免的网站设计圈套

这是一个相当容易处置

的问题,仅仅需求
一点努力和留意
。只是一定要会应用
免费工具像Adobe的阅读
器实验室,以确保你的规划
在主流阅读
器都不会被破坏

在谈到跨阅读
器的分歧
性时,无可招认

的CSS规划
像一个棘手的野兽,不过那样的小错会让你网站的质量
降落
,所以还是很值得你花时间去处置

的。

#7 缺乏对齐

有时,一个给定页面交给我,要我指出设计的缺陷

来是一个应战
。例如,在下面的网页,原本

我想找这个小窗口运用
的碴——点击时不会变大,但我看页面越久,我就对这个页面的规划
的企图

感到困惑。

从微软得到的阅历:十个要避免的网站设计圈套

假定

你熟习
基本

的设计理论,你知道

,学习贯彻稳定
分歧
的道路
是优秀的网页规划
的关键。如上图所示网站的左,中,右的视觉对齐奇特

的混合,分离

顶部留出的不尴不尬的空白,为内容信息呈现了一个怪异视觉流。

此外,假定

阅读
上面这个页面,你会看到整个内容似乎试图在页面居中,但由于中间横穿过一个区带,使得页面似乎中心偏右了。

#8 广告杂乱

如下图,免费设计博客喜欢放大量的广告,这是给我们的收入方式,以支持继续提供内容效劳
。不过假定

你运转
的是一个专业商务网站,你想减少内容音讯

并专业化广告,你就必需
认真
思索
了。

从微软得到的阅历:十个要避免的网站设计圈套

Microsoft.com的页面充溢
了各种广告,实真实
在的降低了网页上的美感。有时,这些广告是直接指向到其他微软的网页,有时是指向其他公司或协作
同伴
。导航你的网站到其他下属站点这种概念是无可厚非的,但怎样
去完成
这就有很大的区别了。

有一个事实就是,往常

大多数网民都学会了辨认

,疏忽

致使

可能恶感

横幅广告。这并不是说,这种类

型的广告在恰当
的目的
和设计下也没有效果,更不是说微软用户基本

不去点击,我真实
觉得可疑的是,就没有更好的处置
办法

了么?

如你所见,微软网站假定

要导航用户到他们的移动

电话和其他项目,简单的办法

就是设置了一个紊乱
,非规范

(智能设计)的广告系统贯串
整个网站。不过,似乎将广告内容整合到网站一体,随着用户的关注,会有一个很不错的点击率。

另外,这种整合将使设计愈加
统一调和
。由于
他们更宁愿增加一个单元而不是分割一个栏目。对了,这或许
是我能够

了解

的微软“效率本钱
”做法的计划

,但我要劝诫
一下别让他们误导你。大部分

状况

下,你设计的网站不会是像微软一样的兆级网络,因而

更适于踏实的统筹的设计,可避免

过多广告构成

的视觉紊乱

显然,有很多类型的网站这并不适合

呈现
广告。你要思索
分明

你网站是销售产品或效劳
,还是需求
额外的收入和广告的骚扰。

#9 短少

留白的喘息空间

在印刷设计,设计师在每一页都布置
“生息区”,通常的做法是在页面边缘参与

矩形区域,定义出放置内容的安全

范围,避免

页面太挤逼或页边拥堵
。大多数网页设计师都会直觉上这样做,很显然
的你不希望内容太散,因而

挤到了阅读
器侧边。

从微软得到的阅历:十个要避免的网站设计圈套

但是
,正如上面截图显现
,微软的一些网页似乎并没有看重这方面的意见。相反,页面的内容总是不在任何空白或者边缘就开端
(至少在我运用
的阅读
器上是这样)。

左边的导航版,让人觉得
不是内置在这个页面的,觉得
似乎

截断了(是了,这样的状况

还可能是由于一个事实:我没有IE)。这个例子的阅历

就是:永远要留意阅读
器窗口的边缘。除非你是为了某种显然
的视觉效果而突破

规则。将你的内容,特别
是交互和链接,放在有边缘的安全

范围,这样用户运用
的时分
不会感到很挤。

假定

你细看一下上面的截图,你能够

看到微软的设计师一些失败例子,他们基本

没有思索
到这些页面的文本块在主流阅读
器能否
浮动正常。这是微软很有趣的倾向,许多网页设计师,整天
处心积虑

的为IE阅读
器而作特别的顺应
,但一家微软这样的大公司显然不能这么无所谓的,不去在其他系统状况

下检查他们自己

的工作。

#10 未充沛

应用
人才

固然

上述关于微软网页设计的负面评价很多,我还是惊喜地发现,他们其实也有不少网站和网页看起来很漂亮诱人

从微软得到的阅历:十个要避免的网站设计圈套

网站的很多中央
让我置信
微软真的用心机

规划
,颜色
选择,跨阅读
器兼容,上面是其中两个例子。这些能够

看到,微软这个大染缸中的某处还有不乏才气
的人,能够

辅佐

微软走出衰退的设计。

这些设计师,无论他们是谁,应该提升到合适

的职位,让他们能够

树立
共同协作,并制定每个微软网页设计师要遵照
分歧
规范

。他们能够

在一个内容紊乱
似迷宫一样的中央
,树立
很多很显然
属于同一企业的漂亮站点,从而树立
强大网络品牌。

最终
我给的倡议

是,找到你自己

公司这种类

型的优秀人才,给他们一个鼓舞
声音,而不是让他在团队中悲痛

的湮没

了才气
,任命最强设计师和开发人员到合适

的职位,在那里他们能够

影响每个角落的视觉沟通关联到特定的品牌。

这样能够

有效地经过
树立
明白
的,一向
的,严厉
的品牌指导战略
,并将不同品牌的战略
分发给每一个设计人员和开发人员。

思索

总结

总之,固然

微软具有
不少极有才气
的网页设计师,这些人的工作成果简直

被那些大量的不契合
规范

的内容所淹没

,而这些规范

,我们觉得即便

只工作一年多设计师和开发人员新手都能够

希冀
做到的。

侥幸

的是,我们能够

拿微软作为阅历

,以分明

阐明

这些工作方式是错误的。在说到工作废品
的质量时,绝不要悲观的以为
,你仅仅是一个单枪匹马的自由

职业者或小型的设计公司,就不能胜过那些大型企业和设计公司。

我发现,世界各地在家里办公的设计师中,要找到比坐在大公司大桌子前的设计师更优秀的真实
很容易。 你要享用
这样的事实:你不用
去调和

和控制数百个设计师的工作质量。尽量运用你具有
的少量资源分别

你个人天马行空无边无边
的创意和动力,去发明

一些漂亮
的功用
强的设计,发明

一些网络上最优秀的站点。

来源:  designshack

编译:MazingTech

给大家举荐

我国新一代大数据用户行为剖析

与数据智能平台:数极客(https://www.shujike.com),是支持无埋点、前端埋点、后端埋点、API导入四种混合数据采集方式,整合剖析

用户行为数据和业务数据,能够

自动监测网站、APP、小程序等多种渠道推行
效果剖析

,是增长黑客们必备的互联网数据剖析

软件。数极客支持实时多维剖析

、漏斗剖析

、留存剖析

、途径
剖析

等十大数据剖析

办法

以及APP数据剖析

网站统计网站剖析

小程序数据统计用户画像等应用场景,业内首创了六种提升转化率的数据剖析

模型,是用户行为剖析

范畴
首款应用定量剖析

与定性剖析

办法

数据剖析

产品

发表评论

评论已关闭。

相关文章