网页设计中图标描述的最优方法

很多人说设计是力求细节的,在网页设计里表达出的细节就是图标。图标在一个设计里带来了额外的注解并且使设计里的对象和元素引起用户的注意。

请观看网页教学网发布的Photoshop教程:创建有创新力的网站导航

以下介绍的是一个用图标描述的最优方法。当使用图标时,图标的描述包含了一系列的隐喻。这也是在网站导航广泛使用图标和一系列图标组的原因。

隐喻

图标是文字的隐喻,也让人很好地知道隐喻,对于可用性来说,在网站之间有效地进行交流是至关重要的,图标应该是代替文字,最能充分传送信息。用户需要快速地知道图标所表达信息。

使用大家认知的元素和简单的隐喻---用户应该会快速地知道图标所表达信息。作图标时,用一些共同的元素是很重要的,就好像一个屋子(表达“家”)。以下是一些例子:

  • 气泡——评论
  • 信封——E-mail和联系
  • 箭头和硬盘——下载
  • 问号——帮助和常见解答问题
  • 文件夹——文件
  • 号角——论坛
  • 两个环绕的箭头——更新
  • 显示器——视频
  • 放大镜——搜索
  • 字母表——按字母排列
  • 锁——安全
  • 星号——重要标记
  • 鼠标——表示链接还有很多很多。。。

图标附加标签---如果图标还不能明确地表达意思,加上一个小小的标签是非常不错的选择。对于用户来说,文字很清楚表达它的意思,所以可以提高图标的可用性。一般来说,尽量只用几个字来做图标的标签,还有文字用一行。用可以易明的文字和简洁的颜色。

Pixelmator 在它们的帮助导航栏里,很出色地做到这一点了。

当使用图标时

作为一个按钮---图标的功能很类似按钮。用艳丽色彩的元素来代替文字。很多设计都是采用这种方法,而且还可以用很多种其他方法完成。

在按钮上附加文字---按钮上采用图标和文字,这也是一个不错的选择。这样更能够吸引用户的眼球。

另外在Pixelmator 的作品中也有一个很好的例子。这些按钮采用图标和文字。另外,这些按钮激活时的效果也很棒。当用户移过这些按钮时,这些图标会由无色变成彩色的。这体现了相当好的可用性。

时间: 2024-08-31 12:52:55

网页设计中图标描述的最优方法的相关文章

网页设计中清除浮动的最优方法

