跳转链接需在获得焦点时可见
别名: 获焦才显示 · visually hidden skip · 跳过链接可见
概念解释
跳过入口可以在未聚焦时藏起来，以免挡视觉版面；一旦它成为焦点，就必须作为可见控件出现。看不见的跳转链接，能被阅读器读到，却帮不了看得见、只用键盘的人——他们不知道自己正停在可以按回车的地方，也不知道按了会去哪。
「在焦点上可见」不是装饰。它是这条捷径对非阅读器键盘用户成立的条件。
机制
常见做法是把链接放在视口外或做成与背景同色，直到 :focus 才拉回视口、加上对比色。机制成立的前提是聚焦样式真的覆盖了「看不见」的那套规则：若隐藏用了 display: none，它根本进不了 Tab 序列；若用了 visibility: hidden 而聚焦时没改回来，焦点会停在一个仍看不见的节点上。若聚焦环被全局 outline: none 干掉，链接即使移回视口，人也认不出那是当前项。
另一类失败是可见了但对比不够、或被粘性顶栏盖住。链接在技术上「出现了」，落在 8px 高的缝里或叠在 logo 下面，等于仍不可见。低视力用户和放大镜用户对这一条更苛刻：入口必须在当前放大窗口里占据可辨认的一块，而不是在屏幕顶端一闪。
怎么研究
从地址栏 Tab 一次，截图：链接是否出现、是否完整未裁切、文字与背景对比是否可辨、是否被固定栏遮挡。再在深色主题、高对比模式、200% 放大下各做一次——隐藏/显现往往只在默认浅色主题调过。
对照：阅读器能读到该链接，不证明看得见的键盘用户能用。两个人群要分开记。
边界
一直可见的跳过入口（不隐藏）完全符合这条，只是占一点版面。移动端没有 Tab 焦点时，隐藏策略不会被触发，接上键盘再测。动画把链接从屏外滑入时，必须在聚焦的那一帧已经可读，不能让人在动画中途按回车。多语言下文案变长，显现位置若写死像素会被裁切——用能容纳最长文案的布局，而不是假定中文或英文的宽度。
怎么落地
- 未聚焦可藏；聚焦时移入视口、恢复对比、画出焦点指示，三件事一起做。
- 不要用
display: none藏跳过链接；用离屏或等价技术，并在:focus/:focus-visible时撤销。 - 验证：Tab 一次，入口必须完整可见且不被顶栏挡住。看不见就按回车，不算这条过了。