01项目概述
ostohlo.com是工作室自己的网站，和其他网站一样，它在这个列表上是因为：它是按照我们为客户构建的方式设计、构建和维护的。页面存储在数据库中，并由我们自己的引擎渲染；模板保留在文件中；界面是从头开始编写的设计系统，而不是从某处购买的主题。
这也是一个工作产品，而不是名片。有一些无需注册的免费工具，一个项目估算器，一个拥有自己仪表板的三级合作伙伴计划，以及一个从我们的平台以三种语言自动填充的博客。
02为什么工作室网站很难
一个工作室网站没有抱怨的所有者。它是在客户项目之间编写的，每个快捷方式都能存活多年：一个落后的语言，一个没人敢编辑的手写HTML页面，一个与工作不再匹配的作品画廊。
我们正是经历了这样的历史。网站最初是静态文件，第一次迁移到数据库时显示了其成本：可见文本的比较显示一切匹配，而数百个页面悄悄失去了样式表包。从那时起，这里的规则是，变化通过测量来证明，而不是通过页面看起来正确。
03项目目标
- 数据库中的内容和文件中的模板，因此文本更改不需要开发人员；
- 三种从不偏离的语言：一个添加到其中的关键在同一任务中添加到所有三种语言；
- 我们自己的设计系统——属于这个品牌的运动、WebGL场景和排版；
- 真正有用且真正免费的工具，没有任何存储在服务器端；
- 一个在仪表板中有真实数字的合作伙伴计划，而不是在着陆页上的承诺；
- 可测量的质量：布局最低到320像素，干净的结构化数据，没有断开的链接。
04引擎：数据库中的页面
每个页面——一个服务，一个案例研究，一篇文章，一个法律文本——都是一行：路径、语言、标题、描述、正文、结构化数据、出版标志。一个入口点通过按类型选择的模板呈现它，共享的页眉和页脚来自生成器写入的文件，因此三百个页面的外观在一个地方发生变化。
微妙之处在于文件系统，而不是代码：网络服务器会提供磁盘上存在的任何文件，然后才会转到应用程序。将一个旧页面名称的文件放入公共目录会悄悄地将该页面从数据库中关闭——这正是那种不会留下任何错误的故障。
05三种语言，英语为主
英语位于根目录，俄语位于 /ru/，乌克兰语位于 /uk/。哪个语言位于根目录在代码中只写在一个地方，前端通过一个常量知道同样的事实——一个检查比较它们，因为对这个问题的两个答案就是半翻译网站的产生方式。
接口字符串是一个包含每种语言包的字典，规则是绝对的：添加到一种语言的键必须在同一任务中添加到所有三种语言。缺失的键不会引发错误，它会向读者显示错误的语言——这是最昂贵的沉默。
06我们自己的设计系统
当前的界面是该网站的第四代，完全从头开始编写：令牌、排版、组件、动画以及一组位于主块后面的 WebGL 场景。源文件集中在一个地方，并被编译成哈希包；手动编辑编译后的文件在下次构建时会丢失，因此没有什么好争论的。
这里的动画始终开启——没有减少运动的门槛——这是所有者的故意决定，并伴随着一项责任：在 320 像素下，一切仍然必须可读和可达，每个出现的动画必须实际完成。这两者都通过一个探针进行检查，该探针滚动页面两次并等待显示，因为一个从未出现的块在过早截屏时是不可见的。
07不存储任何内容的免费工具
七个小工具：一个密码生成器和泄露检查，一个二维码生成器，一个 UTM 构建器，一个 slug 制作器，一个字符计数器和一个电话检查器。无需注册，无需账户，重要的是——没有服务器端存储。工具记住的内容仅存在于访客自己的浏览器中，只有设置，而不是内容。
泄露检查是最清晰的例子：它从不发送密码。只有其哈希的短前缀离开浏览器，答案在本地组装，这就是有用工具与美观设计的密码收集方式之间的区别。
08带有真实仪表板的合作伙伴计划
三层推荐：合作伙伴可以从他们带来的客户、这些客户带来的合作伙伴以及更低层级的客户中获利。仪表板显示实际发生的情况——按活动划分的点击量、注册、累积——并且可以通过带有令牌的链接访问，而不是通过任何人都记不住的密码。
令牌在第一次请求发送之前从地址中移除，请求不携带凭证和引用来源，演示模式从不接触服务器。合作伙伴后台是一个显示资金的地方；它不应该是一个泄露账户链接的地方。
09一个自我填充的博客
文章来自Astrina—— 我们自己的平台 —— 通过一个签名的端点：一种材料，三种语言版本，每种语言版本都落在自己的语言树中，并有相互的替代链接。图像被拉入并本地存储，而不是热链接，并且该文章的博客索引卡在同一过程中编写。
像这样的自动化是安静损害发生的地方，因此输入会规范化它所接收的内容：内部链接被重写为文章的语言，而作为原始markdown保留的链接被转换为真实链接。规则很简单——俄文版本的读者绝不能通过看似在源代码中正常的链接被发送到英文页面。
10SEO、GEO 和机器阅读器
每个页面都有一个标题、一个描述、一个规范地址、所有三种语言的相互替代链接加上一个默认链接、Open Graph和结构化数据——所有这些都是从一个地方打印出来的，因为负责自己元标签的页面是会忘记它们的页面。
对于机器读取者，有一个摘要文件列出了各个部分、产品和语言，这些信息是从数据库中汇总的，而不是手动编写的：手动编写的文件几个月来声称的产品数量是错误的。网站地图——页面和图像——每晚重建，任何更改都会在同一轮中通知搜索引擎。
11表单、邮件和外部世界
简短表单是网站上唯一开始涉及金钱的地方，因此是最受保护的：一个方法白名单，一个蜜罐，每个地址和全局速率限制，对每个字段的大小检查，以及一个根据其真实内容类型而不是名称接受的附件。请求在发送任何内容之前写入数据库，因为丢失的信件不能意味着失去客户。
网站发送的所有内容 — 邮件、通知、外部调用 — 都通过代理进行，如果该代理宕机则会失败关闭。服务器的地址不会被第三方获取，邮件是从域名记录实际授权的邮箱发送的。
12技术栈
- PHP 8.4和 MariaDB：数据库中的页面，文件中的模板，一个入口点；
- 我们自己的设计系统 — 令牌、组件、动画、WebGL 场景，编译成哈希包；
- 三种语言，每种语言都有字典包和一致性检查；
- 在浏览器中编写的免费工具，没有任何存储在服务器端；
- 一个具有三个推荐级别的合作伙伴引擎和基于令牌的仪表板；
- 来自 Astrina 的文章签名接收，我们自己的分析，我们自己的广告网络仅在博客中。
13结果
一个文本更改是在面板中的编辑，而不是部署的站点；三种语言保持一致，因为规则在同一任务中得到执行；工作部分从一个注册表生成，因此添加一个案例不会导致网站的一半声称旧的计数。
一个像客户项目一样被衡量的网站：每个发布的地址都有回应，内部链接没有重定向或错误，每个页面一个标题和一个描述，图像在自己的站点地图中声明，布局在所有三种语言中检查到 320 像素。
14要点
按照你销售的标准来做自己的网站是令人不舒服的，这正是重点：你在这里可能采取的每一个捷径都是你可能为客户采取的捷径。我们的经验教会了我们三件事。将内容放在撰写者可以接触到的地方。 让语言成为规则，而不是意图 — 其他任何东西在一个月内都会漂移。用测量来证明变化：这个网站曾经通过了视觉比较，而它的数百个页面失去了样式。
如果你想要一个产品而不是宣传册的网站 — 拥有工具、仪表板、几种语言和属于你的界面 — 这正是我们所做的。
