评论功能修复 2 条评论

刚刚发现 Blog 的评论功能不能用了，提交后一直显示等待。查了一下，发现是 GFW 的问题。

自 5 月 16 日，Blogger 及托管站 BlogSpot 再次被封，导致域名 blogger.com 以及 blogspot.com 全部无法访问。而我的评论系统，是靠通过 Blogger 的 Feed 地址，由 AJAX 和 Blogger 之间通讯实现读取；由 AJAX 直接向 Blogger 的评论表单处理 URL 发送 POST 请求实现提交。这两项功能都是基于 www.blogger.com 域名的。前者所用的 Feed 地址由于先前早已被封，并通过朋友在 DreamHost 的主机上放了一个 PHP 的中转程序，所以评论列表功能一直可以用，但是评论提交是直接 POST 的，www.blogger.com 被封，所以评论自然就失败了。

没办法，刚刚改进了一下我的 HTTP 中转程序，实现了 POST 的功能，现在评论功能已经修复了。只是整个数据流程要经历“本地网页 » blog.windia.net » DreamHost » www.blogger.com » DreamHost » blog.windia.net » 本地”这样漫长的路径，因此提交评论可能需要数十秒的时间，但聊胜于无吧。希望 GFW 早日放过 Blogger，这样功能就能完全恢复正常了。

另外，修改了一下模板，把 blogger.com 上引用的 CSS 以及 JS 文件的地址都改由 DreamHost 上的 HTTP 中转读取，这样在打开 Blog 页面时，浏览器不用再等待这些文件的 HTTP 请求超时，速度应该能快不少。

挑战 XHTML 的 Strict 标准 2 条评论

我的 Blog 网页在 Doctype 声明上一直使用的是 XHTML 的 Strict 标准，当初在模板制作完成时是校验过的，可是随着后来无数次的修改、内容添加，现在已经不能通过 W3C 的语法校验了，加上 Google Blogger 在发布页面的时候似乎也并没有考虑目标模板的 Doctype 标准，也部分导致校验的失败。

经过一个下午的努力，终于基本上解决了所有 XHTML 的语法问题，总结如下。

<a> 标签没有 target 属性

<img> 标签必须添加 alt 属性

<img> 标签没有 border 属性

<blockquote> 标签内必须使用 block 级别的标签

不能使用 <embed> 标签

实体用法问题

重复的 id 值

另外，Blogger 提供的模板中，backlinks 那一部分会导致 4 个不同类别的问题。凭心而论，Blogger 模板在 backlinks 这一块的代码实在写的很烂，用了三个不同的 js 文件，用 JavaScript 输出 CSS，不但使得不同模板之间难以更改这一部分显示的样式，也导致了很多 XHTML 的语法校验问题。例如 Blogger 自己的 Buzz，打开任一个文章的独立页面的源代码，Doctype 声明赫然是 XHTML 1.0 Strict，然而 backlink 那一块的代码不用校验也能看出漏洞百出。

Blogger 目前版本的网站出自著名设计师 Douglas Bowman 之手，其本人对 XHTML 以及 CSS 有着非常深刻的研究。在设计之初，Blogger 还没有 Backlinks 的功能，显然这个蹩脚的 Backlinks 是后来由其他人加上去的。不知道 Bowman 先生在看到这一幕后会做何感想。

Google 黑板报用的是同样的 backlink 代码，不过比 Buzz 知趣的是它的模板干脆去掉了 Doctype 声明。只不过作为 Google 旗下的网站，页面连 Doctype 声明都没有，也是一件汗颜的事情。

言归正传，以下列出 backlink 这部分代码导致的问题以及解决方法。

<div> 和 <dl> 之间的嵌套问题

<script> 标签的 defer 属性

<noscript> 内只能用 block 级别标签

模板占位符问题

最后，Google 黑板报最近也发布了一篇关于互联网标准性的文章，这篇文章也提供了很多关于改进网站 HTML 代码的参考信息。

微软将强制将浏览器升级到 IE7 0 条评论

