该网站基于JavaScript和AJAX技术，超级酷。
http://www.michaelv.org/

那些有关 CSS 的前卫实验 

几个月前，作者在 Six Revisions 发表了一篇文章，介绍了 5 个有趣的 CSS 实验：

• CSS3 Transforms & @font-face Experiment
• CSS Posters
• Pure CSS Line Graph
• CSS3 Leopard-style Stacks
• Pure CSS Twitter Fail Whale

每个实验都是用了不同的方法，其中一些，如 CSS 线图，在现实中可以找到实际的应用，其它的，如 CSS 实现的 Twitter Fail Whale 图画，则纯属实验，这些实验的目的仅仅为了说明 CSS 能够实现的效果，并不意味着应当这样来做。

让我们实际一点 


上图是用纯 CSS 实现的社会媒体网络标志，很神奇不是？

我最近读了 Faruk Ateş 的文章，Pure CSS Icons: Make The Madness Stop，文中对这一做法提出了质疑，作者表示，一些人开始尝试将 CSS 当作设计工具并迅速引发大量效仿，然而，这种做法有多少易用性可言？它并不容易集成到你的设计与开发当中，也不容易调整。

就像上面的完全基于 CSS 的社会网络标志，无非是一堆各式各样的线条的组合，固然令人印象深刻，也算有创意，但并不实用，因为创作这样一个标志可能需要几个小时的艰辛劳动，在 Photoshop 中画一个同样的图根本不费任何力气，而且效果更好（更细腻）。

Ateş 认为，这种方式生成的图标的可维护性也很成问题，调整一个图标原本只需要调整像素，现在却需要修改 CSS 定义，同时，上述 CSS 标志的设计者 Nicolas Gallagher 也表示，做这类事情，CSS 并非最适合。
降低 HTTP 请求？ 


上面这幅图中的图标全部用 CSS 生成，而且作者将它们拿出来卖，40个图标卖25美金。不得不承认，这些图标设计得非常漂亮，作者设计这些 CSS 的初衷是为那些使用的网站降低 HTTP 请求数，因为这些图标不需要额外的图片文件请求。然而，一个小小的图标文件带来的 HTTP 请求真的很值得一提吗，何况，使用 CSS Sprite 技术，这些图标完全可以放在同一个图片中，靠 CSS 定位显示，这样，只需要一个 HTTP 请求就够了。而且，我实在怀疑，这些 CSS 版的图标到底能减少多少带宽。

本着语义化的精神 
必须承认，我有时候会为了实现某种视觉上的需要，而额外使用 DIV 或 SPAN 等标签，这很不语义。然而 CSS 绘图是更不语义的事，CSS 的真实使命是对网页中的内容进行修饰，而不是创建内容本身。网页中的图形本身属于内容的范畴，不应该由 CSS 创建。

本文原文来源：blog.echoenduring.com Are We Taking CSS Too Far? （原文作者：Matt Ward）
中文节译来源：锐商企业CMS 网站内容管理系统 官方网站

A:这是由于笔记本长期使用后，风扇排风口积灰造成的。笔者拆机后发现排风散热片积灰严重，清理后再重新为cpu、显卡和北桥涂上优质散热硅胶后，再用Everest测试后发现降温幅度10°以上，平时使用cpu、显卡稳定在56°和57°，玩游戏分别为64°和66°，效果明显。所以大家的本本如果遇到散热问题，不妨自己或者送到维修部去清理一下。

