layers=3 / fps≥58 / LCP<2.5s
三层背景以 0.15x / 0.35x / 0.6x 不同速率位移，把「感知层—网络层—平台层」的空间关系一次看懂。首屏仅保留 3 个动作入口，把互动用户体验压到 1 次点击即可完成设备接入演示，让科技网页设计先服务理解，再服务好看。
设备在线率 99.2%
scroll-rate 0.35x
左侧讲解区随阅读保持定位，右侧案例随内容联动切换。用户不必来回滚动，即可完成一次完整的解决方案浏览。
上线前，客户平均要看 4 个页面才拼出我们的方案全貌。改成视差滚动 + 分屏联动后，单页停留从 46 秒升到 2 分 18 秒，方案咨询表单的完成率从 8.1% 提到 13.6%。对物联网这种抽象业务，交互叙事比文案堆砌管用得多。
周昱 · 产品负责人
某工业物联网平台（风控与能源双场景）
统一 4 个核心指标（在线率、P95 时延、单位能耗、告警闭环率），滚动到哪一层就读哪一层数据，避免一次性倾倒全部指标。
从扫码到上线只展示 3 步，其余细节折叠进 FAQ，减少认知负担。
连续 7 天观察，若视差区滚动深度中位数低于 25%，就删掉该层背景；若首屏交互热区点击率低于 6%，就简化入口。
1024px 以下自动切单列并关闭视差，动效降级为渐显错峰。
每条都附参数与阈值，可直接交给设计与前端执行。核心原则：先保信息可达，再加视觉纵深。
推荐背景层 0.15x、中景 0.35x、前景 0.6x。层数越多越容易引起眩晕，尤其在移动端。用 background-attachment: fixed 时 iOS 兼容差，优先用固定背景层 + CSS transform 位移实现。
用 @keyframes 配合 animation-delay 做 0.06s 步进的错峰渐显，元素默认即终态可见。同时提供 prefers-reduced-motion: reduce 降级，关闭全部位移类动画。
Hero 用 16/11，卡片用 4/3，竖版图集用 3/4，全部加 loading="lazy" 与描述性 alt。预留给首屏图的尺寸，避免 CLS 超过 0.1。
约 60% 深色中性底承载内容，30% 主色用于标题高亮、细线、图标与链接悬停，10% 暖橙强调色只出现在主按钮、关键数字与激活态。杜绝整屏高饱和铺色。
正文对比度 ≥4.5:1，大字 ≥3:1左栏 position: sticky; top: 96px 即可，右栏自然滚动。1024px 以下取消粘性改为单列堆叠，避免窄屏出现半屏空白。
导航项、按钮、FAQ 折叠头统一最小高度 44px，保留 :focus-visible 可见轮廓（2px 强调色 + 3px offset），并用语义化标签与 aria-label 支撑无障碍。
根容器设 overflow-wrap: break-word，grid 列一律用 minmax(0, 1fr)，flex/grid 子项加 min-width: 0，禁用 100vw 宽度写法。
三档均含响应式设计与无障碍基线检查；区别在于视差层数、动效编排与数据可视化深度。
¥18,000 / 单页起
¥42,000 / 项目起
¥98,000 / 系统起
答案全部可执行，不需要额外会议确认。
radial-gradient 与 1px 网格线生成，不引入位图；真实截图只放在内容区并加 loading="lazy"。实测可将首屏图片体积从 1.8MB 压到 420KB，LCP 从 3.4s 降到 2.1s。@keyframes + animation-delay，折叠用原生 <details>/<summary>，状态高亮用 :hover 与 :focus-visible。代价是无法做滚动触发的精准动效，但换来的是加载即完整可见、不会出现「整块内容藏在 JS 之后」的事故。从信息结构到性能验收，共约 3–5 周；每步结束都有明确通过标准。
把物联网方案拆成感知层、网络层、平台层、应用层四段，确认每段只讲 1 个核心结论。产物：1 页滚动脚本 + 3 个关键指标。通过标准：每屏信息点 ≤3 条
确定配色比例 60-30-10、圆角 12–16px、间距 4/8pt 节奏，输出统一 CSS 变量。产物：设计令牌表 + 组件状态示例。通过标准：无硬编码色值
三层背景速率定为 0.15x / 0.35x / 0.6x，入场动效按 60ms 步进错峰。产物：可交互静态页。通过标准：滚动帧率 ≥58fps
覆盖 2560 / 1920 / 1440 / 1024 / 640 / 380 / 320 七档，检查溢出、触达面积与对比度。产物：断点截图清单。通过标准：320px 无横向滚动
核对 LCP、INP、CLS 三项预算，上线后 14 天回收滚动深度与漏斗数据。产物：体验复盘报告 + 下一轮优化项。通过标准：LCP<2.5s、INP<200ms、CLS≤0.05