让你的bnner图套路走的更深！

俗话说一个人如果美感十足，总会得到更多人的注目。那么网页设计的美感对于用户的第一印象是非常重要的，而网页给用户的第一印象很大程度上取决于网页的视觉设计。现在的网页虽然多种多样，但是出于视觉化设计的目的，大多会使用大图背景，或者超大尺寸的Banner。当用户首次打开网页的时候，映入用户眼帘的铺满的Banner图 ，是影响视觉设计的关键因素，它有个专门的术语是 Hero image，我们通常称之为首图。所以，网页首图的设计需要特别用心才能达到想要的效果。网页首图不仅仅是一张漂亮的图片，它还应该是强大的视觉传达工具。谈情怀不如讲套路，今天的文章，我们赛邦软件就通过一系列最佳实践来为你展示首图设计的一些设计“套路”。

1、使用相关图片很重要，要精挑细选

合适而好的图片能够提升整体体验，而不合适的图片选择则可能毁掉整个设计。在选取图片的时候，尽量选择贴合主题内容的，主题要一致，主旨和目的相匹配的图片要合适，这样可以避免用户的预期和内容产生割裂感。就像讨厌标题党一样，用户会因为首图和内容的不匹配而对网站内容失去信任，从而不会在该页面上停留。

2、让首图成为核心，承载内容的重要容器。

若想要让内容不同凡响，又能够从整个设计中脱颖而出，那么就要用好首图的效果了。在视觉上设计优秀的首图能够让用户每次打开网站的时候都为之驻足，多停留的价值有可能就会产生交易的信息量。

在首图的设计上，苹果每次都为我们提供了最优秀的案例。这里需要注意一下的是首图并不需要将所有的信息都呈现出来，相反首图应该是强调重点，将最突出的部分强化并呈现出来，正所谓重要的才最抢眼。

3、一定要高清，这个要重视。

低素质的图片是非常容易让人产生疏离感的，在高清屏幕到处都是的今天，模糊不清的图片是无法接受的。想要用户对你的网站拥有积极的情绪，那么图片的素质一定要有保证，高素质的图片能够让用户准确地获得信息，清晰的图片总能让人看着更加舒服。

4、强化CTA按钮

网页首图常常和行为召唤（CTA）按钮搭配着使用。由于首图配图通常在视觉上极其突出，但是搭配有行为召唤按钮的首图，其本质上是用来吸引用户，传递信息，并引导用户去点击按钮的，所以行为召唤按钮和视觉信息丰富的图片之间，不应该互相干预，而是通过设计，让CTA按钮更加突出，让图片处于辅助的位置，最终达到吸引、引导的目的。

5、拿出情感化的设计

将情感融入设计，并且用情感来说法用户，才是首图的设计之道。只有能够触动用户情绪的设计更具有说服力。积极的情绪刺激能够更好的建立用户和你的网站之间的互动感。情感很重要。

很多时候，我们使用创意也好，借助热门IP也好，精心打磨文案也好，也只是希望让首图能够让用户惊喜、喜欢、需要，最终是要通过它调动起用户的情绪。

6、控制对比度，是设计中的重点

首图中的文本和排版也需要用心设计，通常需要选择加粗且易读的字体。如果你的图片和文字叠加到了一起，那么需要注意背景的图片和前景的文字之间的对比，确保文本是能够被清晰分辨的。通常，设计师会在图片上叠加上一个半透明的有色图层来降低反复色彩的视觉信息量和干扰。

7、兼顾不同的屏幕尺寸，如响应式的设计

如今的内容都需要考虑跨平台、跨设备、跨平台的兼容和适配性，当你的图片出现在不同尺寸的屏幕上的时候，它是否能够正常显示，正确显示，并且符合不同平台、不同屏幕的显示需求。

 1/2    1 2 下一页 尾页