最近在看 JavaScript 的一些基础知识，其中包括 bookmarklet 的相关资料。用 bookmarklet 创建 web 安全颜色表格是 bookmarklet 的一个应用，而且在以后的 web 配色中也可以当作参考。先解释两个概念吧。
什么是 Bookmarklet？
Bookmarklet 是在浏览器中的一种特殊的书签，或者用 IE 的叫法—“收藏夹”。一般的书签都是调用外部 URL，而它不同，它是对浏览器的 JavaScript 解释器的调用，执行指定的 JavaScript 程序。使用 bookmarklet 可以实现很多有用、有趣的功能，使浏览器成为更好用的工具。
Bookmarklet 的格式为 javascript:[code]，即一个 JavaScript 伪协议限定符 + JavaScript 代码。最简单的例子当然还是 Hello World：
javascript:alert ('Hello World!');
一般来说，bookmarklet 都放在页面的 <a> 标签中，例如 <a href="javascript:alert ('Hello World!');">Hello World</a> （Hello World）。一些有用的 bookmarklet 可以放在浏览器的书签中，新建书签的时候把 <a> 标签的 href 属性值塞进书签的地址中就可以了。
什么是 Web 安全颜色？
在远古时代，很多显示器都只支持256种颜色。除去 Windows 和 Mac 操作系统的40种保留颜色，还剩下216种颜色，它们是可以保证能够被正确显示的颜色，这216种颜色就叫 Web 安全颜色。
尽管现在显示器已经可以显示数百万种颜色，但是这216种 Web 安全颜色仍然是最经典的颜色，能保证所有的计算机在256色下运行时能够正确显示。
代码
用 bookmarklet 创建 web 安全颜色表格的代码如下：
javascript:
var i,j,k,l,t='<table width=800px>',c=new Array('00','33','66','99','CC','FF');
for(i=0;i<6;i++){
for(j=0;j<6;j++){
t+='<tr>';
for(k=0;k<6;k++){
l=c[i]+c[j]+c[k];
t+= j<3?
'<td height=30px bgcolor=#'+l+'><font color=white>#'+l+'</font></td>':
'<td height=30px bgcolor=#'+l+'>#'+l+'</td>'
}
t+='</tr>'
}
}
void(document.body.innerHTML=t+'</table>')
点击这里看演示（有点不爽的是不能通过后退回到上一个页面，只能刷新）
考虑到简便，以上的代码使用了很多 bgcolor、font 等非法的属性和标签，不符合 XHTML 标准。不过写页面 XHTML 代码的时候可不能这样哦，呵呵。
今天放了一个 CSSTidy 在我的 blog 空间上，方便自己的同时也方便其他需要用的朋友。访问地址：CSS整形与优化工具（使用CSSTidy1.3）。
CSSTidy 简介
CSSTidy 是一个开源的 CSS 整形和优化工具。它既有适用于 Windows、Linux 和 OSX 的客户端程序，也有基于 PHP 的 Web 版。CSSTidy 完全支持 CSS2。
优化特性（以下“a”表示选择器，“margin”表示所有的属性）：
- 类似“black”或者 rgb(0,0,0) 这样的颜色值被转换为 #000000，甚至 #000（如果可以的话）。而已经是十六进制码的颜色值将会被转换为颜色名（如果颜色名更短的话），例如 #f00 会被转换为 red
- 所有重复定义的属性都被合并。例如 a{property:x;property:y;} 被转换为 a{property:y;}
- 能够简写的都被简写。例如 margin:1px 1px 1px 1px; 简写为 margin:1px;
- 属性值为0的去掉单位。例如 margin:0px; 简写为 margin:0;
- 按照上右下左的顺序简写。例如 a{margin-top:10px; margin-bottom:10px; margin-left:10px; margin-right:10px;} 简写为 a{margin:10px;}
- 数值处理，去掉多余的数位。例如 margin:010.0px; 简写为 margin:10px;
- 根据选择的压缩程度删除多余的空格或换行符
- 合并 background 属性
- 删除所有注释
- 删除每个区块中最后一行的分号
- 添加缺失的分号或单位，修正不正确的换行或颜色值
- property:value ! important; 简写为 property:value !important;（删除了!与important之间的空格）
为什么要优化 CSS？
优化 CSS 有利于加速页面载入和降低流量成本，这对网站和用户都有好处。何乐而不为？
压缩比
压缩比的大小很大程度上取决于你选择的删除空白的程度。一般来说，使用标准的空白删除（兼顾代码的可读性）可使压缩比达到30%以上。当然，如果你的 CSS 代码中本身就有很多空白，压缩比将会更高。
除了压缩还有什么
如果压缩对你来说不是很重要，你也可以用 CSSTidy 来对 CSS 进行整形或修复。除了4种默认的模板，你还可以使用自定义的模板对 CSS 代码整形。结构良好、一目了然的 CSS 代码对日后的维护是非常有利的。
下个学期即将找工作，该好好学习一下了，暂且列一个小计划以作督促。
至于以后的工作方向，我把自己定位于 Web 前端开发。对于这个定位我考虑过很久，对 Web 前端技术的浓厚兴趣，是我做出这个选择最主要的原因，也是最大的学习动力所在；而且我认为一个具体的定位会让自己学习方向更加专一。希望经过一段时间的学习，使我的能力得到一定的提高，将来能找到满意的工作。
具体的计划如下（优先级从高到低）：
1、JavaScript
目前在读《JavaScript 权威指南》和《Ajax 实战》，读完之后准备继续读《JavaScript 高级程序设计》和 Realazy 翻译的《精通 JavaScript》。学习目标是深入理解 JavaScript 的各种基本特性，包括对象的构建、继承、闭包等等。
若除书读完还有多余时间，准备学习 prototype 和 jQuery 等框架的源代码。
2、程序设计和算法
《数据结构》以前只是粗略地看过，现在必须认真学习，貌似在计算机类招聘的笔试和面试中数据结构是最常考的。尽管比较头大，但是不学不行啊（莫非这是此生最后一次应试学习？呵呵）不过在数据结构中确实能学到很多东西。
Java：我认为一个前端开发人员必须至少熟悉一种服务器端语言，Java 我也学了不短的时间了，需要复习一下。
如果还有多余的时间，简要看一下设计模式。
3、其他
CSS：暂时不读此方面的书了，主要是平时在互联网上看一看，重点还是放在 JS 上。
Web 标准：同上，主要还是从理念上深化 Web 语义化、可访问性等概念。
英语：不用多说了，一辈子都在学。
————分割线————
如果还有什么疏忽遗漏的地方，请各位朋友指教。回过头一看，感觉任务好重啊，尽量努力吧，为自己加油。
这是在 CSS Globe 上看到的一篇文章，个人感觉对理解 Web 标准和 Web 开发（尤其是前端开发）很有启发意义，特翻译分享，并加入了一些我的想法。原文地址：5 Most Common Web Standards Misconceptions。
当开始学习 Web 标准的时候，我们会听到很多关于 Web 标准的理论，这些理论不一定都是正确的，有些反而可能会误导我们。下面是一些最常见的误解。
1、Web 标准 = Validation（验证）
W3C 提供的 XHTML 标记验证和 CSS 验证对学习 Web 标准和 Web 开发是很重要的，它不但能够指出代码中的错误，还能让我们学会怎样去改正错误。但是，仅仅通过验证并不意味着你的页面符合 Web 标准。我曾经把 W3C 的验证服务和英语拼写检查工具做过比较。如果你在拼写检查工具中输入这样一个句子：
Dog fox brown lazy over jump.
拼写检查工具并不会发现任何错误，因为单词拼写全是正确的。但是，这句话有意义吗？当你没有为你的页面逻辑结构使用合适的 HTML 元素时，不正和上面的那个例子一样吗？机器就是机器，它可以检测出你的语法、属性、嵌套等的正误，但是它无法了解你要表达的内容的本质。这就是 Web 语义化（semantic）的重要性。
2、Web 标准 = CSS
CSS 是一种样式单，它是一个让页面看起来更加美观的（强大的）工具，而且，CSS 也是 Web 标准的一个重要部分。但是，看看那些基于表格布局，tr、td 等标记层层嵌套如同噩梦一般的页面，你会发现它们也在通过各种方法使用着 CSS，那么，这些页面符合 Web 标准吗？
Web 标准并不只是技术，当然更不只是 CSS，而是你怎样去使用它。一个相对标准的页面，即使剥离了 CSS，它仍然应该是可读的，层次结构清晰的。
3、Web 标准 = No Tables
当从表格布局转变到 CSS 布局之后，很多开发者开始拒绝在任何情况下使用表格，他们认为“Tables are evil”。
对我来说，没有任何一个 HTML 元素是 evil 的。它们是被一群非常聪明的人发明的，每一个元素都有它的目的和存在的意义。什么时候应该使用表格，这又涉及到了 Web 语义化的问题，如果你要在页面中显示表格数据（比如日历表、统计表等），那么，表格就是你的最佳选择。
4、Web 标准 = Divs
过度使用 div，是在刚从表格布局转变到 CSS 布局的开发者中很常见的问题，我曾经也经历过。我们经常可以看到这种说法：“div+css布局”，似乎使用了 div 就是好的，就是符合 Web 标准的。实际上有些时候，你只是简单地使用 div 代替了表格，仅此而已。你最终得到的还是复杂的、难以读懂的、层层叠叠的标记，就像以前一样，只是 div 代替了以前的 table、tr、td，并且把 CSS 文件增大了几倍而已。
你需要改变的不仅仅是在页面中充当容器的元素，而是整体的结构和理念。符合 Web 标准需要走一条很长的路，好在这条路是充满阳光的，我愿意走下去。
5、Web 标准 = No IE
我知道你很可能和我一样痛恨 IE，但是，Web 标准的观点是实现跨平台、跨浏览器的页面访问，更重要的是，大多数用户都在使用 IE。因此，我们不能抛弃 IE，尽管它不是一个符合标准的浏览器。
所以，不要在开发中忽视 IE 下的调试，因为毫无疑问会有用户在使用 IE，你迟早都必须面对它。骂完 IE 以后，还是好好想想怎么对付它吧。
从总统博客得知，今天（2008年4月9日）是第三届 CSS 裸奔节，这里是中文版介绍。
CSS 裸奔，顾名思义，就是把网页中的 CSS 移除，把页面最原始的表现呈现在访问者面前。这个活动意在推动 Web 标准，倡导使用结构良好、语义明确的 XHTML 构建网页。这样的网页，即便没有 CSS 的支持，层次结构依然清晰明了，只是欠缺美观。
从现在开始，我也开始参与 CSS 裸奔了，除了少数插件的 CSS 不方便移除之外，主体的 CSS 都移除了。网站原形毕露，看起来另有一番滋味吧。活动持续一天，明天即将恢复原状。