可访问性：为视障用户自动选择更大的文本大小

功能
1

I’ve been asked by one of our users to increase the text size of our instance. Fortunately, this is easy to do for her personally using the interface settings (see https://meta.discourse.org/my/preferences/interface).

She tells me that other sites and apps have the ability to do this automatically if the device has a large font selected.

Discourse used to have dark mode being user-selectable only but this has changed in the last year to be automated (if configured correctly). It would be brilliant to have the same dynamic for text size. Indeed, this is far more important, as visually impaired folk will struggle to find the setting with the text being small.

5 个赞
2

我不确定 @awesomerobot，这是否可以像浅色/深色模式那样自动检测？

1 个赞
3

如果您在浏览器中调整字体大小，Discourse 应该会像其他网站一样进行缩放……但看起来如果您在 iOS 中调整操作系统字体大小，它只会影响应用大小，而不一定会影响网站字体大小。

如果我们使用 font: -apple-system-body;，我们也可以随系统一起缩放（Apple 称之为动态类型）。我认为 Android 会自动执行此操作，并且不需要任何更改……但我会再次确认。

1 个赞
5

在此处尝试一下：

正如我在 PR 中指出的那样，有一些特殊情况需要解决，但它似乎应该按预期工作。

Android 不需要任何额外操作，浏览器已根据系统设置调整字体大小。

3 个赞
6

这是 Apple iOS Safari 为所有网站选择默认缩放级别的设置方法：
前往“设置”->“Safari”->“针对网站的设置”->“页面缩放”->“其他网站”：
50%/75%/85%/100%/125%/150%/175%/200%/250%/300%

参见：https://www.macrumors.com/how-to/make-text-bigger-safari-for-ios/

通过默认仅为 discourse 网站设置 font: -apple-system-body;，我们与广泛使用的段落基础 font-size: 15px 完全不同。

现在，这为所有 discourse 网站引入了一个特殊情况：字体太大。
每个用户都必须为 discourse 网站域名设置一个特殊的缩放级别，例如 85%。
或者，如果用户已经在 Safari 中设置了更高的缩放级别，例如 150%，她现在必须仅为 discourse 域名将其设置为例如 125%。

我强烈建议不要实施此更改！
请撤销此 PR 的合并。

请检查当 iPhone iOS 上的系统字体设置约为 150% 且 Safari 页面缩放设置为 150% 时会发生什么：

  • 对于普通网站，这应该导致 150%
  • 随着对 Discourse font: -apple-system-body; 的新更改，这可能会导致 225% (= 150% * 150%)

据我所知，Android 上的 Chrome 没有：只有 Chrome 界面会根据系统设置进行缩放。
要缩放网站字体大小，请打开 Chrome 并转到“设置”->“辅助功能”->“文本缩放”

7

也许这取决于设备或 Android 版本？这是我用辅助功能设置中放大的系统字体进行测试的结果。浏览器没有变化：

Screen Shot 2022-02-16 at 9.48.56 AM
Screen Shot 2022-02-16 at 9.48.56 AM469×732 184 KB

1 个赞
8

这里只缩放了段落，标题和其他所有文本元素仍然很小！
这是 Chrome 的一种特殊行为，只缩放部分文本 – 搜索“Font Boosting”或查看：

iOS 上可能需要对 text-size-adjust 进行标准化：

1 个赞
9

现在部署到 Meta 后，我注意到了一些意想不到的副作用，不确定为什么在我的开发环境中运行方式不同，将回滚并做进一步研究……现在可能做不了了……它影响了太多与字体大小无关的东西。

2 个赞
10

关于可访问性的一般情况：
我喜欢将段落的基本字体保留为所有浏览器默认设置的 16 像素。

这将使文本大小增加 6-7%（16px/15px = 1.0666）。
对于手机和平板电脑等移动设备来说，这看起来还可以。对于桌面设备来说，这会稍微有点大，而且不寻常。

如果我们这样做，也许可以为非触摸设备实现一些特殊规则，让它们使用 15 像素的基本字体。 （通过检查非触摸设备，我们肯定会错过一些带有触摸屏的笔记本电脑——它们将获得更大的字体大小。）

1 个赞
11

这在使用 IOS 设备时仍然是一个问题吗？我可以增大字体大小，但它不会改变自动换行的大小。我无法访问 Android 手机/平板电脑进行测试。

1 个赞