上线以来，常常都有人通过Email或微博问我："你的网站是怎么做出来的？"，这样的问题，还真不是三言两语就能说清楚的，希望这篇博文能够提供一些答案吧。
某一天的搜索引擎入口记录里，还见到了这样的关键词
我有个习惯，做网站到每一个关键点时都会截图留念，所以现在将所有图片贴在一起就可以展示出一个比较连续的建设过程。
基本构想→设计规划→框架构建→优化文字→细节粗调→Retina处理→响应式处理→动画制作→细节微调→回迁上线→离线缓存和WebApp→多语言版本
解析测试版域名，挂一个简单的页面测试
引入Bootstrap，测试
研究了一下Bootstrap的文档，做出了大概的框架，开始做地图的部份
这一步把所有的元素都摆到位，实现各元素基本的功能。
逐步录入地图的坐标点数据
坐标点数据录入完成，简单做一下完善地图的细节
给header换个背景看看
用简单的文字先拼出各个模块大概的样子
当时的记事本草稿
Retina也就算高清视网膜屏幕的支持，作为一个"果粉"，这点当然不能放过。技术方面，我先试用了一些jQueryRetina插件，但普遍都有加载速度慢的问题。看来还是不能偷懒，只有自己写。思路是用JavaScript检测devicePixelRatio，若是Retina屏幕就将值写入Cookie，然后刷新页面，再用PHP读取该Cookie，输出对应的图片（高清或普通）。在Retina的MacbookPro上测试还遇到了各种各样的奇葩问题，逐个修复后最终效果确实不错。后来发现iPhone等小屏幕Retina设备不需要使用针对RetinaMacbook/iPad制作的大尺寸图片，只要将普通尺寸的图片缩小即可，所以再给JS增加了检测screenwidth，PHP再做相应的调整，提高了小屏幕Retina设备的加载速度。
其实我在响应式设计开始流行之前，就已经在试着应用了，到现在可以说已经比较熟悉了，所以没有遇到太多技术问题。
有一些略为浮夸的设计也换掉了，比如下面这两个就是被换掉的头像彩色阴影和Apple模块的角标
测试完成，从测试服务器迁回主服务器，解析域名。把网站发给身处各地、使用不同网络的朋友们测试。
其实，理论上只要能进行文本编辑的软件都可以用作网站开发。我以前是用Windows/Mac自带的记事本，简简单单，没有复杂的功能，没有代码提示器也养成了我写代码比较严谨的习惯。后来做的网站程序类的代码多了，记事本就有点不太够用了，就开始用OfficeFrontPage，至少代码能上色和纠错了。后来在Mac上用Dreamweaver习惯之后，在PC上也开始用了，但也很少用那些高级功能，最喜欢它的一点就是可以把编辑器调成黑色背景，保护视力。
曾经主页上的地图里没有中国台湾，后来考虑到这个原本用地图为背景的模块、仅用于标示我旅行足迹的"地图"会刺激一部分爱国人士的神经，还是把宝岛台湾加上去了。
惭愧惭愧，我也希望能再大一点。但这个还是假不了的，我又不是天一，嘿嘿嘿。