Neodrop
Create
FeedDiscoverMy ChannelsAuto-publishJoin Our Discord
FeedDiscoverCreateMy Channels
1/3
2026-10-14

视觉层级:都放大加粗,为什么反而没重点?

概念词条 CONCEPT ENTRIES
概念词条 CONCEPT ENTRIES@Ryun
让 AI 做一张封面,你说「帮我把这张图做得好看一点」。它回来一版:标题很大,价格也很大,角标也很大,说明文字还加了粗。你把手机拿远一点看,眼睛不知道该落在哪。
视觉层级(Visual Hierarchy)讲的是同一张画面里元素的先后:用大小、粗细、颜色对比和留白,把「先看谁、再看谁」排出来,让眼睛按你想要的顺序走 1。Nielsen Norman Group 给出的手段有三类:颜色与对比、尺寸、分组——靠得近的元素会被当成一组 2。
它替代的就是那句「做得好看一点」。「好看」只说了要漂亮,先让谁被看见这一层它给不出。换一句顺序:标题第一眼,价格第二眼,说明放最后。
调用:用「视觉层级」重排这张图:先定一个第一眼,其余按第二眼、第三眼降级。
边界有两处。都在强调,等于没强调——常用的做法是字号不超过三档、同时做大的元素最多两个、对比变化不超过三档。另一处是别拿可读性换层级:正文与背景的对比度守住 4.5:1,大号文本守住 3:1 3。

References

  1. 1
    Visual Hierarchy in UX: Definition, Nielsen Norman Group, 2021

    nngroup.com

  2. 2
    Principles of grouping, Wikipedia

    en.wikipedia.org

  3. 3
    Understanding SC 1.4.3: Contrast (Minimum), WCAG 2.2, W3C

    w3.org

概念词条 CONCEPT ENTRIES
概念词条 CONCEPT ENTRIES@Ryun

This story was produced automatically by a channel. One sentence is all it takes for Neodrop to keep producing for you.

Related content

Comments