焕新颜,更出彩:Firefox 89 的这些改变值得关注

6 月 1 日,Firefox 89 进入稳定版推送通道,带来了自 2017 年 Firefox Quantum 问世以来最大的界面改动,以及众多细节改进。Mozilla 在博客中写道,设计师们权衡并简化了 Firefox 的交互体验,使其更易于在每台设备上使用,帮助用户提高效率、减少干扰。[1]

这一版本究竟带来了哪些新功能,有何亮点与不足?我们不妨在这篇文章中一探究竟。

注意:本文撰写于 6 月 1 日前,基于 Firefox Nightly 测试版本介绍。

全新的 Proton 设计语言

2017 年发布的 Firefox Quantum 采用了被 Mozilla 称为 Photon 的设计语言,Firefox 89 的界面设计则被命名为仅一字之差的 Proton。这可能与新版的重构思路有关,Firefox 设计团队调研了广大用户的日常使用习惯,绘制了如下图所示的交互热力图[2],希望在一次大版本更新中重新设计 UI 组件,并解决长期遗留的问题。因此,Firefox 产品高级总监 Mikal Lewis 表示,这次改版更像是在原版的基础上,由数不清的细节改进构成的整体。而最终呈现的效果,却大不相同。

Firefox 88 的工具栏交互热力图

从上图中,我们不难发现,在原版设计中,地址栏右侧的几个按钮利用率极低,更不用说二级菜单中的项目了。因此,Mozilla 已经在 Firefox 88 中将「截图」操作转移至右键菜单,89 则更进一步,移除了整个「页面动作」菜单。别担心,里面的老朋友都还在,右键单击标签页,选择发送到其它设备,也是更符合直觉的方法。Mozilla 力推的稍后阅读工具 Pocket 优先级再度提升,于主工具栏上占据一席之地。

Firefox 89 的工具栏设计

当然,不使用 Pocket 的同学大可点击「定制工具栏」,将 Firefox 改造为自己理想中的模样。图标重绘之外,这一功能与以前没多大差别,标题栏、工具栏与书签栏均支持高度自定义。「选项」、「附加组件」更名为更常见的「设置」、「扩展和主题」,从上个版本开始,截图也能添加到工具栏了。将视线转向底部,依然是熟悉的工具栏选项和主题管理。然而,点开密度菜单,问题就来了:我那么大一个紧凑布局呢?

定制工具栏

年初开始测试的 Proton 早期版本中,Mozilla 本打算完全移除 Firefox 的紧凑布局,原因你大概也能猜到:切换入口过深,难以被用户发现。[3]为了确保新版的默认配置适合大多数人,Mozilla 决定将其与普通布局合并,但仍为触屏设备用户保留触控布局。不用说,这一决策激起了社区的强烈抗议,妥协结果是只对新用户隐藏相关选项,并且可以自行配置显示。

如果你全新安装了 Firefox,想试试紧凑布局,只需在地址栏键入 about:config,选择接受风险并继续,然后搜索 browser.compactmode.show,将值切换为 true,即可在「定制工具栏」界面自由切换布局。但这并不代表万事大吉,Proton 的界面元素间距比旧版更宽,紧凑布局也只是略窄于原来的普通布局,对显示面积就是生产力的网页浏览器来说,着实有些倒退。

显示紧凑布局按钮

部分浏览器的工具栏高度对比

抛开些许不快,让我们来看看 Proton 设计语言的整体效果吧。简化工具栏布局、去除分隔线、收窄图标线条等措施多管齐下,Firefox 89 给我留下了更加清爽的印象,设计的一致性也更强。尽管在其它地方竭力减少 UI 层级,塑造扁平化体验,活动标签页却采用了浮动设计,与背景区分,直观明了。此外,后台标签的音频控件已合并至网站图标,不会多占一个位置了。

Firefox 89 的新标签页

菜单也得到了重新梳理,工具栏最右侧的应用程序菜单中,选项前的图标已不见踪迹,排序也有所变化。「我的足迹」被拆分为书签、历史、下载三项;编辑控制成为了工具栏中的独立按钮;定制工具栏等不常用功能统一收纳进「更多工具」;所有按钮均依照用途组织分类。在 Windows 平台,右键菜单由系统样式改为更美观的 Proton 风格;macOS 恰好相反,从带有 Firefox 特色的自定义样式换成了不加修饰的原生风格。

Windows 客户端菜单样式对比

除了桌面客户端,Firefox 移动版应用也迎来同步更新,为全平台换上 Proton 界面设计。Android 客户端将「受同步的标签页」从菜单栏调整至标签管理界面,新增手动同步按钮,使用更方便。Mozilla 还与 WebCompat 合作,允许用户报告无法正常渲染的网页,由志愿者请求网站所有者修复。iOS 客户端同样改进了标签页逻辑,并提升搜索体验,在地址栏添加搜索引擎图标,打开新标签页时自动弹出键盘。比较可惜的是,Android 版 Firefox 重构至今,仍未针对平板设备优化,希望 Mozilla 能在日后带来接近 iPadOS 的体验。

新版 Firefox 移动客户端

不容错过的其它细节改进

一望即知的设计革新之外,Firefox 89 还提供了例行的问题修复及功能改进,我们不妨在本节发掘这些潜藏于水面下的改动。

更严格的隐私保护策略

作为 Firefox 的主打卖点之一,Mozilla 一直在实践个人隐私保护领域的前沿技术。在 Firefox 89 中,隐私浏览模式会强制启用 Total Cookie Protection 特性,阻止所有跨网站 Cookie,包括但不限于跟踪性内容。你也可以在「隐私与安全」设置中启用增强型跟踪保护的严格模式,将它应用到所有窗口。Firefox 89 还带来了第二代 SmartBlock 功能,使用本地组件替换第三方脚本,拦截在线跟踪器的同时,保证网站正常运作。

增强型跟踪保护

macOS 客户端的一大步

Firefox 89 解决了 macOS 客户端的诸多历史问题,在广色域显示器上,网页颜色将不再过饱和;未标记的图像将被视为 sRGB,标记为 sRGB 的图像颜色将与 CSS 匹配;全屏浏览时,将鼠标指针移动至屏幕顶部不会导致标签栏被系统菜单栏遮挡,并提供隐藏工具栏的选项。更振奋人心的是,滑动至页面底端将触发弹性滚动效果,在触控板上两指双击还能缩放聚焦的内容。

智能缩放

新技术助力性能表现

Firefox 89 介绍了一种 Web 表单控件的非本机实现,提供全新的现代设计,改善了网页加载性能。在开发者方面,Firefox 89 已支持 Event Timing API 和 CSS 强制颜色查询,前者允许页面测量从用户首次交互到浏览器实际处理事件的延迟,后者将在操作系统启用高对比度等特殊配色方案时激活,确保更好的无障碍兼容性。

结语

近些年来,Firefox 的几乎每次界面改版,都会招致社区的巨大争议。虽然我同样对 Proton 砍掉紧凑布局感到不满,但 Mozilla 的不断探索却不应被否定。在微软「叛逃」Chromium 阵营后,独立的 Firefox 的存在更显得弥足珍贵,我也由衷希望为自由而生的 Firefox 能越来越好。

Firefox 89 正式版已于 6 月 1 日面向全球用户推送,如果正使用其它浏览器的你也跃跃欲试,可以前往 Firefox 官方网站 下载使用。