已收录 我用灵犀搓了一个公司官网，连这篇文章我都交给AI写的，能不获奖？
我用 WPS 灵犀手搓了一个公司官网？还真搓成了 🛠️
这是手搓的成果展示链接：多维宇科技（辽宁）有限公司 - 管理咨询与定制化软件开发
以下是我人工手写的过程
- 创建一个官网项目
- 然后让他帮我写一个开发计划
3、然后就是眼睁睁的看着他干活
4、每次干完活，让他做好记录
5、过程一定要做好版本记录和代码管理，我不懂怎么做，但灵犀知道，帮我
6、然后部署，我不会，但我让他把操作方式写出来
7、部署效果看链接
8、然后让灵犀帮我写了下面这篇文章
注意，以下是灵犀帮我写的，非常详细
一、先说结论：为什么这么干
事情是这样的——我是做管理咨询的（精益、流程、数字化那套，服务军工和制造企业）。公司需要一个官网，但摆在面前的三条路都不太满意：
方案 问题 找外包建站 贵、周期长、以后改内容还得求人 买现成模板/WordPress 改起来还是绑手绑脚，SEO 底子普遍一般 用 AI 自己搓 可以完全定制、能持续迭代、还顺便验证一下 AI 到底能干活到什么程度
我选了三。而"手"其实就是 WPS 灵犀——一个跑在电脑上的 AI Agent，能直接操作本地文件、写代码、跑命令，一步步陪我把站搓出来。
结果：没有用一行现成框架，纯原生 Node.js 零依赖，从首页到内容管理后台，到现在已经迭代到 v2.3.0，全站 40 多个 git tag，上了线、备了案。
二、技术选型：刻意"反着来"，但想得很清楚
如果正常做法，肯定是 React/Vue + 数据库 + CMS。但我做了三个有点"反常识"的决定：
1. 零依赖 Node.js 原生 HTTP 服务
不装任何 npm 框架，server.js 一个文件，用 Node 自带的 http 模块起服务。好处是部署极简、可控、没兼容地狱，翻服务器代码一眼能看懂。
2. JSON 文件当"数据库"
不用 MySQL/MongoDB，内容全存成 data/*.json（11 个文件：站点配置、案例、文章、FAQ、服务、品牌、三阶段等）。每次请求 readData 现读现取，后台一改，前台立即生效，不用重启、不用清缓存。
3. 全站 SSR 预渲染（这是 SEO 的关键）
重点来了。很多人用前后端分离，爬虫抓回去是空壳 JS，什么内容都读不到。我这个站是服务端预渲染——每个页面返回的就是带完整正文的 HTML，百度蜘蛛不用执行 JS 就能读到所有文字。
为什么这点特别重要？ 因为它直接决定了搜索引擎收不收录你。百度对"只有 JS 渲染的空壳页面"非常不友好。
三、手搓过程：从骨架到 v2.3.0
① 先搭骨架：HTML/CSS/JS + SSR 渲染
第一版就是把首页、案例、洞见、关于我们这些页面的结构先立起来，导航、页脚、服务板块都能正常渲染。首页大概长这样：
手搓的网站首页
首页核心诉求是三个板块：AI 降本咨询服务（三阶段服务模式）、流程管理 + IT 定制 + AI 建设、管理咨询服务——这正好对应公司实际业务。
② 加内容管理后台：让"非技术的人也能改网站"
官网不能每次改字都让写代码的人来，所以第二步做了后台。这里是最花心思的地方，因为它决定了以后团队自己能不能维护：
页面管理：导航显示、SEO 标题/描述，后台改完全站生效
洞见观点 / 客户案例：后台维护，首页只显示置顶的，其余进分页页
FAQ、品牌资质、三阶段服务：全部内容化，还能上传 LOGO、配置轮播
富文本编辑器：不只写字，还能插表格、调颜色、设字号、加 H1-H4 标题——我们咨询行业发案例经常要放数据表
字段维护：把各种下拉选项集中到一个页管理，改完全局生效
这些不是"能跑就行"，是照着真实使用场景一点点磨出来的。
③ 客户案例页：咨询公司最硬的门面
咨询公司官网，案例就是产品。这个页面做了三件事：
左右布局：左边项目介绍，右边目标/实际改善的指标对比表
三栏筛选：按所属行业、服务类型、服务阶段筛，还能组合筛选
序号排序：置顶案例可手动排
后台维护前台显示效果
每一个案例卡片都带真实的"改善目标 vs 实际成果"数据，这是给客户看、也是给搜索引擎看的"硬内容"。
④ 动效系统 v2.3.0：让官网"高级"起来
业务方说希望官网更高级，参考了 ac-aibot.com 那种"板块从两边向中间靠拢 + 背景粒子跟随鼠标"的交互。先调研确认纯原生 JS/CSS 能复刻，再做。做成：
Hero 首屏标题/副标题/按钮依次上浮淡入
板块滚动渐显，卡片从左右交错滑入
Hero 背景 Canvas 粒子场，鼠标移动时粒子会被吸引吸附，还有边界处理
用户系统关掉动画时全部自动禁用，移动端自动降密度
动效不是花架子，它是给访客的第一印象，也会影响停留时长。
⑤ SEO 基建：为"能被搜到"下足功夫
这部分是这次手搓最有价值的地方之一：
robots.txt 动态生成：屏蔽后台和 API 路径，不干扰蜘蛛
sitemap.xml 自动更新：每次新增页面/案例/文章，自动进 sitemap，已经收录 16+ URL
全站 canonical + OpenGraph + Schema.org 结构化数据：Organization、FAQPage 这些都给搜索引擎标注清楚
SEO 标题/描述：关键词前置 + 地域词（辽宁/东北），因为我们是区域型咨询业务
地域落地页：专门做了"辽宁流程管理咨询""东北精益管理咨询"这类获客页
下面是管理咨询页和洞见观点页的成品：
后台维护前台显示的服务内容
后台维护，前台显示的观点
后台维护前台显示的介绍
后台维护页面
四、踩过的坑（都是真的）
手搓最大的价值，是把"看上去简单"背后的坑都踩一遍：
富文本显示两次：SSR 已经渲染了富文本，前端 JS 兜底又渲染了一遍，页面出现重复内容。修法是让 JS 检查 SSR 是否已渲染，渲染了就不重复。
新增阶段详情页 404：路由正则只匹配前 3 个阶段，加第 4 个阶段就 404。改成通用正则 + 通用模板才解决。
"添加"按钮点了没反应：用 querySelector('button:last-of-type') 定位插入位置，结果匹配到了删除按钮，插入直接静默失败。换成更精确的 class 选择器才修好。
后台图片上传全失效：一个 renderDashboard 方法一直没定义，导致登录后 JS 报错，后面的上传逻辑全没绑定。补全后上传就恢复了。
这些坑写出来是想说：AI 手搓不等于无脑生成，每一步都得验证、调试、回退。我们用了 40 多个 tag 才能放心回退。
五、成果与现状
✅ 已部署上线：
✅ 已完成 ICP 备案（这是被百度收录的前提）
✅ 已在百度搜索资源平台完成站点验证、提交 sitemap
✅ 全站 0 依赖，改内容后台随时改，SEO 结构化数据齐全
关于 SEO 多说一句：新站收录是有等待期的，一般 1~4 周，别急。你唯一要做的是把技术底子打好（SSR、sitemap、结构化数据、备案），剩下的交给时间 + 持续更新 + 外链。
六、结语：AI 时代，小公司该不该自己"手搓"？
我的答案是：该，但要聪明的搓。
如果你的官网只是"有个页面放公司简介"——买模板更省事。
但如果你像我一样，需要高度定制 + 内容可自己维护 + SEO 要做扎实，那用 AI 手搓真是一条被低估的路。
WPS 灵犀这类 AI Agent 的意义，不是"替你写完就完事"，而是帮你把一个需要多轮调试、迭代的真实项目推进到底——从搭骨架到后台，从动效到 SEO，它都跟得上。
以后我会继续更新这个站的 SEO 进度（比如百度收录用了多久、索引量怎么涨的），感兴趣可以关注我，一起见证"手搓官网"能走多远。
@金山办公