企业官网建设流程全解析

• 数据集

Time Doctor 是 remoteintech 开源仓库（即 README.md 所述 remoteintech.company 远程友好科技公司目录的源码库）中收录的一家典型"完全远程（fully-remote）"科技公司。本文以 src/companies/time-doctor.md 这份标准公司档案为绝对主体，逐字段拆解其 frontmatter 与 Markdown 正文的语义，并结合 CONTRIBUTING.md、src/_data/labels.js、src/_layouts/company.njk 等仓库源码，说明这类档案如何被 Eleventy 静态站点消费、如何映射为可浏览的标签体系，以及读者可以从中提炼出的远程团队工程与招聘信息。读完你将掌握本仓库公司档案字段的完整含义、合法取值与页面渲染链路，并能自己读懂或编写同类条目。

档案全景：一份 Time Doctor 条目的结构

time-doctor 档案由两部分组成：YAML frontmatter（结构化元数据）与 Markdown 正文（面向读者的描述内容）。

Frontmatter 原文（节选关键字段）：

title: "Time Doctor" slug: time-doctor website: https://www.timedoctor.com/ careers_url: https://www.timedoctor.com/careers region: worldwide remote_policy: fully-remote company_size: medium technologies: - javascript - php - mobile - data addedAt: 2026-05-02

其中：

• slug必须与文件名一致（time-doctor.md），这是 CONTRIBUTING.md 的硬性要求：{slug}必须匹配 frontmatter 中的slug值，否则校验不通过；
• addedAt记录条目加入目录的时间，由维护者管理，贡献者在 PR 中不应自行添加。

Markdown 正文部分则包含五个##小节：Company blurb、Company size、Remote status、Region、Company technologies，外加How to apply。其中Company blurb、Remote status、How to apply是 CONTRIBUTING.md 规定的必选小节，其余为常用可选小节——Time Doctor 档案恰好完整覆盖了全部五个常用字段，是理解目录条目规范的理想样例。

Company blurb：档案的"灵魂段落"与自动元描述

档案的## Company blurb是这么写的：Time Doctor 是一个专为远程与分布式团队构建的劳动力分析与时间追踪平台（workforce analytics and time-tracking platform）。产品帮助管理者和员工理解时间如何被花费、识别生产力阻碍、改善工作流，并强调尊重员工隐私。同时档案注明：Time Doctor 是自举公司（bootstrapped，无外部融资），已建成服务全球 28 万以上活跃用户的 SaaS 业务。

这段 blurb 在公司档案体系中承担着超出"介绍"的职责。查看 src/companies/companies.11tydata.js 可以发现：仓库通过eleventyComputed在构建期自动从## Company blurb小节提取正文，清洗 Markdown（去掉链接语法、*_强调符、换行与多余空格），截断至约 155 字符，用作公司页面的 meta description。具体流程：

1. 优先用正则/\##\s*Company\s*blurb\s*\n+([\s\S]*?)(?=\n##|$)/i匹配 blurb 段落；
2. 若找不到则回退为 frontmatter 后的第一个段落；
3. 文本清理后尝试在句号处截断（lastIndexOf('.')），否则在最后一个空格处截断并补...。

因此，blurb 写得是否精炼、语义完整，直接决定搜索引擎与社交平台展示的摘要质量——这也是"280,000+ active users"这类量化信息被放在 blurb 里的原因。

Company size：medium 背后的人数区间

正文## Company size写明 Time Doctor 全球约有150 名员工。frontmatter 中的company_size: medium是枚举值，其对应关系定义在 src/_data/labels.js：

150 落在medium（51-200）区间，字段与正文互相印证。labels.js是整个目录的"单一事实来源"（single source of truth）：它既被 JS 侧通过 src/_data/companyHelpers.js 的getCompanySizeLabel消费，也被 Nunjucks 模板通过全局数据级联以labels.companySize引用。

Remote status：fully-remote 的判别依据

档案指出 Time Doctor100% 远程：其招聘页宣传"fully remote environment"，公司没有中央办公室（no central office）。这是"作为一家为远程团队构建软件的公司，全员分布"的自我印证。

在目录体系里，remote_policy: fully-remote对应 src/_data/labels.js 中remotePolicy的四个合法枚举之一：

• fully-remote（完全远程）
• remote-first（远程优先）
• hybrid（混合办公）
• remote-friendly（远程友好）

该字段在 src/_layouts/company.njk 中会被渲染为指向/browse/{{ remote_policy }}/的策略标签（tag--policy），供访客按远程政策维度浏览目录。

Region：worldwide 与多元团队构成

正文## Region明确为Worldwide（全球）：团队成员来自 40+ 个国家、44 种国籍。frontmatter 的region: worldwide是 src/_data/labels.js 中region枚举的第一个取值，合法值还包括americas、europe、americas-europe、asia-pacific、other。

