手机竖屏浏览17c内容
手机竖屏是最常见的小屏场景。页面会把原本并排的内容改成单列，让H1、正文、按钮和链接依次出现。此时不需要左右拖动画面，主要操作区域也会保持足够大的触控面积。
如果你从一起草页面进入在线视频观看，建议先看每个主题卡片的标题与摘要，再决定是否继续。小屏同时能看到的信息较少，先筛选再打开可以减少来回跳转。
图片会按容器宽度缩放，并保留合理比例。图片加载失败时，alt文字仍可提供基本语义，不会阻止正文显示。
- 竖屏优先单列阅读
- 先摘要后深入
- 图片不是主要内容的唯一载体
多屏访问
17c手机、平板与桌面多屏浏览
了解17c页面在手机、平板、桌面、弱网与高DPI屏幕下的浏览方式。
手机横屏什么时候更合适
横屏会提供更宽的阅读区域，适合查看图片、较长的标题或同时观察更多导航信息。不过对连续长文来说，过宽的行长未必更容易阅读。
当你需要对比两个内容块、查看较宽图片或让浏览器工具栏减少遮挡时，可以临时切换横屏；完成后再回到竖屏继续逐段阅读。
如果系统锁定了屏幕方向，页面仍会适配当前宽度，不要求用户必须旋转设备才能访问任何核心内容。
- 查看宽图时可横屏
- 长文阅读可回到竖屏
- 方向锁定不影响核心功能
平板适合怎样浏览
平板比手机有更大面积，同时仍以触控为主。页面在常见平板宽度下可能保留两列内容，让你在不牺牲可读性的前提下看到更多主题。
触控环境下不应依赖鼠标悬停才能获得重要信息，因此标题、摘要和链接会直接显示。即使连接键盘，也可以继续使用Tab和Enter访问核心导航。
如果你在平板上分屏使用浏览器，实际可用宽度会接近手机。页面会根据视口而不是设备名称调整布局，所以分屏时自动变成更紧凑的单列属于正常表现。
- 触控无需悬停
- 分屏按实际宽度响应
- 外接键盘同样可用
桌面端如何快速扫读
桌面宽屏更适合同时查看多个内容摘要。在线视频索引会在可用空间足够时使用多列布局，把不同主题放在同一视野中，减少频繁滚动。
扫读时可以先关注每个模块的H2或H3，再看摘要中的关键词。如果当前目标非常明确，例如只找App信息，直接使用顶部导航或页脚入口比从首页逐段向下滚动更快。
对需要长期打开的页面，可以把一起草、视频索引和指南分别放在不同标签页中。页面没有依赖单页应用路由，因此刷新或复制地址不会丢失当前页面身份。
- 宽屏适合多列对比
- 明确目标可直接使用导航
- 刷新页面不会依赖前端路由
浏览器字体与系统字体
站点使用系统字体栈，不依赖外链字体。这样可以减少外部资源失败对正文显示的影响，也能更自然地使用设备上熟悉的中文字体。
不同操作系统的字形和字重可能略有差异，但标题层级、正文尺寸和颜色对比会保持一致。若系统启用了高对比度或自定义字体，浏览器可能进一步调整显示。
当你发现文字过细或过密，可以优先调整系统显示设置或浏览器缩放，而不是依赖页面提供额外字体下载。
- 无外链字体依赖
- 不同系统字形可能略有差异
- 可结合系统显示设置调整
弱网环境下的阅读策略
核心文字由服务器直接返回，因此在网络较慢时通常会先出现HTML内容，再等待图片和脚本等资源完成。你可以先阅读标题、摘要和正文，不必等所有图片加载完成。
如果某张WebP图片迟迟没有显示，不会阻断站内链接。需要节省流量时，也可以使用浏览器的数据节省功能或关闭自动图片加载，再利用文字内容完成导航。
若页面本身长时间无响应，可以尝试重新连接网络或稍后刷新。持续出现5xx状态则更可能是服务端问题，与单张图片加载失败不同。
- 文字可先于图片阅读
- 图片失败不阻断导航
- 区分资源失败与服务器失败
高DPI屏幕与图片清晰度
高分辨率屏幕会让文字和界面更细腻，但图片实际清晰度仍取决于部署的WebP资源。源码只规定固定文件名，不会把低清图片自动放大成更高质量。
如果图片像素不足，浏览器放大会出现模糊，这不会影响正文语义。部署时应为常用展示区域准备足够分辨率的原图，同时控制文件体积，避免高分辨率图片拖慢移动网络。
页面使用object-fit等规则控制视觉裁切。对于含有重要文字的信息图，不应依赖裁切区域传达唯一信息，关键说明仍应出现在正文。
- 清晰度取决于实际WebP资源
- 高分辨率图片需兼顾体积
- 重要信息不要只放在图片里
减少动态效果带来的不适
如果操作系统开启“减少动态效果”，页面会尽量缩短动画和过渡。当前站点本身没有复杂自动轮播或大幅运动背景，因此主要阅读不会依赖持续动画。
对容易因运动效果感到不适的用户，保持静态内容和明确焦点位置通常更友好。移动导航的开关也以直接显示与隐藏为主，不需要观看长时间动画。
浏览器扩展如果额外注入动画，可能超出站点自身控制范围。出现异常时可以在无痕窗口检查是否与扩展有关。
- 尊重系统减少动态设置
- 主要内容不依赖动画
- 异常动态可排查浏览器扩展