AAsteriadne

website

web.dev

所属分类：开发者在线工具箱

Chrome 团队与外部专家撰写的 Web 开发课程、文章与 Baseline 资料。

编程学习

web.dev 是 Google Chrome 团队与外部专家共同维护的 Web 开发资料站，内容包括学习课程、技术文章、案例研究，以及 Baseline 浏览器支持信息。站点的目标是帮助开发者构建能在各类浏览器中正常使用的网站，覆盖无障碍、性能、设计和安全等主题。

web.dev：按主题学习 Web 平台，并查询 Baseline 功能支持状态

发布于 2026年10月18日更新于 2026年10月29日

首页：从主题进入 Web 平台

web.dev 首页的标题为 “Building a better web, together”，副标题写明站点提供能在任何浏览器上运行的现代 Web 体验指南。站点说明，内容由 Chrome 团队成员与擅长无障碍、性能和设计等领域的外部专家撰写。

首页下方是 Explore the web platform 部分，按 HTML、CSS、JavaScript 三个方向引导读者进入 Web 平台的各个部分。主题卡片还包括 AI and the web（与 AI 相关的 Web 资源）、Optimize INP（优化交互到下一次绘制的延迟，INP 已成为 Core Web Vitals 指标之一）和 Payments & Identity（支付与身份验证相关功能）。

web.dev 首页，顶部为 Resources、Discover、Baseline 等导航，正文标题为 Building a better web, together，下方有 AI and the web、Optimize INP、Payments & Identity 三张主题卡片

学习课程

web.dev 的 Learn web development 页面收录了一系列课程，每门课程由行业专家编写，并得到 Chrome 团队成员的协助。读者可以按顺序学习，也可以只挑选感兴趣的主题。页面列出的课程包括 Learn HTML、Learn CSS、Learn JavaScript、Learn AI、Learn Performance、Learn Privacy、Learn Accessibility、Learn Images、Learn Design、Learn Forms 和 Learn PWA 等，左侧导航还列出 Testing 和 Responsive Design 等主题。

文章：可变字体与用户偏好

web.dev 的文章区收录了大量单篇技术文章。例如 “Adapting typography to user preferences with CSS”（用 CSS 让字体适应用户偏好），作者为 Adam Argyle。文章讲解如何用 CSS 媒体查询配合可变字体，根据深色模式、高对比度和低对比度偏好，通过 font-variation-settings 调整字重与字形粗细。文章先介绍搭建演示所需的标记与样式，再分别讲解默认、高对比、低对比与深色模式下的设置。

web.dev 文章页面，标题为 Adapting typography to user preferences with CSS，作者 Adam Argyle，正文开头介绍如何根据用户偏好调整字体，页面顶部有 Home 与 Articles 面包屑导航

Baseline：查看功能的浏览器支持

Baseline 页面说明，它提供 Web 平台功能在各浏览器中的可用性信息，帮助读者判断某项功能能否直接用于项目。Baseline 最初由 Chrome 团队提出，由 WebDX 社区组定义。

Baseline 分为两个阶段。Newly available 指功能已被所有核心浏览器支持，因而具有互操作性；Widely available 指从达到 Newly available 之日起已经过去 30 个月，大多数网站都可以放心使用。在此之前，功能处于 Limited availability 阶段，即尚未在各浏览器中得到普遍支持。页面写明的核心浏览器包括桌面与 Android 版 Chrome、Edge、桌面与 Android 版 Firefox，以及 macOS 与 iOS 版 Safari。