二零一一年度总结

一般人习惯性到在元旦即将来临的时候做年度总结,由于出生在农村的习惯,家里人习惯用农历纪年。记得小时候每年吃完年夜饭,一家人围着一起烤火,看电视,爸爸也习惯性的在这一天翻出自己的账本,盘算一下这一年的收入有多少,还有多少账没有收回来,外面还欠了多少债。

受家里的影响,我也习惯性的认为,过完大年三十,才是新的一年的开始。这是第三次在深圳过年了,第一次是刚毕业的时候,和4个大学同学一起在深圳过年,自己搞火锅吃,还去世界之窗看烟花,第二次是去年,买了新房,家里人说买了新房要在新房过年,也就没有回去,今年,儿子刚出生不到三个月,回家太不方面,就不折腾了。

新的一年即将来临,也该给自己即将过去的这一年做个总结了。

1、结婚生子

2010.12.31,10年的最后一天领证了。本打算11年的下半年回家正式摆酒,不巧,2月份老婆怀孕了,所以就5.1回家结婚摆酒,11月份儿子降临,给我们这个小家带来不少欢乐。10年把房子买了,11年结婚生子,回头想想,这两年完成不少人生大事。房子、婚姻、儿子,也就意味着身上的担子更重,责任更大。

看着周围的朋友的亲人的逝去,听说朋友的父母的病痛,自己也到了上有老、下有小的境地,这是一份沉甸甸的责任。有了家庭,也理解了清官难断家务事的无奈。

另外,今年买了一件最有意义的数码产品就是单反相机了,人说吸“毒毁一生,单反穷三代”,这话一点都不假。大学的时候,数码单反还没有现在这样一统天下的局面,当时也玩不起,完了几年胶片机字,毕业的时候就卖了。今年趁着在儿子出生之前买了,记录下儿子从出生那一天开始的点点滴滴,等儿子长大了,也算是留给儿子的一笔财富。

2、单车海南环岛游

汽车买不起,自行车还是买得起的。买自行车一年多了,也骑了3000KM左右,还没有跑过一次长途,趁着十一国庆假期,泡了一次长途——单车海南环岛游,全称700KM+。这是一次美好的旅行,有单日骑行将近200KM的疯狂,有在伸手不见五指到黑夜里被狗追的心惊胆颤,有连续大雨中骑行2天的刺激,还有海口美味的老爸咖啡。

可能很多人都不理解我,老婆怀孕在家,儿子即将出生,还能自己出去潇洒,但我不认为这有什么错,正因为老婆怀孕,儿子还没有出生,老婆在家有人照顾,趁着这个机会去实现自己的梦想,再不去,儿子出生,就更难得有这样的机会了。

至于为什么选择去海南环岛,其实我也说不出理由,只是想骑一趟长途,挑战一下自我,仅此而已,没有确定的目的地,海南被我撞上了。跑完整个长途,从体力上来说,对我并没有太大的挑战,但整个行程,一路的见闻,值得去回忆。

3、工作

毕业5年半,到现在的状态,只能说比上不足,比下有余,不能算满意。

单就今年来说,工作状态也不是太好,上半年心态波动很大,经过了几个月到调整,心态有所好装,没有太多值得称道的成绩。

虽然没有太多成绩,但这一年经历的事情,也让我成长了不少,这也是一笔财富,也许能更好的照亮我前进的方向吧,期待明年的发力。

从大学接触这一行算起,接触这一行也快8年了,从触及这一行就开始建个人站,域名换了一个又一个、光域名、虚拟主机就折腾了不少钱进去,到现在仍然没有一个个人品牌,这是最大的失败,也希望今后能经营好自己的个人品牌。

计划赶不上变化,就不对自己的新的一年做过多到规划了,只期待自己能在工作上能发力了。

另外,发现自己看书已经不如以前的劲头了,已经看不动了,买了不少书,看过的没有基本,期待来年能多看点书。

写到这里,发现时间已经进入二零一二的正月初一了,祝所有的朋友新的一年里,心想事成,家庭幸福,工作顺利!

邮件页面兼容主流邮箱的常用技巧

几乎所有的商业网站都会给自己的注册会员发送邮件,如注册信息、购物网站下单之后的确认邮件、促销活动。

一般邮件分为纯文本邮件何HTML富文本邮件。

纯文本邮件就没有什么好说的,就是简单的段落文字以及链接,最后出来的效果类似与word文字排版,纯文本邮件适用于内容较少的邮件,如一般网站注册账号确认邮件。

而网站促销信息、活动周知邮件使用简单的纯文本邮件就无法满足要求了,必须要使用HTML富文本邮件,HTML富文本邮件就是一个HTML页面。

系统把邮件内容发送到收信的邮件厂商的服务器,用户登陆之后就可以读取邮件,其实我们发送的内容最终就是不同邮件厂商的邮件阅读页面的内容的一部分。

