公司官网前端开发经验分享

4,596

公司官网的重要性和特殊性不言而喻。 很多前端都会经历这个项目,笔者有幸在所就职的每家公司都负责过官网的前端开发工作。开发中遇到过很多问题,反思起来值得和大家一起分享,以减少或者减低大家可能遇到的问题。


理想开发流程 UI => 开发 =》 测试 =》 上线

现实开发流程 需求方 =》 UI => 开发 =》需求方 =》 UI => 测试 =》需求方 =》 ...... UI => 上线 =》需求方 =》 UI => 开发 测试 =》上线

实际开发中需求及UI会一直调整,直到上线以后仍会不停调整。 所以,前期的需求评审至关重要。一定要让需求方(一般是市场部负责人)评审通过以后再开发。

吐槽:官网是我见到为数不多的产品总监PK不过市场总监的项目之一。一般项目,前端展示效果产品总监拍板即可。


0. 特性

  1. 跨部门沟通
  2. 跨项目耦合
  3. PWA
  4. 测试的重要性
  5. 工期的紧迫性
  6. 项目重要性
  7. SEO的重要性

1. 跨部门沟通

由于官网的特殊性,官网通常会涉及多部门协作。

  • 市场部:需求方,一般官网都必须满足市场部推广需求
  • 销售部:半需求方,一般官网都必须满足市场部推广需求
  • 人力部:半需求方,辅助招聘需求
  • 客服部:半需求方,辅助客服需求
  • 产品部:设计,对UI及UE负责
  • 开发部:开发,对技术及开发进度负责
  • 测试部:测试,对质量、效果负责,保证测试充分
  • 运维部:运维,对网络及服务器负责
  • 运营部:文案,对文案及SEO推广负责
  • 国际化:翻译,保证文案翻译的准确性及效率(一般小公司会外包,所以必须保证时效)

2. 跨项目耦合

  • 用户系统:实现单点登录(SSO)功能
  • 公司产品:涉及到公司产品的子项目
  • 官方博客:如blog、wiki、zendesk等
  • 客服功能:WeChat、App、小程序、微博等功能的集成

3. PWA

1. 可靠性

  • 跨终端可用性
  • 离线可以访问基本功能
  • 保证服务长期可访问

2. 快速性

  • 可交互等待时长
  • 加载速度

3. 友好性

  • 合理的布局
  • 友好的UI设计
  • 便捷的交互
  • 适合不同国家的用户使用习惯,如阿拉伯语国家 direction
  • 无障碍阅读

4. 测试的重要性

  • 自测
  • 产品
  • 测试部门
  • 公司内测

5. 工期的紧迫性

由于官网是企业对外宣传的重要工具,所以一般会要求时效性,如新闻、咨询、招聘信息等及时更新。

以及活动页的开发,如周年庆、春节、促销、展会、推广等活动。

6. 项目重要性

由于官网是企业的门面,一般公司(中小型企业)的老板都会对官网亲自把关,通过官网来展现公司的企业文化。所以,倘若你在中小型企业,接手官网的话,拿出看家本领把官网做好也是非常值得的。

7. SEO的重要性

由于官网的特殊性,往往公司会付费做SEO推广,所以,官网的SEO友好性不言而喻。这就要求我们在项目技术选型期要慎重考虑,想办法将SEO做的更好,这样就可以大幅节省推广成本,达到事半功倍的效果。

现在适合SEO的方法比较多,如SSRPrerender等其他方式。

检查清单

  1. 参与需求评审,待定稿后开始开发
  2. 工期预估,按正常工时的1.5-2倍时间进行预估,后期更改会比较频繁
  3. 硬件条件提前准备,如服务器、SSL、HTTPS等需要提前准备,待项目上线前搞定。
  4. 对老官网的兼容性,新官网发布前务必邮件告知公司全部高管,让大家自行修改,处理新老官网更换代理的问题。如,页面路径发生变化。
  5. 统计工具兼容(友盟、GA等)
  6. 埋点及上报代码不应遗漏
  7. 公测(公司内部测试,尽量保证1周左右的时间,让大家体验并上报问题)