网页banner设计技巧.docx

第PAGE\*MERGEFORMAT9页共NUMPAGES\*MERGEFORMAT9页

网页banner设计技巧

网页banner〔制定〕技巧网页关于用户的第一印象是非常重要的，而网页给用户的第一印象很大程度上取决于网页的视觉制定，出于视觉化制定的目的，〔网页制定〕师大多会用超大尺寸的Banner。下面介绍网页banner制定技巧，希望为大家带来帮助。网页制定师都明白，网页关于用户的第一印象是非常重要的，而网页给用户的第一印象很大程度上取决于网页的视觉制定。现在的网页虽然多种多样，但是出于视觉化制定的目的，大多会使用大图背景，或者超大尺寸的Banner。当用户一打开网页的时候，映入用户眼帘的Banner，是影响视觉制定的关键因素，它有个专门的术语是Heroimage，我们通常称之为首图。所以，网页首图的制定必须要特别用心的。网页首图不仅仅是一张美丽的图片，它还应该是强大的视觉传达工具。谈情怀不如讲套路，今天的文章，我们就通过一系列最正确施行来为你展示首图制定的一些制定"套路'。一定要使用相关图片在挑选图片的时候一定要精挑细选。合适而好的图片能够提升整体体验，而不合适的图片选择则可能毁掉整个制定。在选取图片的时候，尽量选择贴合主题，内容一致，主旨和目的相匹配的图片，这样可以避免用户的预期和内容产生割裂感。就像讨厌标题党一样，用户会因为首图和内容的不匹配而对网站内容失去信任，飞速离去。让首图成为核心首图是承载内容的重要容器。你想要让内容不同凡响，又能够从整个制定中脱颖而出，那么就要用好首图。在视觉上制定优秀的首图能够让用户每次打开网站的时候都为之驻足。小贴士：首图并不必须要将所有的信息都浮现出来，相反首图应该是强调重点，将最特别的部分强化并浮现出来。拿出情感化的制定将情感融入制定，并且用情感来说法用户，才是首图的制定之道。只有能够触动用户情绪的制定更具有说服力。很多时候，我们使用创意也好，借助热门IP也好，精心打磨文案也好，也只是希望让首图能够让用户惊喜、喜爱、必须要，最终是要通过它调动起用户的情绪。积极的情绪刺激能够更好的建立用户和你的网站之间的互动感。一定要高清图片一定不要出现模糊或者像素化的状况，虽然这是一个低级错误，但是很多时候还是难以避免。低素养的图片是非常容易让人产生疏离感的，在高清屏幕到处都是的今天，模糊不清的图片是无法接受的(专门的像素风是另外一种状况)。想要用户对你的网站拥有积极的情绪，那么图片的素养一定要有确保，高素养的图片能够让用户准确地获得信息，清楚的图片总能让人看着更加舒适。强化CTA按钮网页首图经常和行为呼唤(CTA)按钮搭配着使用。由于首图配图通常在视觉上极其特别，但是搭配有行为呼唤按钮的首图，其本质上是用来吸引用户，传递信息，并引导用户去点击按钮的，所以行为呼唤按钮和视觉信息丰富的图片之间，不应该互相干预，而是通过制定，让CTA按钮更加特别，让图片处于辅助的位置，最终达到吸引、引导的目的。按钮的视觉重量应该超过图片的视觉重量。控制对比度对比度是任何制定中都必须注意的点，在制定首图的时候同样必须要注意。首图中的文本和排版也必须要用心制定，通常必须要选择加粗且易读的字体。如果你的图片和文字叠加到了一起，那么必须要注意背景的图片和前景的文字之间的对比，保证文本是能够被清楚分辨的。通常，制定师会在图片上叠加上一个半透明的有色图层来降低繁复色彩的视觉信息量和干扰。除此之外，你还可以使用Scrims技术，这种网页技术能够识别文本，并且让图片和底层的图片之间构成对比，保证可读性。小贴士：如果你打算使用使用图文叠加的方式来制定首图，还应当注意让图片的主体部分是清楚可见，且能够被用户轻松理解的。兼顾不同的屏幕尺寸如今的内容都必须要合计跨平台、跨设备、跨平台的兼容和适配性，当你的图片出现在不同尺寸的屏幕上的时候，它是否能够正常显示，正确显示，并且符合不同平台、不同屏幕的显示必须求。这个时候，你应该多了解一下响应式制定：《响应式网站制定规范》《响应式网站页面导航制定》《响应式Web制定技术》小贴士：结合响应式制定的必须求，你可以使用Cloudinary这样的多尺寸图片生成工具，帮你生成符合响应式图片断点的图片。合计使用插画在网页首图中使用插画能够赋予首图以个性。相比于图片，插画更加个性化，插画的内容更加自由，也更容易控制，从内容到技术均是如此。小贴士：当你打算在首图当中使用插画的时候，请尽量坚持插画和整体制定之间的一致性，尽量让它们看起来来源是相同的。结语网页banner制定绝对是真个制定中最关键的部分之一。选取素养高，有趣的图片，同网站的内容结合起来，参照上面的这些最正确施行，你的网页首图应该能够更上一层楼。网页Banner制定的排版技巧所谓排版，马上文字、图片、图形等可视化信息元素在版面布局