指南 · 阅读约 7 分钟

人脸与焦点:让一个元素不可能被忽视

如何围绕一个焦点(通常是人脸)构建封面,让它在 168×94 下一眼就能看懂,附尺寸、摆放规则和测试方法。

快速答案

每张封面只给一个焦点,约占画面的 25–45%。如果焦点是人脸,就裁得紧一些,让脸至少占画面的 10–15%,只呈现一种清晰的表情,并保证眼睛和嘴巴周围有良好对比。把它放在左侧或中间三分之一,远离右下角,再用眯眼测试和细节热力图确认它是视线最先找到的东西。

1视觉核心主体
168×94清晰度检测尺寸
0.09清晰度指标

为什么只要一个焦点

信息流是一格格互相竞争的图片。视线通过快速注视在它们之间跳跃,只在明显突出的地方停下。有一个主导形状的封面给了视线落点;五个同等元素的封面让视线无处停留,于是滑走。

关于人们如何浏览网页的研究描述了这种模式:人们不会阅读每个元素,而是扫视寻找信号,跳过其余部分。在 168×94 像素下这种效应更强,因为小细节消失了,只剩下最大、对比最强的形状。

“用户常以 F 形模式阅读网页”

F-Shaped Pattern of Reading on the Web — Nielsen Norman Group · 引文译自英文原文

人脸或主体应该多大

尺寸是最重要的单一因素。占画面 3% 的人脸在侧栏尺寸下只有几个像素宽,看不出表情。ThumbProof 会在检测到的人脸面积不足画面 4% 时发出提示,并把占 5–60% 的最繁忙区域视为健康的主体。

人脸面积(占画面比例)在 168×94 下表情可读?结论
< 4%脸约 12 px 宽否太小
4–10%约 20 px 宽有时临界
10–25%约 30–45 px 宽是良好
25–45%约 45–60 px 宽清楚很强
> 60%占满卡片是,但没有空间放背景信息慎用

对于产品、菜品或成果等非人脸主体,同样的比例适用于物体的轮廓。

小尺寸下仍能看清的表情

细微的表情在图片缩小后会消失。睁大的眼睛、张开的嘴、扬起的眉毛和明显的歪头能保留下来;浅浅的微笑或沉思的神情则不能。这并不是说每张封面都需要夸张的脸,但表情应在侧栏尺寸下可读,并与视频的基调一致。

光线和表情同样重要。拍摄或后期时让脸比背景更亮,并用清晰的阴影勾勒出眼睛和嘴巴。平光、正面光会让脸在变小后看起来像一个空白的椭圆。

  • 眼睛和嘴巴清晰
  • 脸比背景亮
  • 表情与视频基调一致
  • 一张脸比三张脸更有力

位置:三分法、视线方向与角落

把焦点放在画面左侧或中间三分之一。这样它远离右下角的时长角标,并把上方留给两三个词。如果人物看向某个东西——物品、文字、结果——观众的视线往往会跟随,所以让主体朝向画面内部而不是外部。

不要把脸放在最底部,那里会被进度条和圆角切到;也不要把文字压在眼睛或嘴巴上。

位置适合注意
左侧三分之一人脸 + 右上方文字文字避开角标区
中间单一物体、对称构图文字只能放在上方或下方
右侧三分之一从文字读到人脸的顺序脸可能与角标冲突

五步构建并检查焦点

  1. 01

    选定主体

    选出能讲述视频故事的那一张脸、一件物品或一个结果。

  2. 02

    裁紧

    放大到占画面 25–45%;如果是人脸,至少 10–15%。

  3. 03

    打光并分离

    让主体比背景亮,并加上轮廓光或边缘。

  4. 04

    放在三分线上

    左侧或中间,朝向画面内部,避开右下角。

  5. 05

    验证

    做眯眼测试,打开细节热力图,并查看评分拆解中的主体一行。

ThumbProof 如何检测人脸和主体

部分浏览器通过 Shape Detection API 提供内置人脸检测器。可用时,ThumbProof 会在本地用它统计人脸数量并测量它们覆盖画面的比例。不可用时,工具根据边缘密度估算主体:把图片分成 16×9 的网格,找出最大的高细节连通区域,并报告它占画面的比例。

