字体搭配是网页设计中至关重要的一环。一个好的字体组合能提升阅读体验、传达品牌调性、增强视觉层次感。通常建议将一款具有表现力的标题字体与一款易读的正文字体搭配使用。衬线字体搭配无衬线字体是最经典且稳妥的组合方式。
选择字体时需考虑：字体的 x-height、字距、笔画对比度等因素。标题字体可以更具装饰性，而正文字体则应以可读性为首要目标。Google Fonts 提供了大量免费、开源的 Web 字体，是设计师和开发者首选的字体资源库。
经典组合: 衬线 + 无衬线（如 Playfair Display + Source Sans Pro）
现代风格: 无衬线 + 无衬线（如 Inter + Roboto）
优雅风格: 手写体 + 衬线（如 Cormorant Garamond + Lora）
技术风格: 等宽 + 无衬线（如 Fira Code + Inter）
规则: 同一种分类的字体通常不太适合搭配，除非有明显的大小/粗细对比。
一个稳妥的原则是：选择一款标题字体和一款正文字体，确保它们有足够的对比度（如衬线+无衬线）。避免使用两款过于相似的字体。建议先确定品牌调性，再选择匹配的字体风格：正式场合选衬线，现代简约选无衬线，创意设计可选手写体或展示字体。
使用 @import 或 加载 Google Fonts 时，建议仅加载需要的字重和字符集。例如：?family=Roboto:wght@400;700&subset=latin。同时可以使用 font-display: swap 确保文字在字体加载期间仍然可见，避免 FOIT（Flash of Invisible Text）。
中文字体文件较大，建议仅加载常用字重（如 400/700）。中英文混排时，可为中文和英文分别指定字体：font-family: 'Noto Sans SC', 'Inter', sans-serif。推荐的中文字体搭配：Noto Sans SC + Noto Serif SC，或思源黑体 + 思源宋体。