这一字段被 src/_config/collections.js 的getCompaniesByRegion使用：它以regionLabels为键初始化所有分组，再按每个公司的region归组，最终生成按地区浏览的目录页面（/browse/{{ region }}/）。"40+ 国家、44 国籍"这类正文细节，则为求职者评估"跨时区协作真实程度"提供了比枚举标签更具体的信息。

Company technologies：多端产品栈与标签归类

档案的## Company technologies列出的技术栈与 frontmatter 中technologies数组呼应：

• JavaScript 与 TypeScript：Web 前端
• PHP：后端的一部分
• 原生桌面客户端：Windows、macOS、Linux
• 移动端应用：iOS 与 Android
• 数据与分析基础设施：用于生产力洞察

frontmatter 中的四项javascript、php、mobile、data均为 src/_data/labels.jstech枚举中的合法值（完整枚举含typescript、react、nodejs、python、ruby、go、java、rust、dotnet、elixir、scala、swift、cloud、devops、docker、kubernetes、ml、sql、postgres、nosql、search等）。

渲染侧有两个要点：

1. 在 src/_layouts/company.njk 中，technologies数组会生成"Tech Stack"区块，每项渲染为指向/browse/{{ tech }}/的技术标签（tag--tech），标签文本由labels.tech[tech]映射（如javascript→JavaScript）；
2. 在 src/_config/collections.js 的getCompaniesByTech中，每个公司按其technologies归入对应技术分组，构成按技术栈浏览目录的数据基础。

这份档案也揭示了一个产品形态特征：桌面端、移动端、Web 与后端并存的多端产品结构，意味着远程团队在招聘时往往同时覆盖前端工程师、后端工程师与移动端开发等多个角色。

How to apply 与 careers_url：申请链路的双通道

档案的## How to apply指引求职者浏览 Time Doctor 官方招聘页。与之对应，frontmatter 中同时提供了website（公司官网）与careers_url（专属招聘页）。

在 src/_layouts/company.njk 中，模板用careers_url or website决定主按钮（buttonUrl）：

• 若存在careers_url，按钮文案显示"Apply Now"；
• 否则回退为website，文案显示"Visit Website"。

按钮带有data-track-outbound属性用于外链点击追踪，并以target="_blank"+rel="noopener noreferrer"保障安全打开。这也呼应了 CONTRIBUTING.md 的收录准则：careers_url必须指向公司自己的招聘页，而不是推销服务给客户的页面。

字段到页面的完整渲染链路

综合仓库源码，这份档案从数据到页面经历了以下链路：

1. 文件入集合：src/_config/collections.js 通过getFilteredByGlob('./src/companies/**/*.md')（约 850 家公司）将time-doctor.md纳入公司集合，结果被缓存（memoized_companyCache），避免多次过滤；
2. 排序与分组：getAllCompanies按标题字母序排序；getCompaniesByRegion、getCompaniesByTech分别按region、technologies归组；
3. 计算属性：src/companies/companies.11tydata.js 自动生成 meta description；
4. 布局渲染：src/companies/companies.json 指定layout: company，由 src/_layouts/company.njk 输出公司档案页面，schema 为Organization，标题、按钮、地区标签、政策标签、技术栈标签依次呈现。

该条目还被getRecentCompanies按addedAt（2026-05-02）排序，可能出现在"最近添加"板块中。

这类档案如何维护：模板与校验约束

对想为本仓库贡献新公司条目或理解既有条目的读者，CONTRIBUTING.md 提供了明确的 frontmatter 模板、必选/可选小节清单与合法字段值表（上文company_size、region、remote_policy、technologies的取值均源自此处）。所有触碰公司文件的 PR 都会经过Validate Company ProfilesGitHub Action 自动校验，机器人会指出格式问题并阻塞合并。因此，time-doctor 档案中出现的每个字段都应是枚举值域内的合法取值——这也是把remote_policy: fully-remote、region: worldwide、company_size: medium等字段与 src/_data/labels.js 一一对应的原因所在。

结语

从 src/companies/time-doctor.md 这份档案可以提炼出三层信息：对公司本身，它是一家自举、约 150 人、完全远程、覆盖全球 40+ 国家的劳动力分析与时间追踪 SaaS 公司，产品横跨 Web（JS/TS 与 PHP）、桌面与移动端；对目录体系，它的每个 frontmatter 字段都精确落在 src/_data/labels.js 的枚举上，并被 src/_config/collections.js、src/_layouts/company.njk、src/companies/companies.11tydata.js 消费为可浏览、可搜索、可被搜索引擎收录的结构化数据；对求职者，"fully-remote + worldwide + 多端技术栈"的组合，意味着这是一家把分布式协作写进产品基因的典型远程雇主。理解这份档案，就是理解整个 remoteintech 目录的字段规范与数据链路。

• 数据集