Repository navigation
feat(website): 新增下载、常见问题、更新日志与使用指南页 - #26
Merged
Merged
Conversation
首页之外补 7 个页面：download.html、faq.html、changelog.html（生成）、 guide/（索引 + 行情条 / 分组 / 老板键三篇）。目标是长尾 —— 单页能覆盖的 关键词就那么几个，而「QuantDesktop 下载」「怎么设老板键」这类问句需要 各自的落地页。 **顶栏一致性怎么解决的。** 每页都带完整顶栏页脚（ux 规则里 navigation-consistency 与 persistent-nav 都要求导航跨页一致，子页面不该 换一套），但这就把同一段 HTML 抄了 8 遍。让它可以接受的是新增的校验： 三段 chrome 用 `<!-- chrome:nav:start -->` 之类的标记包起来， site-assets.mjs 提取后逐字节比对（比对前剥掉 `../`，因为子目录页面的深度 不是漂移），不一致就让 CI 失败。所以「当前页高亮」不能写进顶栏 —— 改成挂在 `<body data-page>` 上加 CSS，选择器用 href$= 后缀匹配。 **changelog.html 从 CHANGELOG.md 生成**，不是手抄：手抄的那份下一次发版就 过期，而且过期是静默的。生成器只认该文件实际用到的几种写法，遇到别的原样 输出、不抛错；它的顶栏是从 index.html 里**提取**的，所以顶栏仍只有一份来源。 顺带修掉三个校验器自身的缺口（都会静默放过错误）： - **页面发现只扫了顶层目录**，guide/* 三个页面完全没被校验、也没进 sitemap - **相对引用按站点根解析**，guide/ 下的 ../styles.css 被解到仓库外面， 报了一堆假缺失；改为按页面自己所在的目录解析，并额外拦下跳出站点目录的引用 - **readChrome 只返回标记内部的内容**，生成出来的页面因此「缺少 chrome 块」 内容页版式：.page-head（自己让出 fixed 顶栏高度）、.prose（680px 正文列， 中文每行 35–45 字，比首页那 1072px 通栏窄得多）、.card-grid、.release*。 面包屑只在 guide/* 出现 —— 那是全站唯一的三级路径。 两处顺手改掉的：inline code 用正文色而不是强调色（强调色在这段正文里是 链接的颜色，再用它就分不清哪个能点了；而且它压在那层 7% 底色上，浅色主题 只有 4.51:1，贴着线），并加 white-space: nowrap（断成两行的 chmod / +x 复制出去是错的）。 验证：site:assets 全过（10 页引用解析、24 个 chrome 块一致、sitemap 8 条）； 每页标签闭合、单一 H1、标题层级正确；FAQ 页 12 问的 JSON-LD 与可见正文逐条 对得上；500 / 1440 两个宽度下四页均无横向溢出；对比度审计扩到 64 组全过； vue-tsc 与 149 个单测全绿。
原来是 color-mix 淡色底块 + inset 下划线的组合。那是模板与生成式工具的默认 答案，而且两个信号互相打架 —— 底块已经说了「就是这里」，再压一条粗线是重复， 合起来还会被读成一颗带下边框的按钮。技能库那条规则的原话也只是 「Highlight active nav item with color/underline」，没有底块。 现在只留一个信号：标签提亮 + 一条与文字等宽、两端渐隐、带辉光的强调色短横。 三个细节各有原因： - 左右各 12px 正是 .nav__link 的内边距，于是**线宽等于文字宽**。按元素框算 会宽出一截，那看着像按钮 - 两端渐隐，与顶栏滚动后那条 .nav.is-scrolled::after 发丝线同源 —— 全站只有这两处用渐变线，于是它们互相解释 - 辉光用 drop-shadow 而不是 box-shadow：前者跟着渐变渲染后的 alpha 走， 后者会按元素框发一圈方形的光 顺带把状态收进一个 --current 变量，颜色与指示器都从它派生，于是「哪个 data-page 对应哪个导航项」那份清单只写一遍（原来要写两块，迟早对不上， 而症状只是某一页的指示器没出现，没人会发现）。 手机菜单里同一枚指示器改成**左侧竖条**：手机的导航是竖排列表，横向的下划线 在那种布局里既没有方向感、又会因为 align-items: stretch 被拉成通栏。 验证：深浅两套主题各渲染核对过一次（放大到能看清线宽），手机菜单展开后也 确认过竖条位置；site:assets 全过、vue-tsc 与 149 个单测全绿、对比度审计 64 组全过。
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
官网从单页扩成 8 个页面，补的是长尾 —— 单页能覆盖的关键词就那么几个，而「QuantDesktop 下载」「老板键怎么设」这类问句需要各自的落地页。
download.htmlfaq.htmlchangelog.htmlguide/（索引 + 三篇）顶栏一致性：这是本次唯一有难度的部分
ux 规则里
navigation-consistency与persistent-nav都要求导航跨页一致、深层页面仍要能到达核心导航 —— 所以子页面不能换一套简化顶栏。但那样同一段 HTML 就要抄 8 遍，正是本仓库平时拒绝的漂移。做法：三段共用块（顶栏 / 页脚 / 回到顶部）用
<!-- chrome:nav:start -->标记包起来，site-assets.mjs提取后逐字节比对（比对前剥掉../—— 子目录页面的深度不是漂移），不一致就让 CI 失败。因此当前页高亮不能写进顶栏（写了就不一致），改成挂在
<body data-page="…">上加 CSS，选择器用href$=后缀匹配，这样guide/*里的../前缀不影响命中。changelog 是生成的
手抄的那份在下一次发版就过期，而且过期是静默的 —— 只有人主动比对才会发现。生成器只认
CHANGELOG.md实际用到的那几种写法（##版本、###小节、-条目、行内粗体与代码），遇到别的原样当段落输出、不抛错。它的顶栏是从index.html里提取的，所以顶栏仍只有一份来源，而生成出来的页面同样受上面那条校验约束。顺带修掉三个校验器自身的缺口
都会静默放过错误，属于这次扩页面才暴露出来的：
guide/*三个页面完全没被校验、也没进 sitemap。guide/下的../styles.css被解到仓库外面，报了一堆假缺失。改为按页面自己所在的目录解析，并额外拦下跳出站点目录的引用（本地能跑、发布后必 404）。readChrome只返回标记内部的内容 —— 生成出来的页面因此「缺少 chrome 块」。内容页版式
.page-head（自己让出 fixed 顶栏的高度）、.prose（680px 正文列 —— 中文每行 35–45 字最省眼，比首页那 1072px 通栏窄得多）、.card-grid、.release*。面包屑只出现在guide/*，那是全站唯一的三级路径。顺手改掉两处：inline code 用正文色而不是强调色（强调色在这段正文里是链接的颜色，再用它分不清哪个能点；而且它压在那层 7% 底色上浅色主题只有 4.51:1，贴着线），并加
white-space: nowrap（断成两行的chmod/+x复制出去是错的）。验证
npm run site:assets全过：10 页引用解析、24 个 chrome 块一致、sitemap 8 条vue-tsc与 149 个单测全绿合并后 push 到 master 会自动部署。
一处留给你定：
/compare（对比同花顺、东方财富）我没有做 —— 描述竞品的措辞该由你把关，写偏了是法律与口碑风险，不只是文案问题。