分享
 
 
 

MSN.com 改版, 翻译自Stopdesign

王朝other·作者佚名  2006-01-09
窄屏简体版  字體: |||超大  

伴随着微软对新搜索引擎 作出的努力, MSN 也出现了一些十分重大的革新。之所以重大, 并不是因为它的新外观, 也非因其试图把Google挤出头号搜索引擎的multi-million-dollar ad campaign 。之所以重大是因为其主页架构体现了对Web 标准的大步迈进。

现在请记住, (在我看来)MSN的新视觉设计是比较庸碌的。它单调乏味,四四方方。(不要怪责那位设计师吧,假如有的话。) 看起来它就像是直接从产品经理的草稿中直接就跑到编码人员的手中一样。页面的设计当然没有提供什么新颖或创新, 而更像是在模仿 Google 和 Yahoo, 明显在尝试急起直追。(也许有人或说 MSN 的设计, 尤其是页面最上方的部分, 有一点太新奇。看起来像一个Yahoo的 pointy tabs根Google简化模式混合起来,让人感觉迷惑的模仿。搜索页面的简化版本 太简单了, 看起来好像还没有完成。

除去没趣的外观设计, 我看到了一些值得提及的有趣事情值得引起重视:

XHTML 1.0 Strict

不但新的 MSN 页面可以当之无愧的炫耀它的 XHTML 1.0 Strict 文档类型声明, 而且跟它一起制作的主页— 在写作本文的时候— 仅包含了28 个验证错误,(*译者注:翻译时已下降到8个),而搜索页面仅包含1处错误。不完美, 但是跟过去几年创立的大网站来说就更接近完美了。绝大多数的验证错误都是简单而易于更正的问题。然而广告所使用的IFrame将成为一个问题:XHTML 1.0 Strict 中不允许它的存在。

CSS 布局; 更清晰的语义

这个新站点与众不同也因为它使用了CSS来进行页面布局和提高了语义的清晰度。使用了众多的标题和无序列表。适当的使用了一个表格来显示股市汇总;另外一个可能是一个 legacy ad 系统的一部分。

升级信息

一个某程度上不存在偏见的 (或者说: 不是完全以 IE 为中心的) 耐人寻味的升级信息会在CSS不可用的情况下显示在主页的上方:

为什么 MSN 看起来会像这个样子?

您的浏览器无法找到我们的样式和外观表现信息。如果您愿意,可以继续使用这样的页面,或者可以升级您的浏览器到最新版本。如果您正使用 [/url] Internet Explorer, 请转到Microsoft Internet Explorer 网站来安装其最新版本。如果您正使用其它的浏览器, 访问您浏览器的网站以获取更多信息。

样式切换

一个比较突出的功能,使用了一个简单的客户端样式切换器来让用户在蓝色和白色主体背景中进行选择。

手持媒体设备类型

查看在主页中的[url=http://hp.msn.com/css/home/hp.css?v=17]包含的样式表 , 您会看到用了一些@media handheld {} 来为手持设备定义的规则。像这样的规则:

@media handheld {

#sitenav,#content1,#content2,... {float:none;}

}

可以禁止很多的浮动对象。看到象这样大的站点也开始考虑手持媒体设备真是然人鼓舞。这样是有道理的, 尤其是随着像PocketPC这样的平台流行。希望说明PocketPC Team正是这些手持设备类型背后的有力支持。

然而, 我注意到很多单独使用的@media handheld {}, 仅仅包含了一条规则, 而不是使用分组来包含所有的手持设备规则。奇怪。看下一点。

动态样式表

使用请求字符串(Query string)来指向他们的样式表,这样做很明显说明动态脚本在背后运作。 动态生成CSS的其中一个副作用就是样式表里几乎所有的空白字符都被去掉。这让它很难使我们读懂, 然而他们还能很容易升级(也可能是因为要根据不同的浏览器生成不同的样式)。这可能就解释了为什么每条@media 容器仅包裹着一条规则。可能对不同的媒体类型,规则会被标记,而现在样式表还没有把可共用于的各种媒体设备的规则分组这样的逻辑。 (译者注:据本文的反馈,这是因为Microsoft PocketPC 上的Internet Explorer对于处理@media 的规则存在bug, 仅能解析一条规则,因此要分开书写。)

Input 按钮轮廓

不要假定所有的浏览器都允许对 input 按钮进行完全的操纵。如果这样, 我也受过这样的苦头, 你的按钮最后会变成这个样子 (在 Safari 中):

IE5/Mac 被忘却在角落

我不太肯定 MSN.com 在经过更新和改进的MSN for Mac 浏览器上看起来会是什么样 (仅可用于 MSN 订阅者),幸好有Tantek 当他还在 [/url] 时帮忙测试。只需要在IE5/Mac里头看上MSN.COM一眼, 有一件事情就清楚了: [url=http://www.microsoft.com] 看来完全没有在意新的MSN站点在IE5/Mac上看起来会像什么样子。天啊。

[/url] 在[url=http://specials.msn.com/homepagetour/default.html]explanation of benefits of the new MSN 的链接里把“更快的加载时间”列为最大的新功能。不太肯定老的那个HTML文件的尺寸是多少, 但如果能比较一下就太有趣了。

更新: Some of you may be interested to know that folks from the MSN team have definitely seen this page, and are aware of the feedback, compliments, and criticism. See Venkat’s comment below for more info, and a link to a new MSDN blog where Venkat provides a few thoughts and asks for feedback.

原文 Posted at 11:00pm in CSS, Web

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有