DESIGN FOR THE PLATFORM

共享原则，尊重不同。

设计同一个任务时，先理解设备、输入和平台习惯，再决定哪些复用、哪些适配。

PLATFORM NOTES

Web

内容与任务，依托浏览器

用一个例子理解

阅读工具：电脑显示目录与正文；手机收拢目录，正文保持合适行宽，章节仍可通过 URL 定位。

避免这样做：把整站做成不可链接的浮层，或劫持默认滚动。

AT A GLANCE

同一业务逻辑，不同交互表达。

平台概览用于建立认知，组件与系统行为以对应官方指南为准。
平台	主要输入	布局与导航	优先关注
Web	鼠标 / 触摸 / 键盘	流式内容、响应式容器、独立 URL	链接语义、前进后退、可缩放与稳定布局
iOS	触摸 / 系统手势 / 辅助输入	层级导航、标签导航、安全区域	动态文字、系统返回、内容优先
Android	触摸 / 系统返回 / 键盘	按窗口空间调整导航与内容面板	语义色、边到边布局、系统栏与返回
平板与折叠屏	触摸 / 手写笔 / 指针 / 键盘	单栏、多栏、分屏与可变窗口	选择保留、铰链避让、可用宽度
macOS	键盘 / 指针 / 触控板	多窗口、工具栏、菜单栏与 popover	菜单命令、快捷键、文件与焦点
Windows	键盘 / 鼠标 / 触摸 / 手写笔	可缩放窗口、导航区域与命令区域	窗口行为、系统缩放、键盘操作
Linux 桌面	键盘 / 鼠标 / 触控板	随 GNOME、KDE 等环境习惯适配	系统主题、文件对话框、标题栏与缩放
watchOS / Wear OS	触摸 / 表冠或旋转输入 / 语音	短内容、单任务、可扫读状态	关键信息优先，短而直接的操作
tvOS / Android TV	遥控器 / 方向键 / 语音	清楚的浏览结构与可预测焦点路径	观看距离、焦点状态、少量文本输入
visionOS / 空间界面	视线 / 手势 / 辅助输入	空间窗口、深度与舒适视野	可辨识目标、舒适性、动作可控

GO TO THE SOURCE

这里的课程帮助你建立判断，官方文档帮助你核对细节。示例中的尺寸与断点是教学选择，标明的 WCAG 阈值来自对应标准。

Apple 平台的设计原则与组件指导

颜色、排版、组件与自适应设计

Android 移动布局与内容规则

Windows 平台设计与交互指导

GNOME 桌面的设计指南

文本对比度的阈值、范围与例外

点击区域的最小尺寸与例外条件

复杂控件的语义、键盘与焦点模式

布局、网格、弹性与响应式实现

内容驱动的布局与约束