不同的邮箱厂商在阅读信件页面的处理逻辑稍微有些差异,如163和sina会把我们的邮件内容以iframe的形式引入进来,而绝大部分厂商是把邮件内容当做邮件阅读页面的HTML代码的一部分。

我们的制作的页面最终是寄人篱下的,因此,各大厂商不得不做一些安全考虑,会屏蔽掉部分HTML 标签以及CSS属性,sniper针对常用的CSS属性做了一个兼容性测试,请猛点击这里:国内主流邮箱CSS兼容性测试列表

下面是一些邮件页面常用技巧:

  1. 邮件内容作为web mail的html页面的一部分,因此邮件内容的html代码只能有body之内的标签,禁止出现如html、meta、link之类的标签,不能使用js等脚本语言,不能使用iframe
  2. css引用只能采用内联的方式作用在具体的html标签上,禁止采用外链以及写在head区域的方式。
  3. 建议最大可能的用html属性代替在标签上写内联的css的方式,如,用<td height=”30″ valign=”middle”><td>代替<td style=”height:30px; line-height:30px;”></td>。
  4. 页面布局采用table的方式,最大可能的保证页面兼容性,少写margin,padding属性,测试发现table布局的页面里,table和td的padding属性不完全兼容,建议采用空单元格代替,如,用<td height=”30″>&nbsp;<td>代替<td style=”height:30″><td>
  5. 建议最外层的table布局algin属性为默认值或者为align=”left”,尽量不要设置为align=“center”,在高分辨率显示器下,760px宽度的页面的主体内容在web mail的右下侧区域居中时比较难看,整个界面也会显得也不够紧凑
  6. 不要使用position,float,top,left之类的css定位以及与布局有关的css声明,一般邮箱都会过滤掉
  7. 不要用map热区链接,会导致outlook中链接失效
  8. 尽量少用图片,QQ邮箱、Gmail、Yahoo默认都会屏蔽图片,图片引用以及url必须是绝对路径。
  9. 背景装饰图用img标签的方式插入,img必须加上border=”0″
    禁止使用<td background=”bg.png”>(outlook2010不支持),
    禁止使用style=”background:url(imgurl);”的方式(gmail和outlook都不支持)
  10. 可以使用bgcolor和style=”background-color:#xxxxxx”
  11. 邮件内容宽度控制在760px以内,确保1024分辨率下能完整显示邮件内容。
  12. 营销类邮件最好能提供web外链查看方式,确保邮件无法完整显示时能有其他的查看方式。如“如果无法看到邮件完整内容,请点击此处查看”。

另外还有一些可以参考的文章:

中文网页默认字体研究

自从用上了Macbook Pro之后,发现部分中文网页的字体在mac下显示特别难看,查看了一下类似网页的字体定义,都是把中文字体定义为“SimSun”或者“宋体”,如下:

  • 新浪:font-family:”SimSun”,”Arial Narrow”;
  • 拍拍:font:12px/1.5em Tahoma, Verdana, Simsun, Microsoft YaHei, Arial Unicode MS, Mingliu, Arial, Helvetica

再来看看几个没有出现此类问题的body字体选择方案:

  • Apple中国:12px/18px “Lucida Grande”, “Lucida Sans Unicode”, Helvetica, Arial, Verdana, sans-serif;
  • 豆瓣:font:12px Arial,Helvetica,sans-serif;
  • Google+:font:normal 13px arial,sans-serif;
  • Google搜索结果页:font-family:arial,sans-serif
  • 百度首页:font:12px arial;
  • 百度搜索结果页:font-family:arial;
  • 百度百科 :font:12px/1.5 arial;

结论
“SimSun”和”宋体”在作怪,去掉这字体,mac下显示就不会难看

font-family用法

font-family : name
font-family : cursive | fantasy | monospace | serif | sans-serif

有两种类型的字体系列名称:

  • 指定字体名称:具体字体的名称,比如:”times”、”courier”、”arial”。
  • 字体系列名称:比如:”serif”、”sans-serif”、”cursive”、”fantasy”、”monospace”

如果没有定义font-family,取浏览器默认值。

font-family值可以是具体的字体名称,也可以是字体系列名称。

 

serif(衬线字体)与sans-serif(非衬线字体)

印刷品更多趋向使用衬线字体以方便阅读,这一点毫无争议。

目前最一般的显示器分辨率也不过每英寸100像素,屏幕显示衬线体有可读性的瓶颈所在。无论从审美角度还是人眼的使用感受来看,衬线体在笔划上有过多的点缀(笔划末端的小三角)很容易造成视觉疲劳,因此大部分网页使用无衬线字体。

为了解决中文字体的显示问题,微软从Vista开始中文默认字体已经从原来的衬线字体宋体改变成了无衬线字体微软雅黑。另外,为了更好解决衬线字体的显示问题,新的反锯齿和次像素显示(如ClearType)等技术开始广泛运用。

