03月12, 2012

小谈页面重构该如何提升?

做为一个专职的页面重构者,我们所从事的工作简单的来说就是:“将设计稿转换成WEB页面”。随着工种的细分,加上页面重构本身的专业性,独立成为一个职业也是大势所趋,相当可观的薪水也从另外一个方面证实了该职业具有很好的发展前景。

图片来源:七年很痒 图片来源:彪叔《七年很痒》

跟“前端工程师”所要求的有所不同,“页面重构”虽然也是“前端工程师”的一个范畴,但在职业化中,对专职的页面重构者,要求当然也就更高。我们不光要出页面,还要输出高质量的页面:精确还原设计稿的同时,我们还需要关注标签语义化,结构的合理性、充分考虑到页面模块在站点中的不同“作用和重要性”,并对其进行有针对性的优化。除此之外,良好的页面交互、用户体验、服务于最终用户也是需要我们深入研究和探索的。

接下来,我就谈谈自己从事页面重构以来的所感所悟,也借机分享下“页面重构师该如何修炼升级”,请各位大鸟、老鸟多多指教。

坚持信仰

有人说:2011年是重构界的反思年,也是整个互联网行业的反思年。反思页面重构未来的发展,也反思我们个人从业以来的种种。我相信有很多同学多多少都遇到过方向不明,不知道自己应该如何提高的困惑。当然,作为重构大军中的一员,我也曾困惑,也曾迷茫:

I’ m bug 12:01:09 我现在比较迷茫的是,是否有必要坚持这么做… ghostzhang 12:01:29 这个就是你对自己的要求了
ghostzhang 12:01:56 做与不做,能看到的人是不多的
ghostzhang 12:02:26 人总是挑简单容易的去做,大家都这样
ghostzhang 12:03:09 不做,只不过与大家一样 做,就是与众不同
ghostzhang 12:06:39 路没有对错,你坚信了,就是对的,你不信了,就是错的

我们需要信仰,是为了我们自己,是为了在信仰的支配下做出正确的行为,进而改变我们的生活,改变我们所处的世界。

保持高度的激情!

单纯的页面重构,所涉及到的工作内容一般是“分析设计稿=>切图=>书写代码”,虽然看起来很简单,但要做好这份工作,绝非所想的那么容易。

原因很简单:工作内容单一,在时间和工作量、质量要求上必定会很苛刻;在这种工作强度下,很多人都是靠着对这份工作的喜爱在维持着,一旦工作热情消失,很容易就会变得枯燥。保持持久的热情也就成了重构工作者(也是所有参加工作的人)应该具备的能力。或许有人要问,如何保持这种激情呢?说个简单的,我们不妨想想看:自己创建的页面会被上百万、上千万的用户访问,酷炫的页面交互让最终用户为之留恋,不断的微创新为公司节省大量开发成本和财力,想想就有激情!

对自己负责。

当前正值公司高速发展时期,陆陆续续面试了很多同学,有几点感触:基础太差、态度不端正。正如克军所说: 我们还有太多观念没有扭转过来,我们过分的追求技巧而忽视了技巧之外的基本原理。 Web标准的精髓(结构、表现、行为三者相分离),相信大家都能倒背如流。但如果我们去codereview就会发现:基于表现类的代码比比皆是。有人抱怨说:有太多的历史原因;有人说,我自身的素质就不高没有能力去影响周围的同事;更有人说公司体系建设不够健全、流程混乱、临时项目多根本没时间做优化。但我觉得,这不是我们对自己妥协的借口。得过且过,只为完成任务而去工作,即便我们能心安理得的混薪水,一年10万,五年50万,我们逝去的青春难道只值50万吗?正如《老男孩》所唱到的:青春如同奔流的江河,一去不回来不及道别,只剩下麻木的我没有了当年的热血。

进步,其实是有路子可寻的!

两抓一深入!(抓基础、抓原理,深入了解页面重构的前世今生)

有句老话:磨刀不误砍柴工!

也有人说:读史使人明智,读诗使人灵秀,数学使人周密,科学使人深刻,伦理学使人庄重,逻辑修辞之学使人善辩:凡有所学,皆成性格。

读书吧,筒子们!

  • 《网站重构》的起源
  • 《禅意花园》的蜕变
  • 《html与xhtml权威指南》《html 5设计原理》的坎坷。
  • 《css权威指南》的缤纷多彩;
  • 标准模式与怪癖模式的恩怨情仇;
  • 熟悉常见浏览器Bug,知其作祟的具体场景及伏魔大法;

存在即合理。但进化,是谁也无法阻挡的!

八卦一下:电视剧里的情节一般都是单亲子女对生父苦大仇深,然后经过种种的波折、获悉父辈的感情纠葛、再被生父舍身感化后冰释前嫌。那么,我们所面对的又何尝不是如此呢?ie6虽遭人唾弃,但它也曾建功立业。怪癖模式的出现也并不是你所了解的那么万恶,毕竟向后兼容也为我们做了很多贡献。

无所不用,打磨页面重构的思想及技术:

保证各浏览器的兼容性已经是一个很落后的话题。

  • 《无懈可击的web设计》
  • 《精通css 高级web 解决方案》
  • 《超越css》
  • 《css那些事儿》
  • 《javascript权威指南》
  • 《javascript dom编程艺术》
  • 《高性能网站建设指南》
  • 《高性能网站建设进阶指南》
  • 浏览器工作原理;
  • 提高代码的可维护性:精简、重用、有序;
  • 辅助性开发工具:firebug、yslow、pagespeed、css usage…;
  • 关注开源社区的优秀设计模式;
  • 订阅大牛技术博客;
  • 了解前端MVC;

关注页面的可访问性、提升良好的用户体验:

  • 不管页面是否有样式,都要保证内容具备良好的阅读性;
  • 关键性操作的可访问性,避免以图换字背景无法加载导致重要功能丧失;
  • 保证重要内容优先展示;
  • 增大页面元素的可点击区域,减少用户操作成本。
  • 结合具体项目,考虑跨平台访问的响应性设计;
  • 剩余字符数的提示;
  • 对于操作的及时反馈;

与同事并肩作战:

  • 沟通、沟通、再沟通;
  • 合理化的代码注释,起始、结束位置的标注;
  • 标注不同状态的触发开关;
  • 功能模块使用方法及相互依赖关系;
  • 共同探索更好的规范与流程;
  • 寻找、开发更为高效的自动化工具;
  • 总结分享更为高效的解决方案;
  • 所有的修改做到有案可查;

提升预知问题的能力:

  • 常见新闻列表单行文本字符数过长导致溢出如何处理?后端控制字符数?还是依靠css截取并加以省略号提升用户体验?
  • 图片尺寸不规整,如何保证页面的美观性?
  • 如果页面内容很少,不足以填充一屏的窗口区域,底部过于靠上显示,如何应对这一尴尬局面?

不断的技术尝新与展示,落地实际业务

  • 实践并分享新知识,积极换位思考,为产品设计提供更多有效的交互效果演示;
  • 对于前瞻性、短期内不能大范围应用的新技术视项目状况用之,并做好应对尝新所带来的事故应急方案。

落地实际业务

写在最后:web标准是一套理论性的指导思想,它的最终目的是为了让代码更易于维护,标准只是手段,而不是目的。在日常工作中,我们需要本着服务的精神与人协作,追求完美,追求极致。

以上所述,只是提供一个思路,希望能对大家有所帮助。感谢!

本文链接:https://75team.com/post/小谈页面重构该如何发展.html

-- EOF --

Comments

评论加载中...

注:如果长时间无法加载,请针对 disq.us | disquscdn.com | disqus.com 启用代理。