美文网首页
自我修炼第36天--Anson的博客换了个门面

自我修炼第36天--Anson的博客换了个门面

作者: FF的Anson | 来源:发表于2014-07-07 19:29 被阅读24次

在写今天的文章之前,我想向大家介绍我用来写文章的Markdown工具。Markdown是一款十分轻量的标记语言,它轻量到足以让你可以将写作的注意力就集中在写作上,关于Markdown更加详细的介绍和相关的工具在网上有十分多,搜搜就是了。而我用于写作的Markdown工具是一款webAPP,叫做作业部落Cmd Markdown,无需安装,云保存和同步,你点一下就知道有多好的。今天是作业部落发布第八次更新,也是我的博客的第一次更新。今天就谈谈这次我博客更新的感受和经验。话说两天更新一个博客还真有点慢,差太远了。

题图是我的预设草稿和最终实现的效果,跟预想还是有出入的。这次的更新主要有以下几点:

  • icon由方形换成了圆形;
  • 增加了苹果移动设备上的添加至主屏幕图标;
  • 使用七牛优化了图片,降低了图片的大小,加速了文档的加载加载;
  • 更换了全局版式和文章页版式,删除了主页文章索引上的图片,突出了文章内容;
  • 文章页的导航条可自动隐藏;
  • 使用了层叠字体

因为原来博客的主题是下载下来的,而且没有相应的说明文档,再加上技术上的不熟练,使得在这次这么大动作的优化下,占用了较长的时间。在这次的优化过程中,主要遇到了两个问题:

  1. 元素定位,并在不同浏览器和移动设备上的兼容问题,健壮性不够,如在OX平台上safari和chrome渲染出来的边距有差异,耗费了很多时间在该问题上的调试,最终的解决方案也不够优雅;
  2. 移动设备上的响应布局,在解决该问题上主要用了viewport和media query的方法,在台式设备上适应不同的浏览器视窗大小,meidiaquery应该使用min/max-width,在移动设备上用的是min/max-device-width进行相应的响应布局,并且可以使用zoom进行viewport的缩放。据说froont是一个在线的可视化响应布局神器,下次可以试试使用。

因为我的博客定位就是一个记录和阅读的工具,所以这次的更新集中在版面美观和减少不必要的元素避免分散阅读的注意力的优化上,但仍有很多细节问题需要继续优化,目前主要有以下两个问题:

  1. 字体大小和选择上影响了阅读的感受,特别在移动设备上,未经过处理,导致标题字体过大,十分不美观;
  2. 在文章页面上的导航条自动隐藏效果不佳;

坚持和不断优化吧,骚年!

相关文章

  • 自我修炼第36天--Anson的博客换了个门面

    在写今天的文章之前,我想向大家介绍我用来写文章的Markdown工具。Markdown是一款十分轻量的标记语言,它...

  • 晓露的365天日更计划Day86

    DAY8:抢占心智第7章《营销者的自我修炼》 字数:668 标题:自我修炼 这几天由于多个社群的打卡导致心生焦虑,...

  • 设计模式3.7 门面模式

    点击进入我的博客 门面模式(Facade Pattern)要求一个子系统的外部与其内部通信,必须通过一个统一的门面...

  • 新经理培训第一次午餐会

    Anson真喊大家来吃饭了 关键是还真有同学只是来吃了个饭…… 午餐会都干了什么? 听完饭,Anson就问了大家四...

  • 读书笔记-菊与刀4

    1.自我修炼 日本人认为自我修炼在生活中极其重要。日本式的自我修炼有两种:一种是“培养能力”的自我修炼,其目的仅在...

  • 自我修炼中的患得患失问题

    一、如何研究修炼 1.自我修炼也是发展变化的 2.自我修炼的目的 二、自我修炼和患得患失问题 三、患得患失的特点 ...

  • 自我修炼第0天

    再次辞掉了工作,这是我辞掉的第二份工作,这份工作在我急需经济支援时给了我必要的帮助,除此以外,感觉与自己要做的事相...

  • 自我修炼第 2 天

    今早起床晚了,虽说时间紧迫,我依然想办法完成了任务,只抓最重要之事 经历一些事之后发现我其实总爱生气爱计较其他兄弟...

  • 自我修炼第 4 天🌷

    第四天了,实在太快,此刻最大的感受是被时间推着往前跑,特别忙碌,忙到停不下来,还有很多待处理事项,比如此刻我需要沟...

  • 自我修炼第 1 天 🌸

    昨天休息,老大请我们看电影,晚上为我们做辣子鸡,大盘羊,今下午又为兄弟们做培训,对老大满是感激 今天是我回大本营休...

网友评论

      本文标题:自我修炼第36天--Anson的博客换了个门面

      本文链接:https://www.haomeiwen.com/subject/oiwjtttx.html