一个设计美观、内容清晰、运行稳定的官方网站是一家企业品牌形象的重要组成部分。很多初创公司也许在运营相当长一段时间后,都没有精力建设自己的官网。也可以理解,毕竟建设官网不是一件简单的事情,你得考虑产品设计、视觉设计、代码开发、内容文案、运维监控、搜索引擎优化(SEO)、法务政策合规等等诸多环节,而且最好在一开始就建立起清晰的研发流程,以便日后新人迅速融入研发团队,同时在最大限度上提升发布速度,降低人为事故的发生率。并且即使发生事故,也能做到第一时间回滚修复,降低损失。
在很多初创团队里,上述这些要点可能并不完全成熟。即使是技术导向的团队,如果缺少一个有能力统筹整个研发过程的角色,那么在项目时间和预算双重压力下,出现问题也在所难免。
除此之外,合理的软件架构能够让企业在早期避免不必要的研发、运维和运营成本,同时在业务增长到一定程度时,又能够以尽可能低的成本和风险平滑地迁移到更大规模的架构上。
了解用户是产品设计阶段首先要考虑的问题。我的公司提供什么样的业务,这一点决定了官网用户的人群画像,比如是在校学生还是公司白领,是技术专家还是企业管理者等等。不同的人群画像对网站的设计风格、语言风格、交互风格、传播渠道都有决定性影响,也可能关系到我们需要在哪些设备上确保使用体验,而这些影响因素又会进一步决定未来的技术选型和研发成本。
我们当然希望官网在桌面端和移动端都体验很好,但现实是我们往往没有这么多时间和研发预算,那就需要结合用户人群有所取舍。举个例子,如果客户主要是企业或政府机关,那么大部分访问会来自桌面浏览器,这意味着需要更多考虑低版本浏览器的兼容,而移动端优化的优先级可以降低。相反,如果面向的是手机游戏用户,访问就主要来自手机浏览器和微信内置浏览器,那么移动端的性能与兼容性,以及分享传播的优化,就必须放在首位。
官网是简洁克制还是活泼明亮,是强调专业感还是强调亲和力,这些都会在几秒钟内影响访客对公司的判断。网站里每一页、每一张图都该如何设计,传达给访客什么心理感受,是不是要在细节中营造惊喜,这些都需要在前期考虑清楚,不然后期设计风格不能覆盖全部官网内容,就会让访客质疑公司的专业性。
官网上的内容不是越多越好。过多的信息只会淹没用户真正想了解的内容,让用户迅速失去阅读耐心。通常来说,官网内容应该适度分层,比如主页只简要展示公司业务、过往案例、联系方式等信息,过于复杂、文字太多的内容应该放在专门的公司博客页面,然后在主页保留一个入口。总的来说,期望展示什么内容,会影响到网站的视觉设计、交互设计、页面组织方式等产品决策,网站内容更新的频率和方式也会影响到技术实现方案。
除了网站备案等硬性法律法规要求之外,很多细小的网站功能也可能对网站合法合规适用条款有决定性影响,比如是否开放注册,是否展示评论,是否支持直播,是否支持支付等等。如果公司的合规条件、相关资质等不满足要求,就需要在设计之初尽快启动资质认证流程,或者对上面这些功能有所取舍。
对于初创公司,选择技术架构不仅需要考虑到公司现阶段的业务状况,避免引入不必要的成本,同时又要为未来可能的业务扩展留下空间,否则日后迁移升级的成本可能非常高,甚至不得不重建。一个有丰富的研发和运维经验的角色就能够帮助我们拆解这些问题,不但节约前期成本,也能够为未来可能的大规模业务场景留下足够的升级余地。
推广不仅关乎营销策略,也会影响技术实现。比如如果主要依靠搜索引擎优化(SEO),那在内容组织、页面结构、关键词布局上就要提前规划;如果依赖社交媒体分享,就需要针对微信、微博等平台做适配和性能优化;如果希望在特定社区推广,网站的用户注册、互动功能设计也会受到影响。这些选择会间接决定主要用户群体的画像,并最终影响到早期的技术方案。
所有托管在中国大陆服务器上的网站和域名都必须备案,备案通过后才能对外提供服务。备案流程通常需要两周左右,一般不超过一个月。本案例中,由于预期访问量不大,我们选择了拥有公网 IP 的腾讯云轻量应用服务器来申请备案。如果预计流量较高,就需要采购带宽更大的负载均衡或者云服务器。
如果团队能够熟练运用 AI 辅助工具,部分上述角色的工作量可以显著减少,比如初稿文案、界面元素、代码片段都可以使用 AI 来生成。但 AI 生成的内容通常并不完全满足专业要求,例如,AI 生成的文案往往空泛,缺乏深度和策略性,图像可能在细节和品牌风格一致性上有所欠缺,代码则需要经验丰富的工程师审核和优化,否则即使能实现功能,实现方式也常常并不优雅合理,给后续的维护带来麻烦。所以引入 AI 可以在一定程度上提高生产力,但要求相关研发人员具备更高的专业素养、更全面的技术视野和更出众的判断力来把控 AI 生成的内容质量。
在这个案例里,我们只投入了一名研发人员。这名研发人员具备产品思维、设计审美,有丰富的编程经验,对系统架构和运维有深入理解,同时也能胜任网站内容编辑的工作。在 AI 辅助下,这名研发人员独立完成了整个网站从零开始的全部工作,说明 AI 可以帮助那些规模较小但富有创造力的团队大幅提升生产力。在这种流程里,研发人员负责定义产品需求,设计交互方式,审核 AI 生成的内容质量,优化代码结构和实现方式、视觉效果、文案内容和用户体验细节,AI 则负责生成繁琐的代码、图片和文字内容,生成测试用例,以及配合研发人员在必要的时候重构代码。
项目代码托管在 GitHub 上,通过分支(Branch)与标签(Tag)管理版本。借助 GitHub Actions 的功能,我们配置了自动化流水线,在每次代码更新或者打标签时自动构建包含业务代码和完整运行环境的 Docker 镜像,并推送到私有镜像仓库。这里既可以选择自建仓库,也可以选择 Docker Hub 或购买云服务商提供的私有镜像服务。研发人员主要负责配置和维护流程,AI 工具则帮助生成部分配置文件和文档草稿。
针对网站这类应用,我们以分支管理的方式创建了四个不同的部署环境并在此流程基础上工作,以便新的研发人员陆续加入之后,整套流程仍然可以清晰稳定地运转:
有时生产环境需要并行运行两个以上版本的代码,用于获得不同版本上用户的数据表现,辅助后续产品决策,我们称之为 A/B 测试。A/B 测试的研发和维护也可以融合在这个工作流程中,在本文中暂不详述。
预发布环境(Staging): 和生产环境几乎完全相同的环境。在基本测试完成之后、上线发布之前,预发布环境用于测试代码是否存在和生产环境的数据、配置、基础设施等相关的问题。预发布环境不但运行在和生产环境高度相似的环境里,也会定期从生产环境单向同步用户数据,以便于发现测试环境难以重现的问题。
测试环境(Test): 一个公共的部署环境,独立于生产环境。所有开发人员在确认功能开发完成之后,会根据测试人员的测试周期,有计划地将代码合并到测试环境分支。测试环境代码发生变化之后,会自动触发测试环境的自动构建和部署,并通知测试人员跟进测试。测试环境主要测试功能逻辑和常规问题。
当我们定义好了每个环境的功能和构建发布流程之后,构建脚本均可以由 AI 完成。
最终图片会自动上传到云服务商的对象存储服务(COS),并通过内容分发网络(CDN)分发,让用户即使和网站服务器不在同一个城市、不使用同一个运营商,也仍然能快速访问图片资源,同时极大降低网站服务器的带宽成本。
内容文案还会影响到网站的视觉呈现。有些位置的文案需要言简意赅,寥寥数字就能传达足够准确的信息,太长的文案可能在视觉上显得拥挤,不仅会破坏文字的可读性,还可能破坏网页布局;而有些位置的文案又需要充分展开,成为一篇语言自然流动的文章,太短就不足以支撑一整个页面,显得不够专业。在未经人工充分干预的情况下,AI 生成的内容在这两种情况下都不能十分令人满意。所以,研发人员的专业素养和判断力在这一步再一次得以体现。
当我们定义好一整套测试用例之后,就可以在每次代码更新发布时,确保代码在已经定义的行为上保持零故障。
合理的研发流程也会包含必要的权限管理,确保每次更新发布时都经过了充分的评审、测试,也获得了关键角色的审批。
除此之外,一些安全性相关的措施也建议在首次发布时完成,比如购买并部署网站的 SSL 证书。这不仅确保网站和用户之间的通信安全,也让用户可以相信网站的身份。SSL 证书通常需要付费购买,但如果网站无需组织身份或企业身份验证,也可以使用一些免费的替代方案,比如 Let's Encrypt。
单纯让网站可以对外访问还远远不够,我们建议初期就给网站配备相应的监控系统,以随时了解网站代码的运行情况,以及用户的访问情况。我们可以购买各种云服务商提供的监控和日志服务来 7*24 监控网站是否健康运行,同时一些第三方的埋点监控也可以帮我们更好地了解用户是如何使用我们的网站的。如果有必要,也有很多开源方案可以让我们搭建私有的监控系统,有时这些自建的监控系统可能会比购买云服务成本更低。
这些数据对后续的技术优化、产品迭代以及各种商业决策都有不可或缺的价值。

优网科技秉承"专业团队、品质服务" 的经营理念,诚信务实的服务了近万家客户,成为众多世界500强、集团和上市公司的长期合作伙伴!
优网科技成立于2001年,擅长网站建设、网站与各类业务系统深度整合,致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设(品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、微信小程序定制开发、移动端应用(手机站、APP开发)、微信定制开发(微信官网、微信商城、企业微信)等一系列互联网应用服务。