在Github Pages上写博客快三年了，为文章添加标签一直是一件困难的事情。 由于Harttle一直在Unix+Vim做开发和写博客， 所以写了一个『Bash脚本』来为文章生成标签列表， 并为Jekyll项目写了一点『Vim插件』，以便在编辑文章时一键生成标签。
并不是所有人都有这样的困惑。对我来讲Jekyll最不方便之处就是『为文章添加标签』。 原因有二：
既然这件事情一定要自动化，那么用怎样的逻辑生成标签呢？ 想到提取标签，第一印象便是统计词频。 然而词频最高的词语往往是语言表述相关的东西，但它们不是文章的重点。 下面将会看到我们需要一个标签库、一个Bash脚本、再加一个Vim插件。
最近发现 HarttleLand 的 Git 仓库 已经达到了 142M，严重影响 Fork 和 Clone。
今晨 Harttle 从 Git 记录中定位了数百个大文件并将其删除，现在仓库恢复了 27M 的大小。
借此机会，本文来介绍查找和重写 Git 记录的命令：git rev-list, git filter-branch。
本文用于学习用途，生产环境请考虑使用 bfg 等效率工具（感谢 oott123 的评论）。
表格是HTML中用来显示比较密集的信息，在HTML早期就有支持。
表格的HTML标记较其他元素复杂很多，浏览器也为<table>标签提供了不少默认样式，
所以表格的排版行为也较为复杂。
本文讨论了表格的边框模型，以及如何利用CSS3设置条纹样式和视觉反馈。
导航栏是 Web 中常用的 UI 组件，在 Bootstrap 等 CSS 框架中基本都会提供。 既然导航栏这么重要，下面我们便来手动实现一个导航栏。 这个过程还是需要掌握一些排版技巧和 CSS3 特性的。
导航栏通常使用 <ul> 来标记：
<ul>
<li><a>First Item</a></li>
<li><a>Second Item</a></li>
<li class="active"><a>Third Item</a></li>
<li><a>Fourth Item</a></li>
</ul>
首先便要去掉列表的那些默认样式，比如左边的项目标记（小圆点）和边距：
ul {
left-margin: 0; /* IE/Opera 默认使用外边距 */
left-padding: 0; /* Safari/Firefox 默认使用内边距 */
list-style-type: none; /* 左侧项目标记 */
}
这样便去掉了浏览器给 <ul> 设置的默认样式了。
至于如何自定义左侧的项目标记，可参考 那些 CSS 背景图的技巧 一文。
超链接虽然不起眼，但它却是万维网（Web）的基石，它使得用户可以在整个万维网进行导航。 链接的默认样式却很低调，在富有设计感的网站中通常会重写链接的样式。 下文介绍常用的一些链接样式技巧：链接状态选择器、自定义下划线、设置外链样式、按钮的实现等。
超链接标签有很多状态：未访问、已访问、悬停、激活。这些都可以通过CSS伪类选择器来识别。
其中悬停和激活是一般HTML元素都具有的状态，对于链接而言，当鼠标悬停时:hover生效，
点击后:active生效。比如我们设置未访问的链接呈蓝色，已访问的链接呈绿色：
a:link {color: blue;}
a:visited {color: green;}
a:hover, a:active {color: red;}
HTML的精髓在于文本的、结构化的数据格式。 这样的设计使得搜索引擎、屏幕阅读器、文本处理软件能够非常方便地读取信息。 尤其是CSS样式的分离与HTML5语义标签的提出，使得HTML的这一特性更加明显。 然而对于Web设计师，他们需要除文本外更加丰富的表示形式。 幸运的是CSS的分离，使得我们在不添加标记的同时，可以在页面上显示图片。 下面来看看这些有用的CSS背景图技术。
早在2013年，为了方便PKU的Chrome用户连接校内网官，包括Rea和我在内的鸟人团队一起编写了PKUWebmaster。
此后该插件历经了Chrome Notification 的标准化、PKU 网关接口的变化、以及整个Web前端技术的革新，
鸟人团队于近期意识到更新该插件的必要性。现已修复了既有BUG，并重写了设置页面。
2.0版本已经更新在Chrome商店了：
https://chrome.google.com/webstore/detail/pkuwebmaster（北京大学网关插件）/bnlipdfmheddpljigcaaamjpnbhhklkb
如果你希望使用最新的版本，可以下载Github仓库：
https://github.com/pku-birdmen/pkuwebmaster
并将src目录拖动至Chrome的『扩展程序』页面即可。