网页设计中的图形表示

我想大家都知道图片是网页的基本元素之一。图片不仅可以增加网页的吸引力，向用户传递更丰富的信息，还可以大大提高用户阅读网页的体验。在网页设计中，图片会在多种情况下展示，而图片在不同情况下的展示也让阅读网页的乐趣更加多样。

让我们的目光随着分离而旅行，体验当下的各种展示情境。

多画面显示

图像被限制为最大高度或宽度，并以矩阵图块的形式显示，这是最常见的多图像显示案例。不同的边距和距离会导致不同的风格，用户可以通过快速阅读在短时间内获得更多信息。同时，鼠标悬停时，会显示更多的信息或功能按钮，既避免了太多重复的元素干扰用户阅读，又让交互变得有趣。传统的矩阵显示布局略显拘束，阅读体验有些乏味。

在传统的矩阵瓦片布局中，500px.com基本摆脱了图片的大小一致性约束，图片以基本区域单元的1倍、2倍、4倍大小显示。不同大小的图片打破了重复带来的密集感，但仍然按照基本的面积单位排列，增加了信息流动的动态感。不规则的图片给阅读带来乐趣，但由于视线的不规则流动，这种显示情况不利于信息搜索。

Pinterest的瀑布错落有致，定宽变高网站设计让页面突破传统的矩阵图片展示布局，视觉层次的巧妙运用，视线的随意流动缓解视觉疲劳。用户可以快速浏览众多图片，并从中挑选出自己感兴趣的图片。但这也让用户在阅读时容易漏掉一些内容。

允许用户在最大化图像显示的同时查看相册中的其他内容。接下来的部分预览更能吸引用户持续点击阅读。下一个缩略图显示，下一个模糊显示，或者下一个局部显示，不同的预览方式都在激发着用户的好奇心。

在Photodom 中，用户在查看特定图像时不会提供下一张图像的预览，只有当用户将鼠标悬停在“下一张”按钮上时，才会出现下一张图像的缩略图。虽然缩略图的动画效果不允许用户幻想预览，但短暂的刺激会提示用户单击“下一步”。