Overflow也可以用来清除浮动方法真的很简单,只要为需要清浮动的标签加上overflow这个属性. CSS代码:ul{ list-style:none; height:auto; margin:0;p adding:0; background-color:#436973; } li{ float:left; width:80px; height:80px; background-color:#83B1DF; } .demo{ clear:both; border:1px solid #FF0

网页设计中图标与网页内容的组合设计

为什么要使用图标?设计是为了交流:如果你正在分享的信息不能留住访问者,尽管它是多么的重要或多么的令人激动,这一点都不重要.大多数用户最初浏览网站的时候,他们首页扫视页面上视觉上感兴趣的内容,只有在一些内容引起了他们的注意,他们才将开始阅读.图标是吸引用户浏览你网站内容的一个简单而且有效的方式. 图标和段落分隔有同样的心理作用:他们从视觉上分开内容.一个内容格式好的页面,图标可使文字形成段落和突出重点,这样即容易阅读同时有趣的视觉效果足以长时的吸引用户的注意. 在这个篇文章中,我们展示了在网页设计

4要素让网页设计中图标更有吸引力

  图标在网页设计中用途广泛,几乎每个网站中都存在着图标.通过这些小小的图标,可以方便的实现视觉引导和功能划分.如果选用恰当,图标能和页面中的图片有机融合,保持视觉上的一致性,同时也能够和整个网站的风格相契合.图标并不是华而不实的小玩意儿,小图标有大用处.在网页设计中,如果设计师并不擅长图标设计,那么就需要在图标选择上下功夫了. 一般来说,根据使用手法.使用场合的不同,一张图像可以有多种解读,图标亦如此.图标不但能够吸引用户的注意力,还能分割页面中的区域,最为重要的事,图标能够提供一种视觉隐喻,

网页设计中的图标的使用技巧与资源合集

  提到图标设计,似乎每个设计师都有话说,但是要做好图标设计真的那么容易么?今天这篇文章针对网页设计领域的图标设计进行了相对全面的梳理,从设计技巧到设计资源一应俱全,但愿能帮上你! 图标是每一个现代UI中不可或缺的组成部分,它们不仅能协助UI布局组织内容,而且轻量级的图标融入界面也不会喧宾夺主.不仅手机和平板的APP UI中会大量用到各种图标,而且iPod和智能手表的界面中也是如此,这正是因为图标具备快速直观传达信息的能力. 在网页设计刚刚兴起的时代,小图标就已经被早期的网页设计师和开发者投入使

网页设计中使用图标支持内容的最佳做法

在做视觉设计时,如何高效地使用图标是一门学问:该使用什么样的图标?图标该放在哪里?大小如何?图标的使用是否帮助用户更好更快的理解内容,亦或是增加了他们的理解负担甚至产生误导?今天恰好看到了一篇很好的文章,可以帮助我们了解该如何使用图标来支持内容,故翻译如下: 为什么使用图标?设计就是传达信息:如果你的网站不能吸引用户,这个问题不在于你分享的信息有多重要.有多刺激.在访问一个网站的最初,大多数用户首先扫描页面来寻找视觉上看着有趣的内容,只有某些事物引起了他们的注意力,他们才真正开始阅读.图标是一个

让网页设计中的图标更具吸引力的几大要素

图标在网页设计中的作用 图标在网页设计中用途广泛,几乎每个网站中都存在着图标.通过这些小小的图标,可以方便的实现视觉引导和功能划分.如果选用恰当,图标能和页面 中的 图片有机融合,保持视觉上的一致性,同时也能够和整个网站的风格相契合.图标并不是华而不实的小玩意儿,小图标有大用处.在网页设计中,如果设计师并不擅 长图标设计,那么就需要在图标选择上下功夫了. 一般来说,根据使用手法.使用场合的不同,一张图像可以有多种解读,图标亦如此.图标不但能够吸引用户的注意力,还能分割页面中的区域,最为重要的事,

网页设计技巧:网页设计中的F式布局

文章描述:今天我们来重点介绍网页设计中的F式布局.传统的布局方式,依赖布置视觉线索,"控制"用户的视觉路径,相较之下,F式布局更加自然,更加友好.本文将讲述一些F式布局的规则.原理以及设计方法. 网页设计中的F式布局 今天我们来重点介绍网页设计中的F式布局.传统的布局方式,依赖布置视觉线索,"控制"用户的视觉路径,相较之下,F式布局更加自然,更加友好.本文将讲述一些F式布局的规则.原理以及设计方法. F式布局简介 F式布局是一种很科学的布局方法,基本原理依据了大量的

网页设计中的极简主义

  由于其永恒的优雅和清晰的内容呈现方式,极简主义一直被视为是Web设计中最持久的视觉框架之一.虽然设计思潮来来去去,但极简主义设计却变得日益经典,它的视觉和设计理念被身处不同专业和行业的设计师共同接受. 作为一种艺术风格,极简主义并非是网页设计独有的,简约设计运动的根源可以追溯至20世纪初.自那时以来,极简主义设计理念一直长盛不衰,仿佛是一种可以经历时间考验的永恒模型. 每个时代的设计师都会发现自己与简约设计的原则多少有些关联,更不用说我们现在这个极简主义爆炸的时代.在这一篇文章中,我们将探讨

网页设计中手绘风格的运用 改善网站的用户体验

怎样在网页中应用手绘风格,改善网站的用户体验 本文中,我们将讨论怎样在网页中应用手绘风格,以改善网站的用户体验. 识别度与真实感 手绘风格非常有利于展示人性色彩,形成独特的识别度,为用户带来真实感.当你收到好友寄来的明信片时,你总是希望看到卡片是手写的,带着好友独特的笔迹,而不是用电脑打印出来的.一张手写的便笺也总是比电脑打出来的纸片更加随意和亲近. 在网页设计中,道理也是一样的:手绘和手写风格的应用可以让产品显得更加独特.更加真实.更加值得信赖.下面是手绘风格带来识别度和真实感的三个例证: 独