两种方法都完全在你的浏览器中运行,不会把图片发送到任何地方。估算结果是参考,不是定论。杂乱的背景在边缘检测器看来可能像一个大主体,这正是热力图视图有用的原因:它准确显示细节在哪里。

没有人脸时

很多出色的封面里根本没有人:一件成品、一组强烈的前后对比、一张地图、一张带有醒目数字的图表。规则相同——一个主体、够大、有对比——只是你需要通过构图、色彩和文字而不是表情来营造情绪。前后对比的分屏在 168×94 的灰度下仍能看出差异时效果最好。

加入辅助元素而不分散焦点

单一焦点并不等于只有一个元素。大多数出色的封面有一个主导主体加一个辅助元素:一个词、一件物品、一个箭头或第二张更小的脸。辅助元素应明显更小——约为主体的三分之一到一半——并通过视线、位置或颜色指回主体。

背景同样重要。模糊或压暗的背景会把主体推到前面;清晰而细节丰富的背景则会与之竞争。如果你自己拍摄,使用大光圈或在后期加模糊,并把背景亮度比主体降低 20–40%。

元素相对大小作用
主体100%视线最先落下的地方
辅助元素30–50%补充背景或反转
背景柔和、更暗衬托而不竞争

系列视频保持一致

如果你发布系列或固定栏目,就复用构图:人脸在同一侧,文字在同一位置,同一个强调色。回访观众会记住这种模式,在拥挤的信息流中更快认出你的视频。每期更换表情、物品和文字,但保留骨架。

同时,避免反复使用同一张脸部照片。如果每张封面都是同样的惊讶表情,观众就不再把它当作信号。每次录制时多拍几种表情,再挑与每期内容最匹配的那一张。

  • 系列使用相同的版式骨架
  • 变换表情和物品
  • 每期多拍几个备选

实例:合影与特写

一张 vlog 封面展示四个朋友在海滩上,人物在画面里很小,背后是夕阳。每张脸约占画面 1%。热力图显示细节均匀分布在地平线上,主体估算为 68%,意味着没有单一焦点。

重新设计后裁成一位朋友大笑的特写,脸占画面 18%,放在左侧,夕阳作为柔和背景。主体估算降至 31%,在侧栏尺寸下也能看清脸。

指标合影特写
最大人脸约占画面 1%占画面 18%
主体估算68%(分散)31%(清晰)
眯眼测试没有清晰形状人脸突出
168×94 下可读否是

常见的焦点错误

人脸太小

远景原尺寸很好看,在信息流中却无法辨认。

多个同等主体

三张同样大的脸会分散注意力。让其中一个占主导。

文字压在脸上

它会挡住最易辨认的元素。把字移到旁边。

脸在角标角落

时长角标可能遮住下巴或眼睛。

平光

没有阴影,脸在小尺寸下会变成空白形状。

表情与内容不符

平静的教程配上震惊的脸,会给出错误预期。

FAQ

相关问题解答

有人脸的封面效果更好吗?

人脸识别快、能吸引注意,但只有在够大且有表情时才有效。一个有力的物体或成果同样可以奏效。

封面中的人脸应该多大?

至少占画面 10–15%,这样在 168×94 下依然可读。低于约 4% 时表情就消失了。

人脸应该放在哪里?

左侧或中间三分之一,朝向画面内部,远离出现时长角标的右下角。

封面上应该有几张脸?

通常一张最有力。如果需要两张,让其中一张明显更大,或使用带清晰分隔线的分屏版式。

ThumbProof 如何检测人脸?

可用时使用浏览器内置的人脸检测器,否则根据边缘密度估算主体。两种方式都在本地运行。

如果视频里没有人怎么办?

用一个大的物体、成果或对比作为焦点,并保持强对比。同样的尺寸和摆放规则适用。

参考来源

文中规格与数据已于 2026年10月27日 对照以下公开资料核对。平台规则会变化,重要发布前请到官方帮助页确认限制。

  1. Accelerated Shape Detection in Images (FaceDetector) — W3C WICG draft
  2. F-Shaped Pattern of Reading on the Web — Nielsen Norman Group
  3. Add custom thumbnails — video platform help center
继续阅读

相关指南与工具