JNT Manpower —— 外劳中介官网与自助后台

背景

JNT Manpower Solutions 是一家马来西亚中介，为雇主处理外籍劳工招聘、外包、合法化和相关准证。他们原来的网站只是一本静态册子：没法发更新、没有结构化的服务页，联系方式也和公司实际的多办公室运作对不上。

他们需要一个面向雇主的正经营销网站 —— 以及一条让自己员工把内容保持最新的路。

挑战

• 十个服务与信息页面都要客户自己能改，不是我们改 —— 正文、头图、常见问题、办公室卡片和数字。
• 咨询入口太多表单，客户希望只留一条清楚的联系路径。
• 公司有三个办公室，联系页上每个都要有自己的地址、地图和联系渠道。
• 客户还没确认的内容不能写死：字段为空时要干净地消失，而不是把占位符发上线。
• 网站上线第一天就要能被搜索到：元信息、站点地图、robots 和结构化数据，不等一轮单独的 SEO。

我们做了什么

开发

• 前台 —— 十个页面覆盖招聘、外包、合法化、准证、知识中心和联系，所有行动号召都汇入同一个咨询表单。电话和邮箱是真的 tel: / mailto: 链接，WhatsApp 一键直达。
• 定制 CMS —— 后台管理文章（带一个来源收件箱，走五步发布流程）、常见问题、站点设置、数据、办公室和进来的咨询。每一个客户可编辑的字段在为空时都会优雅回退。
• 办公室模块 —— 独立的分公司表和后台界面，客户以后要加第四个办公室不用改表结构。地图嵌入按需加载，嵌入地址只白名单 Google Maps。
• 表单加固 —— 前端校验同时管住提交和邮件通知，空提交或机器人提交不会进客户邮箱；校验错误在用户输入时自动清除。
• SEO 基线 —— canonical、Open Graph、站点地图和 robots 通过一个环境变量切换到正式域名；在数据具备的地方输出 EmploymentAgency 和 Article 结构化数据。
• 性能 —— 图片转 WebP（最重的页面从 15.8 MB 降到 1 MB 以内），滚动进场动效尊重 prefers-reduced-motion，并在八个断点做了一遍全宽扫查，零溢出。
• 测试 —— 117 个单元测试和 78 个端到端测试，覆盖前台页面和后台流程。

我们还做了一份自带真实截图的英文后台手册，让客户团队不靠我们也能跑发布流程。

结果

• 已在客户自己的域名上线，所有页面正常返回，搜索控制台已连通。
• 客户员工自己改文章、常见问题、办公室和设置；咨询统一进一个收件箱，同时发邮件。
• 联系页上的三个办公室来自客户自己掌握的数据。
• 结构化数据、站点地图和元信息在第一天就位。
• 剩下的事项 —— 几个页面的定稿文案、团队照片、政策页和公司注册资料 —— 在客户手上，通过 CMS 补齐，不用改代码。