[CODE=css]filter: DropShadow(Color=#ffffff, OffX=1, OffY=1, Positive=1);[/CODE]

黄章是一个超级玩家型创业者，他被魅族塑造成一个有点像乔布斯的人物，“技术狂人、完美主义者，同时有很强的审美观，固执、专断。”不过，和乔布斯类似，黄章喜欢从用户那里吸取灵感。黄章甚至为了满足用户不计成本，比如，买了一麻袋的耳机海绵套，快递给需要更换的用户。

黄章也很善于借用用户的力量。比如，在M8发布初期，手机上的opera浏览器速度很慢，黄章发帖说opera应该对此负责，结果大批粉丝到opera中国论坛刷屏，迫使opera中国方面表示会改进产品。

但是，魅族M8手机的坎坷经历表明，擅长和用户打交道的公司并不一定意味着是用户体验高手。它不是一个用户体验创新的“好学生”。

M8也许算不上一款失败的手机，但绝对是最有争议的手机。最受争议的部分在用户体验上。在魅族论坛上，关于维修、屏幕失灵、自动关机、信号失灵等的问题投诉充斥着论坛，有用户则直接发帖称，“JW(黄章的论坛ID)给个说法!”

M8失败的地方在技术路线上，魅族采用WinCE增加通讯模块的方式开发智能手机系统。WinCE不是专门为手机做的，稳定性不好，开发难度大，魅族选择从WinCE自己入手开发，对的地方是节省成本，错的地方是低估了开发难度。WinCE的一个超级难题是通话问题难处理，M8就经常出现漏接电话、短信的情况，而上网、QQ、飞信、手机炒股等也都是基于通话(通讯)之上的。M8的替代产品M9采取的是Anriod平台，也等于宣布M8在技术方向上的失败。

魅族在M8上的教训，实际上反映了一个问题：理解用户体验是一回事，把这种理解转化成一种惊艳的体验是另一回事。

M8表明，虽然包裹了一层设计创新的外衣，魅族在用户体验创新上仍处于山寨水准。

对于真正的用户体验创新高手而言，不仅要擅长理解用户，更要善于“蔑视”用户。当然，这里的“蔑视”不是轻视用户，而是对用户需求的一种超越和升华。

乔布斯是一个“蔑视”用户的高手。乔布斯曾说过，“人们通常不知道自己想要什么，除非你秀出产品给他们看。”乔布斯认为，真正正确的是，要弄明白消费者真正想要什么。以苹果的iPod为例，消费者真正需要的不是一款播放器，而是一种音乐体验，乔布斯用iPod+iTunes满足了这种需求，而大部分MP3则被抛弃了。

马云是一个“蔑视”用户的高手。马云曾经说过，“我们相信客户是对的，但大部分时间是错的，他们根本不知道自己在说什么、想什么。”仅仅了解顾客的期望是远远不够的，更高的境界是深入顾客的内心，寻找他内心深处的渴望。发现客户“对”的诉求，剔除掉“错”的诉求。

Facebook创始人扎克伯格也是一个“蔑视”用户的高手。他曾经在公司内部说过，“大多数颠覆性公司不会被用户的意见所左右。”他暗讽那些“听从用户意见的公司很愚蠢”。比如，Facebook的每次改版都会引来大规模抗议，2009年的大改版在第一天就引发了100万用户签名抵制。但是，很多改动依然在众多批评中雷打不动地保留了。后来的结果也表明，扎克伯格的选择是对的，他善于在海量的用户声音中找到正确的方向。

这种“蔑视”的背后，其实有着更为强大的用户体验创新逻辑：

1、不仅要理解用户，更要超越用户的期望和需求。而不是简单的从用户那里寻找答案。　　2、不仅要超越用户，更要提出一流的解决方案。

我们不妨称之为“小马驹法则”，这源于亨利·福特的一句经典语录：“如果我当年去问顾客他们想要什么，他们肯定会告诉我‘一匹更快的马’”。

这是一句极具反讽意义的话，事实上，我们经常被用户误导。当汽车没有出现之前，谁都想要一匹小马驹，小马驹那么漂亮，而且好使。但是，你必须拿出更好的东西纠正他们的想法。

这种“蔑视”功力，其实是用户体验创新高手的必修课。

很多像魅族这样的野蛮生长公司，对用户呕心沥血，奋不顾身，大胆试错，他们其实是中国创造的先锋力量。但是，用户总是那么喜新厌旧，要成为真正的本土杀手，不仅要理解本土，更要提供一流解决方案。不然，就会像很多生猛的本土公司一样，成为创新流星。

打个比方，如果你想用到CSS3中的圆角新特性，你应该使用 border-radius 义他们。但是因为这个特性仍然还没有最终定稿，所以浏览器们只支持他们对应的自己实现的版本。所以 -moz-border-radius 就对应于Mozilla Firefox， 而 -webkit-border-radius 则相对应于Safari和Chrome了。 对于Opera呢？也有自己的版本：-o-border-radius。

特有的前缀都不会验证，这不太理想。对于CSS验证器来说，对浮动环绕的效果而使用了特定的前缀的时候，则应该提出一个建议而不是一个错误。无论如 何，如果你想在你的CSS代码中使用绝对的标准的话，你都应该远离这些特定的前缀。

不过，如果你想玩玩CSS3这个新玩具的话，你就会了解为什么这些特定前缀有很好的理由存在，而为什么你在现阶段也会使用到这些来体验到目前的 CSS3规范的。

让我们继续停留在这个圆角效果的例子上，设想一下假如你只想应用到一个对象的一个角上会产生什么情况。CSS3规范还在继续变化时，Webkit项 目决定使用 –webkit-border-top-right-radius时，Mozilla却使用了 –moz-border-radius-topright。没有这些前缀的话，你将要处理两条不同的CSS规则，而且其中一条是绝对会被永远废弃掉的，但 是仍然有可能会有旧版本的浏览器会使用到。

从纯粹的技术上来说，这两个前缀都是“错误的”，这是好事。将来，最终的规范一定会发布，而只有一种规则会被标准化，那时候所有的浏览器都会实现这 一标准。在这一点上，你可以简单地在你的代码中将特定的前缀删除掉就行了。这些特定的前缀好处就体现出来了，它使得这些代码很容易被找到和删除。

有一件你绝对就应该做的事情就是只针对一个浏览器的前缀。苹果的HTML5展示最近被大家关注，只支 持Safari，而不支持其它实现了HTML5的浏览器[虽然，你可以不 使用Safari 5查看苹果的HTML5演示]，而同时Google也 发布了HTML5展示站点：HTML5Rocks[HTML5在同为使用Webkit内核的Safari和Chrome上支持不同]，这些都证明 了只为一种浏览器做优化不是一个好主意，甚至有人认为HTML5是应用程序 设计中的新冒险。

如果你必须要使用特定的前缀这个非标准化的行为让你感到不安的话，你还有一个办法。那就是使用Javascript来自动完成它。

开发人员阿龙.古斯塔夫森写了一篇“列表的关键文 章”，他在文章里嘲笑了这些特定的前缀并且提供了一段Javascript的替代方案给和他感觉一样的人们。

古斯塔夫森把这些特定的前缀叫做CSS的分支。虽然我们基本上同意他的观点，但是这个“分支”这个词是有问题的，因为分支代码没有任何错误，事实上 这是开源世界中的规范（你在使用Git或者是Mercurial吗？）。而且这些特定前缀并不是分支，它们是在标准化还没有完成的时候推动网络进步的临时 的解决办法。

抛开那些术语之后，古斯塔夫森的观点是有效的——忽略标准和使你的CSS代码只工作在特定的浏览器中的做法两个都是糟糕的主意。

古斯塔夫森的这个小小的Javascript库可以帮助你避免将特定的前缀写进你的CSS中。但是令人印象深刻的是，这个脚本确实做到了与将前缀写 进CSS文件中的一样的效果。这个方法有些缺点——会延长加载时间，而且对于那些禁用了Javascrpt脚本的用户来说，也是无效的。

如果你现在就开始使用CSS3的特性，你将无法避免使用特定的前缀，但是至少，你可以选择如何处理他们。例如：直接在样式表中使用这些前缀、将这些 特定前缀的样式写到单独的分离的文件中或者是使用古斯塔夫森提供的这种类似的脚本来解决它。

供稿：SafariX — Safari中文博客，分享Safari资讯、技巧和扩展。
中文出处：http://safarix.net/dealing-with-browser-differences-in-css-3
英文出处：http://www.webmonkey.com/
 

不管是真火，还是虚火，反正很热闹，很时髦，不管是创业者、消费者，还是投资人，错过就OUT了。于是乎，今天我就来介绍一种可以不花一分钱，不招一个人，办个“团”网的方法——这种方法已经被众多“团”网验证过，屡试不爽，并且，最神奇的是，它适用于任何人，哪怕你是网盲。

 首先你需要准备3000元（很快就能回收），到网上搜一下“团购网站”，你会看到很多卖团购程序的，包安装、包域名、包服务器，交钱之后，马上你就是“团长”了。接下来就是想办法将投入的3000元拿回来——随便发布一个团购信息，什么东西诱人就发什么，比如iPad或者iPhone 4什么的。团购价尽量标低一点，但又别低得任何人都不信。再放上自己的银行账号，或者支付宝账号。

 好了，忙活了半天的你可以去洗个澡、睡个觉。醒来之后，你账上的钱估计远超过3000了。不仅是零成本，一开业可能就有得赚。这就是所谓“姜太公钓鱼，愿者上钩”。至于善后？反正你也是个“光棍团长”，卷起铺盖跑路便是。

 不是我教坏你，确实有很多人就是这么干的，而且比这还夸张。一家叫1288的网站在玩了这种把戏，被大量媒体曝光“构造虚假数字”、“用户交了钱不发货”、“涉嫌诈骗”之后，最后使出了一招绝的——将网站的域名挂了上去，开价5000元，让人哭笑不得。我想这位“团长”是想在被警察叔叔请喝茶之前，上演华丽谢幕剧，或者干脆就是一个黑色幽默。这让我想起了赵本山的“忽悠”系列小品，卖了拐，卖车，接着卖轮椅、卖担架，堪称经典。

实际上，团购网站疯狂的背后，本质原因正是其进入门槛太低，给“空手套白狼”的投机者、不怀好意者带来了可趁之机，让本来很有前途、很有价值的行业变成了骗子泛滥的地方，当参与者的热情被欺骗冷却，换成齐声讨伐，最终的结局可能是——脏水和孩子不得不一起泼掉。当年SP行业的教训还不够深刻么？当中移动无法控制局面时，一纸禁令下来，大家的饭碗都得打翻。

 团购网站在中国的火热源于美国的Groupon，曾经成功拷贝Facebook、Twitter的“互联网山寨之父”王兴第一个将它带到了中国，Groupon的创办者大概不会想到它的中国徒子徒孙们会以这种方式来向它致敬。国人的“山寨”精神确实强大，将B2C（Copy to China）玩到了极致，但真正的“山寨”绝不是欺骗、无序。商业模式可以千变万化，但商业精神却是中外相通。几乎可以肯定，中国的团购网站们，如果不经历一次大清洗，继续将欺骗作为商业模式，必将成为自己的掘墓人。

 对了，我上面说的那个“零成本办个团购网站”的方法，现在用还来得及，再晚我就不保证了。

关于作者

“每周一弹”是陈佼在《电脑报》和cnBeta同步开设的杂评专栏。应广大访客的要求在cnBeta上专栏改名为“每周一蛋疼”
陈佼是互联网独立观察人士，现代计算机杂志社执行副总编。
陈佼微博：http://t.sina.com.cn/joychan

无穷尽的选择


在 Web 开发与设计领域，我们有太多的选择，HTML 还是 XHTML, RSS 还是 Atom, PHP 还是 ASP.NET, SVG 还是 VML, JavaScript 还是 VBS？这样的对决还可以列出很多，然而，它们往往没有固定答案，取决于个人嗜好，在你对各种语言和技术彻底了解之前，你自己也未必有任何清晰的想法。
如何选择


答案是，取决于具体情况。不仅要看站点的类型，还要看你希望涉足的技术深度。本文会将 Web 相关的各种开发与设计语言，按不同的类别进行展示，并注明其复杂程度，流程程度以及浏览器支持程度。值得庆幸的是，任何一门 Web 语言都有很好的文档可以参考。
Web 开发与设计语言的层级


Web 语言按层级分，传统上是这样分的，标记层（HTML），修饰层（CSS），客户端脚本层（JavaScript），服务器端（PHP，ASP.NET）。如果按功用分，参看上图，我们可以将它们分为15层，每个层级代表一种功用，比如用户交互，矢量图等等等。当然，并不是所有用户都需要全部掌握这些不同层级的语言。
标记语言


最常用的 Web 标记语言有四种。
 

• HTML
• XHTML
• XML
• WML (Deprecated)
• Others: MHTML and SGML

Web聚合语言


There are two commonly used syndication languages for content delivery. 最常用的 Web 聚合语言有 Atom 和 RSS 两种。
 

• Atom
• RSS
• Others: EventsML, GeoRSS, MRSS, NewsML, OPML, SportsML and XBEL

元数据定义语言


常见的元数据定义语言有5种。
 

• DCMI
• META (Classic)
• Microformats
• OWL
• RDF
• Others: APML, FOAF, hSlice, OpenService Accelarators, P3P, PICS (Deprecated), SIOC and XFN

式样表与转换语言


常见的有2种。
 

• CSS
• XSL
• Others: DSSSL and JSSS (Deprecated)

客户端脚本


这些脚本语言多数和 JavaScript 有关联。
 

• AJAX (XHR)
• DOM Scripting
• Flex (ActionScript)
• JavaScript
• VBScript
• Others: E4X, ECMAScript, JScript, JScript.NET and WMLScript (Deprecated)

服务器端开发语言


可选的余地很大。
 

• ASP
• ASP.NET
• ColdFusion
• JSP
• Perl
• PHP
• Python
• Ruby On Rails
• Others: Lasso, OpenLaszlo, Smalltalk, SMX, SSI and SSJS

数据库语言


有4种常见数据库脚本语言。
 

• MS-SQL
• mySQL
• Oracle
• PostgreSQL
• Others: Derby, MongoDB and SQLite

插件


这些插件运行在浏览器的沙盒环境中。
 

• ActiveX
• Flash
• Java
• Shockwave
• Silverlight

服务器端配置语言


用于访问管理，服务器端配置，搜索引擎引导等。
 

• .htaccess
• Robots.txt
• Web.config

RIA - 富 Internet 应用


这些技术可以实现桌面化的 Web。
 

• Air
• Gears
• JavaFX
• Prism
• Others: Cappuccino, Curl and Titanium

矢量建模语言


常见的 2D 和 3D 建模与渲染语言有 5 种。
 

• 3DMLW
• Canvas (HTML5)
• SVG
• VML
• X3D
• Others: 3DML, 3DXML, SMIL, UML, VRML and XVRML

PostScript 语言

 

• PDF
• XPS
• Others: FlashPaper and OpenXML

数据格式化语言

 

• DocBook
• KML
• MathML
• OpenSearch
• PAD
• Sitemap
• VoiceXML
• Others: DOAC, DOAP, GML, GraphML, InkML, OpenMath, SISR, SRGS, SSML and XMLTV

文档纲要语言

 

• DTD
• XSD
• Others: DSD, RelaxNG and Schema XML

初学入门者
对于初学入门者，建议遵照下图进行学习，不管如何选择，HTML 是最重要的开端。



译者注：

HTML + CSS + JS 是前段开发必须掌握的三种语言，这毫无争议，即时有，也只是 XHTML 和 HTML 之争，而二者的争议也只限于对语言的严格程度上。PHP 和 MySQL 属于服务器端的开发语言，服务器端的开发语言有更广泛的选项，除了 PHP ， MySQL，还有 ASP.NET，MS SQL，JSP，Ruby 都是可以考虑的选项，关键看你的项目要求。

本文国际来源：sixrevisions.com Web Languages: Decoded （原文作者：Alexander Dawson）

中文翻译来源：锐商企业CMS 网站内容管理系统 官方网站
 

TRSWCM6+skin

按照作者的说法，效果最好的是Webkit系浏览器，包括Safari (4.05)和Chrome (5.0)等，而且眼睛还能动。

效果在其次的是Firefox (3.6)，效果和Safari的一样，但眼睛不能动。

在Opera (10.53) 里，看不到渐变色。

iPhone OS 3.1的Safari里，阿蒙的脸是方的 -_-。

在IE9测试版里，阿蒙的胳膊是方的…强劲的肌肉么？

在IE8里，阿蒙是…方的，很有喜感

在IE7里，惨不忍睹。有点像威震天。

在IE6里…

那么，在使用了Webkit核心的傲游3里，是什么样子？

当当~不但非常漂亮，眼睛还会动~你可以自己去这里测试一下，感谢@jason5ng32把页面接到墙内。