赵倩
摘 要 本文对网页设计中视觉构成要素——文字、图片、色彩等进行了分析,并结合人们在浏览、阅读时的视觉习惯和认知心理,探讨了在网页设计中如何通过视觉元素优化信息的传达方式,提升用户获得目标信息的效率。
关键词 网页设计 视觉元素 信息传达
中图分类号:TP3 文献标识码:A
在现代社会,网络已成为信息传播的重要渠道和交流工具。网络是一个处理、传达信息的平台,区别于传统的媒体而言,网络具有信息繁杂、高速高效、人机交互等特征。设计者必须充分了解网络的特征,利用视觉元素将成千上万的信息进行处理,以清晰的脉络和有序的方式呈献给浏览者。让信息更为有效地传播,是身处于信息化数字化的今天设计者所必须具备的基本能力。
1国内网页设计中信息传达存在的问题
縱贯国内的网页设计,普遍存在内容排列杂乱、巨量信息堆积而缺乏条理化等问题。这造成浏览者视觉疲劳,在网页浏览的过程中找不到重点。例如,标题栏与正文的字体大小、粗细没有区分,色彩方案混乱,没有统一的主题色,这些都导致用户在浏览网页时注意力被各个强调的部分分散,没有清晰的视觉流起点与路线,因此不愿在网页中长时间停留或进行后续的访问浏览。
2网页设计中的视觉要素分析
文字、图形图像、色彩和版式是网页设计中视觉呈现的主要构成内容,是组织信息的重要手段。一个优秀的网页设计,其成功之处不仅在于视觉元素的综合运用给人们带来的美的享受,同时也体现在信息传播的有效性。
2.1文字元素
在网页设计,文字是传达信息的重要媒介,除了具有传达内容本身的功能,还能激发情感因素和心理因素,不同字体会在品牌形象的传达上产生潜移默化的影响。例如,汽车营销类的网页设计中,多采用具有男性化特征的无衬线粗体字,而时尚、美容、服饰等行业网页中多采用多装饰、纤细的衬线字体。另外,充分利用字体大小、粗细对于人们视觉诱导力的强弱作用,可以突出重点内容与主题,帮助浏览者用最短的时间找到目标信息。此外,文字编排密度,如字距、行距等会影响浏览者的视觉流,具有良好层次的文字编排可以帮助用户梳理出清晰的阅读路线,在密密麻麻的海量信息中进行自由、流畅的选择。
2.2图形图像元素
相对于文字的信息传达,图片和图形更为直观和生动。与书籍等传统媒体不同的是,浏览网页的过程是连续的,可选择的,用户对信息的接收是非单线性的。信息的隐藏、展开以及跳转在很大程度上依赖于图形的引导。设计师要考虑用户的认知心理,从造型、色彩出发,注意图形语义表达的准确性,让图形与浏览者认知熟悉度相适应。例如,在网页设计中左右翻页与返回顶部的按钮设计,多采用人们日常生活中熟悉的箭头来引导,这样可以减少用户对于这一图形寓意的认知时间,从而留下易于操作的良好印象。基于对常用符号的认知程度,人们可以根据自己的需求将内容展开或关闭,保持页面的简洁。
2.3色彩元素
色彩是网页设计中具有高刺激性的视觉元素,可以表达感情,唤起情绪。例如,红色让人产生冲动、热情的感觉,绿色代表了希望和健康,白色给人纯净、清洁的感受。很多网页设计利用了色彩的情感象征。例如浪琴手表的官网采用了给人沉稳、低调感受的深蓝色,恰如其分地传达了该品牌形象;索尼官网采用黑色为背景色,代表未来感与科技感的湖蓝色为主题色,色彩方案一致,层次清晰。
2.4版式元素
网页设计中,信息密度和位置会影响人的信息搜索的效率,这要求设计师善于运用合理、清晰的版式布局安排信息。例如,根据人们从左到右、从上到下的阅读浏览习惯,网页中的导航、动态等重要信息一般安排在网页中的左侧或顶部,方便人们搜索。
3优化信息传达的设计方法
3.1对比与调和
对比是指具有明显视觉差异因素的并置,如色彩对比、大小对比、虚实对比等;调和是指在不同视觉元素中寻找协调的因素。运用到网页设计中,体现为弱化背景信息,减少其与目标信息的相似性。例如,文字的大小据内容的重要性而有所变化,重要信息可适当采用高明度、高饱和度的色彩进行强调。但要注意色彩的选择数量与面积,达到整体页面的调和一致。
3.2对称与均衡
所谓均衡,是指两种不同色块、形状、密度等在视觉体量上的稳定感。在很多川字型的版式布局中,小面积的部分常采用深色,安排导航栏等,大面积的内容区域,通常为浅色,达到视觉重心的平衡。对称是一种最简单的均衡,例如在图像处理的排版中,很多网站采用方形图这样大小统一、间距一致的对称方式,方便用户在整齐有序的排列中找到自己感兴趣的内容。
3.3节奏和韵律
节奏产生于对立视觉元素的并置和连续呈现,韵律产生于节奏。色彩、比例等特征的重复形成了节奏,利用版式的重复、图形、色彩等相同元素的重复让用户快速适应网页板块分布特征,易于使用。
4结语
设计最终是为人服务的,把用户需求放在第一位是网页设计发展的趋向,也是设计伦理中以人为本的重要体现。如何运用视觉元素,减少干扰,提高浏览者在接收信息过程中的效率,从而提升其体验的愉悦度,是网页设计追求的重要目标。
参考文献
[1] 恵岩,顾群业.网页艺术设计[M].济南:山东教育出版社,2012.
[2] 侯慧俊,钱永宁.网页界面设计创意指南[M].上海:上海科学技术文献出版社,2009.
[3] 鬲波飞.网页设计之视觉信息传达分析[J].湖南大学学报(社会科学版),2001,15(4):187-189.