Bachue's Blog

首先，很高兴Ubuntu新字体进入Google Font Directory（详细），Ubuntu这字体真的很漂亮，可以说是Ubuntu 10.10的最大亮点了。而这个字体进入Google Font Directory意味着我可以用云字体的方法使每一个进入本博客的观众都看到这个字体(还意味着可以从本博客中下载该字体)，不管客户端本身是否真的装有这个字体。额..这字体在XP下好像有点糟糕，特别是没开ClearType的XP，全是锯齿。唉，这只能说XP本身的字体渲染太烂，我以前一度以为XP字体全是点阵字体呢，怎么看都感觉不像是TrueType！

我自认为本博客在非XP的PC上看起来还是不错的，符合我自己的审美观吧，但是在手机上却不是这么回事，我的手机是多普达S900，Windows Mobile 6.1操作系统，安装浏览器Opera Mini 5.1。

手机浏览本博客时存在两个严重的问题，第一，打开博客率先看到的是搜索框，分类等一点不重要的内容，而真正的主体部分却被挤到了下面（代码功能也有同样的问题，代码被行号挤到了下面）。这个问题不仅仅存在于手机，把PC的浏览器的宽度缩小到一定尺寸，也一样如此，有时候看上去右边一大块空白，还以为没有正常显示呢。事实上，很多博客都是这样，本博客并非特例，究其原因，是在写HTML的时候，边栏的DOM安排在前面并使用了float:left;导致。解决的方法很简单，把文章的DOM安排在前面，使用float:right;即可，或是干脆把边栏安排到右边去，这样浏览器宽度缩小时被挤下去的就是边栏了。很可惜，虽然知道解决方法却不能做这种修改，因为博客系统的HTML是定死的，不能改。当然，也可以考虑换个主题，有些主题的边栏是在右边的，不过我蛮喜欢现在这个主题，不想改。也可以考虑用Javascript来更换DOM的位置，但是我的Opera Mini几乎不支持Javascript，改了也没用。所以我干脆做了些小动作，上传了一个smallscreen.css的文件，记下他的路径，在博客的header里增加一个标签，这个标签能使得博客宽度在小于900px的时候使用smallscreen.css，反之则不使用（具体实现可见本博客HTML源码）。这个技巧是在看今年的Google IO大会时一个人在讲Dreamweaver对HTML5支持的时候学的，很有用，而且大部分浏览器支持，要想让网页对非PC平台做特别支持，用这招会非常imba。至于smallscreen.css的内容，其实就是把边栏隐藏了。额，我认为不太会有人在用手机浏览本博客的时候对搜索框和分类感兴趣吧。

另外一个严重的问题是，本博客的部分文章实在是太长了，比方说《HTML5设计原理》，用鼠标滚轮滚也可以滚好长时间，《从jQuery中剥离出$.ajax函数》，整整700行代码啊。在手机上，特别是在Opera Mini（没有滚动条）上看本博客的主页，简直是受罪，就为了瞥一眼下一篇文章的标题，不断的滚啊滚，茫茫多的字，根本看不到个尽头，嗯，用户确实可以考虑下是否该取消今天的晚餐了。把整篇文章不加限制的放在主页上，有方便之处，无需用户点击就能看完全文，但是如果文章实在太长，还是来点部分摘要吧。不过我看遍了博客系统的设置，也没能找到类似的设置。想通过smallscreen.css来解决吧，也想不到个好些的策略，没有CSS3，没有Javascript，没有滚动条，怎么才能缩减文章的长度呢，我也想不到了。

我是第一次不加修改的转发整篇文章，其实我也可以给个链接了事，或是按照我过去的性格，绝不不加修改的转发文章。但我今天还是转了，主要目的其实是告诫我自己，要充分重视“设计原理”，虽然我们什么事都讲“原理”，但是只有“设计原理”才能真正表现原作者的思想精髓，才是“原理”中的精华所在。写代码重视实践固然是好，但如果不摸透思想，所学习的一切技术终究只能是皮毛。

思想决定行为，行为决定习惯，习惯决定性格，性格决定命运。       ——这句话我很喜欢

HTML5设计原理 - Jeremy Keith在Fronteers 2010上的主题演讲

今天我想跟大家谈一谈HTML5的设计。主要分两个方面：一方面，当然了，就是HTML5。我可以站在这儿只讲HTML5，但我并不打算这样做，因为如果你想了解HTML5的话，你可以Google，可以看书，甚至可以看规范。

 

实际上，确实有人会谈到规范的内容。史蒂夫·福克纳（Steve Faulkner）会讲HTML5与可访问性。而保罗·艾里什（Paul Irish）则会讲HTML5提供的各种API。因此，我今天站在这里，不会光讲一讲HTML5就算完事了。

 

说老实话，在正式开始之前，我想先交待清楚我所说的HTML5到底是什么意思。这话听起来有点搞笑：这会子你一直在说HTML5，难道我们还不知道 什么是HTML5吗？大家知道，有一个规范，它的名字叫HTML5。我所说的HTML5，指的就是这个规范。但问题是，有些人所说的HTML5，指的不仅 仅是这个规范，还有别的意思。比如说，用HTML5来代指CSS3就是一种常见的叫法。我可不是这样的。我所说的HTML5，不包含CSS3，就是 HTML5。

 

类似的术语问题以前也有过。Ajax本来是一种含义明确的技术，但过了不久，它的含义就变成了“用JavaScript来做一切好玩的东西”。这就 是Ajax，对不对？今天，HTML5也面临同样的问题，它本来指的是一个特定的规范，但如今含义却成了“在Web上做一切好玩的事。”我说的不是这种 HTML5，不是这种涵盖了最近刚刚出现的各种新东东的HTML5。我说的仅仅是规范本身：HTML5。

 

刚才已经说了，我今天想要讲的内容不多，也没有打算介绍HTML5都包含什么。今天我要讲的是它的另一方面，即HTML5的设计。换句话说，我要讲的不是规范里都包含什么，而是规范里为什么会包含它们，以及在设计这个规范的时候，设计者们是怎么看待这些东西的。