爱主题网站改版更新，采用响应式，支持手机平板访问

本次更新离上一次有一年了，期间也有过更新的想法，可是一直抽不出时间，最近闲下来了就把这事给搞了。这次更新的主要目的就是优化用户体验，所以外观上面没有太大的变动，依然沿用了之前的风格。下面具体来说下有哪些更新吧。

重写全站代码，支持响应式

之前一直觉得我们这种类型的网站是不需要手机访问的，所以一直没做。但是在访问统计里面经常会看到有使用手机访问我们网站的用户，并且现在支持手机访问也是一个趋势，所以决定针对手机访问做一些优化。我们采用了响应式的方案，因为这个是我擅长的，并且不需要维护多套代码。但是支持响应式是需要对网站的代码结构和样式进行很多的调整，于是干脆对整站的主题进行了重写，顺带把主题开发的gulp环境也都搞了一遍。

图片延迟加载

因为开发的时候是在星巴克写的代码，调试的时候发现星巴克的WIFI网速真是不理想，每次都要等个十来秒才能加载完成，看了下加载的页面文件总大小是有3M多，初步分析是图片文件太多导致的，并且为了保证retina屏幕显示清晰，缩略图的尺寸设置的比较大，差不多就是2x图的尺寸吧。为了减少加载文件大小，我将缩略图的尺寸稍微改小了一点，测试后加载时间有了一些提高，页面总大小也低于3M了，但是依然不理想。

图片延迟加载并不是什么新鲜技术，原理就是当打开页面以后，先不加载图片（可以先用一张代图），页面全部加载完了以后，利用js技术判断当前在浏览的图片，然后加载当前浏览的图片。也就是原先打开页面需要加载所有图片，现在打开页面不需要加载图片，当屏幕滚动过去的时候再按需加载。修改完成以后测试加载时间极大提高，首屏加载大小小于1M，并且延迟加载可按需加载，没有滚动到的图片不需要加载，减少流量带宽消耗。

主题信息显示优化

在主题信息显示上也做了一些优化。

原先的主题下载、演示是在文章末尾，需要查看演示的话，需要滚动页面到文章末尾才行，更新后在文章开头也可以直接下载、查看演示了。

主题列表原先已经可以直接查看演示了，此次主要更新了显示的方式，将演示和详情移到下面了，避免遮盖住图片。

主题列表的缩略图尺寸也进行了修改，原先的尺寸会对大部分图片进行裁剪，看到的缩略图总是被裁去了一部分，本次更新针对大部分的缩略图尺寸进行了分析，尽量保证大部分的封面图片不被裁剪。

其他优化

1. 搜索功能优化，页头直接显示搜索框；
2. 文章详情页样式优化；
3. 页脚显示优化；
4. 采用原创Themer框架开发；
5. 更多细节的优化