但到目前为止,中文操作系统中XP还是主流,微软雅黑还没有普及,以及行高等因素的影响,中文网页字体选择宋体仍然是最合理的解决方案。

 

为啥中文字体选择属于衬线字体的宋体而不选择非衬线字体的黑体或者其他字体?

此问题暂时无法考证,猜测大概有这个几个原因:

  • MSIE指定默认中文字体为宋体
  • 目前为止,的宋体仍然是最合适的web通用字体
  • 习惯成自然,自从中文互联网诞生到现在一直都是选择宋体作为默认中文字体,因此,大家也接受了。

 

结论:

body{
    font:normal 12px/1.5 arial;
}
  1. 不能确保所有用户都喜欢宋体,Mac下难看的宋体就是一个例证。正确的做法是不指定中文字体,用各浏览器默认的最佳最佳选择即可;
  2. 英文字体arial久经考验,而且各大操作系统都支持得比较好;
  3. 12px,中文字体的最常用的字体大小,新闻网站的文章部分一般为14px,也许以后1024分辨率淘汰之后,14px开始成为主流,em目前不可能在主流的中文商业网站中使用;
  4. 行高为1.5,不要带单位,具体原因可以看这篇文章

参考:

关于团队建设的一点思考

1、首当其冲,leader在团队建设当中有着不可推卸的责任,一个团队做得好,既是大家的功劳,同样也是你的功劳,而一个团队表现差的时候,第一责任肯定就是你的责任了。团队建设这事不只是leader可以做,团队里面的任何一个人都可以来做。

2、尊重是前提,没有尊重,一切无从谈起,对团队成员的尊重表现在日常工作、生活的每一个细节当中。

3、服务,放低自己的身段,服务与团队里的每一个成员,搭好台子,让擅长唱戏的团队成员把戏唱好。尽量不要想着你是leader,你有权发号施令,最好把这样的念头压下去。

4、沟通,与每一个团队成员保持必要的沟通,尝试了解团队里的每一个成员,发挥团队成员各自的长处,尝试为每一个团队成员量身定制一个个人成长计划,把团队成员的优点发挥到极致;了解每一个成员的性格特点,减少团队内部冲突,增强团队的凝集力。

5、周会,固定的周会是团队存在的最直接的表现形式。

6、聚餐、腐败、团队活动。虽俗套,但必不可少的,也是一个不错的方法。当自己资金比较宽裕的时候,可以尝试自己多掏掏腰包,如果大家都不富裕,可以尝试着找些理由让大家轮流来掏钱。

说明:记录日常工作中自己能看到的,理解的,更多的是自己的一些不足之处,勉励自己。

语义化典型的商品单元以及html语义研究:dfn del ins

商品单元示例

电商网站对于商品单元的应用非常频繁,而且商品单元的花样繁多,组内对于商品单元的html写法也是争论不一,而且语义化这个问题公说公有理,婆说婆有理,前端事件还和mohen,herman喝酒时突然争论起这个问题,狠狠的被他们鄙视了一把,说我不懂html语义,回来翻阅了一下W3C的资料,发现可以有更好的写法。主要是应用了3个比较生僻的标签:dfn、del、ins

最初的写法:

<a><span><img /></span><span>标题</span><span>市场价</span><span>折扣价</span></a>

改进后的写法:

<a><img /><dfn>标题</dfn><del>市场价</del><ins>折扣价</ins></a>

翻译成中文意思就是:这是一个商品,商品链接为a,商品的图片是img,名称是dfn,原来是市场价是del,修正后的折扣价是ins。

W3C关于dfn的解释

DFN: Indicates that this is the defining instance of the enclosed term.

翻译成中文是啥意思?我英文比较菜,也不知道如何翻译比较贴切,有人翻译成“ 定义一个定义项目”,单看这句话,还是不能很好的解释dfn的语义,其实只要知道dfn是define的缩写,我想就比较容易理解,配合下面这个例子,我想应该能更好的解释dfn的语义了。

<dfn title="Microsoft web browser">Internet Explorer</dfn> is the most popular browser
  used underwater.

dfn和dl类似,都是用来定义,解释某一事物的,可以引申为对某一事物的描述。dl要配合dt,dd一起来用,并且是用在列表当中的,而dfn是用在段落文本当中。

W3C关于del和ins的解释

INS and DEL are used to markup sections of the document that have been inserted or deleted with respect to a different version of a document (e.g., in draft legislation where lawmakers need to view the changes).

These two elements are unusual for HTML in that they may serve as either block-level or inline elements (but not both). They may contain one or more words within a paragraph or contain one or more block-level elements such as paragraphs, lists and tables.

del定义文档中被删除的文本内容,ins用来描述文档中的更新和修正,del的浏览器默认样式是带删除线,ins默认是带下划线的,这点也可以很好的说明两者的用法,通常情况下两个元素配合起来意思使用。

<p> A Sheriff can employ <del>3</del><ins>5</ins> deputies.</p>