Skip to content

WP原创主题 | 愿望盒子V1

2013-05-12

Loading...

好久没有写博客了,四月,五月又过去了一个月,用一个字来形容我的这两个月,就是「忙」。

如果你有关注我的博客,那你肯定知道我又跳票了。凌晨四点写这个文章,也当是主题第一时间的发布,也当作是自己的一次深夜的一次独白和吐槽。

如果你是直接访问我的博客,你可以发现我终于换新主题了,也就是今天发布的愿望盒子(Will-Box-One)。

Why box?

为什么叫愿望盒子(will-box),好吧,其实我也不知道怎么解释,是随便取的,我名字中两个L,英文名叫will,刚好这个主题是瀑布流的形式,然后瀑布流元素的命名id中有个box,那就叫will-box吧,就是这样,至于你信不信,请右键审查元素。

功能

本主题基于HTML5基础主题Bones( https://themble.com/bones/ )而成(其实这也算是一个html5主题:自己特别注意了语义化写结构)。

采用最流行的前端模板 html5 Boilerplate,响应式布局,CSS用LESS写的(另支持SASS),图标使用的是一淘UX团队的icon-font,内置 jquery, mansory, normailze.css等

1.瀑布流+readability:

做主题之前,自己看了不少国内外的网站和主题,尤其是留意收集了不少今年流行的采用扁平化设计( Flat UI design)的网站,最终采用瀑布流的形式。有人说博客不适合用瀑布流,博客不适合用瀑布流,那是因为没设计好样式和排版,用fashion点的说法就是「用户体验不行」。

有句话叫做

A picture is worth a thousand words 一画胜千言

当读者面对屏幕、平面的时候,人眼总是首先被图片吸引,以移动端的阅读类、新闻类的app为例,国内的如Zaker,国外的如Feedly,均采用了「图+简介」的配图模式,一张贴切内容的配图,能提高读者对博文内容的识别度。本主题使用的是大字体,留白较多,将读者的视觉中心集中在内容,而不被其他元素干扰( Content Is King )

2.响应式:

bones这个模板强大之处就是把各个分辨率的响应式框架都打好了,配合LESS来写,真是十分方便,目前就做了针对481px以下(大部分手机设备)的响应式设计,读者在手机等小屏幕终端上也有不错的阅读体验(不用你再两只手放大,拖啊拖了)

目前(2013年5月13日凌晨4点30)还欠缺的是顶部下拉菜单的响应式设计。

3.定制功能

a.自动访客统计:内置博文访问统计功能(目前发现是与post-views插件有冲突),若使用本主题,请先停止使用post-views插件。

b.分页导航:加强了页面导航。

c.后台设置meta keywords和description(不用自己改源代码了)

d.后台设置社交媒体链接

e.优化:删除了head一堆无用的请求,优化了加载速度,其他大家可以自己看function文件。

下载

https://github.com/foru17/will-box

问题&bug&To-Do

2013.5.13

1.顶部菜单响应式

2.底部第三栏放什么功能呢?

3.细节的h2~h6标签样式设置

4.第三方插件(多说、无觅)的样式兼容。

5.时光机Timeline页面design:框架写好了,css还没写。

生活随谈

反正都这么晚了,这周在图书馆呆了好多天,基本是中午去(不好意思我现在都是中午才起来),闭馆才回,每天10+h呆在图书馆,code+看书,不断地接触前端的各种技术,顺便补基础。

上个月的腾讯实习生,面试被刷,前端观察的博主神飞是我的面试官,第一次笔试,第一次技术面,结果都谈不上遗憾,自己的差距在那里,一起去面试的人有不少强人,用朋友的话来说「腾讯又不是收容站」,自己也的确看到了自己的差距,一是基础差,二是项目经历。

有了几位面试官的点评和鼓励,自己倒也是清晰了不少未来这半年和一年的规划,「沉下来&深进去」。

最近实践了CSS预处理技术LESS(也学习了SASS和styuls),接触了Yeoman,感慨下怎么不早点发现这些东西(这就是我的差距!)生产力效率神器,另外继续学习node.js和php,愈发觉得code好爽(每次去图书馆人就自high在code码海中了)。另外朋友介绍了一份实习工作,可惜后来由于时间和距离原因,抽不开身只能拒绝了。

五月,尝试做个webapp,利用微信api写一个简单的应用,本有一个商业项目,考虑到自己的时间,要不要挑战一下自己呢?