在 Solidot 上看到，InfoWorld 的报道称，微软将在 2 月 12 日通 Windows Server Update Services 把所有 Windows 系统的浏览器强制升级到 IE7，不会像以前那样要经过用户的许可。微软给出的理由是“安全原因”。

Solidot 上还调侃说，对 WEB 开发者来说这是个好消息；对以前只支持 IE6 的网站来说，这是场灾难。

此话不假。以前做 WEB 界面，在所有为浏览器兼容性付出的工作中，50% 的时间花在让 IE 和 FireFox 兼容，另外 50% 的时间花在让 IE 的不同版本之间兼容。作为同一个公司推出的同一系列产品，对一种有标准的文档的理解会有如此大的差异，真的可以说是一件让人费解的事情。不过现在微软终于醒悟了，既然事实已经造成，那就让糟糕的过去都消失掉吧……

Firefox 的 JavaScript 问题两则 1 条评论

今天发现页面上新加上的左列 Tag 在 Firefox 上显示不正确，在细察之下，发现 Firefox 在 JavaScript / CSS 上和 IE 不同之处：

问题 1. 类似 obj.style.height = imgObj.height 的语句无效。

即将一个 image 对象的高度值赋给另一个对象，用来修改其样式高度，这样做无效。

分析

要理解这个问题，首先要纠正思想上的一个误区。以上这个操作，其实并非是通常编程概念上的将一个 int 值赋给另一个 int 变量。这个语句的操作，实际上是把 imageObj.height 当作一个字符串，作为 obj 这个对象 CSS 中 height 的属性。

而之前的一篇帖子说过，Firefox 对 CSS 的理解非常严格，任何表示大小的值，数字后面必须跟上单位，除非是 0。也就是说，height: 20 对于 Firefox 来讲不具有任何意义，必须写成 height: 20px 才会被接受。所以，在 JavaScript 中，为了让对 CSS 的 height 值的设置有效，所赋给的字符串也同样必须是数量加上单位。

解决

以上语句，应该写成：

obj.style.height = imgObj.height + 'px';

IE, Opera 和 Mozilla Firefox 2 条评论

为了验证 tableless layout 版面的浏览器兼容性，特地找来了时下流行的 Opera 8.5 和 Mozilla Firefox 1.0.7 与 微软的 Internet Explorer 6.0 一起测试，结果是倍受打击……

原来以为基本上不用改就能兼容，因为完全没有用 table 排版，结果在这两个非 IE 的浏览器上，页面虽然没有面目全非，但是也不如在 IE 上显示的完整，而且有些地方莫名奇妙的怎么都设置不正确。花了 4 个小时，经过反复的和 stopdesign 网站样式表的比对，最后发现原因有两点：

So We've Got A New Face Here! 0 条评论

上次翻译了那篇倡导 tableless layout 的文章后，心里头就一直想着尝试一下。所以今天响应这个号召，在坚决不用 table 的原则下，把面孔改成了这个样子。实际没有什么设计的成分，主要是尝试对 CSS 的利用。结果是完全实现了原来必须要用 table 才能完成的版面，还是有点成就感。另外，今天还大概看了一下 CSS 2.0 的参考，突然发现了 CSS 很多以前不知道的却很实用的功能，尤其是，居然可以让溢出容器的文字串自动省略并以“...”结尾；以前这个功能需要用服务端程序来实现，而且还挺麻烦的……

Throwing Tables Out the Window 0 条评论

这是一篇翻译自 blogger.com 的新版网站界面设计者 stop design 网站的文章，如果对原文感兴趣，可以访问 Douglas Bowman 的英文原著。

如果您对本译文有任何疑问或者意见，请直接对本 blog 文章发表评论，或者给我发送电子邮件。

文章摘要

很多网站已经对 CSS 这片海洋进行了深入充分的测试，现在我们从水底开始欢呼的时候到了，让我们奉劝并鼓励那些还没有跳下水来的人，赶紧加入我们的行列。现在已经没有任何理由继续用表格来排版，也没有理由为不同的浏览器维护同一个网站的多个版本。赶快把表格扔掉吧，相信我们，你不再需要它们了！（译文：巴西葡萄牙语，丹麦语，法语，德语，意大利语，日语，西班牙语和土耳其语）