设计是关于交流的。作为一名设计师,如果你的访问者轻松地在你的网站上找到他想要的东西,你就已经实现了你设定的目标。在我之前的几篇博客文章中,我已经介绍了如何在你的网站设计中使用行动号召,但图标呢?图标也可以是行动的召唤,但也可以是文本的有效视觉替代品。
图标通常一眼就能辨认出来,而且已经有了强大的、明确的概念,尽管它们可能只是你网站的一小部分,但如果没有抓住它,你的设计就会看起来俗气和廉价。
图标与其他图像的不同之处在于,图标是普遍可识别的,并且可以在不用语言的情况下传达动作。用下面的这些来测试我的图标,然后大声说出它们代表了什么。让我们来看看你是否能在5秒内完成:
如果你说洗手间,答案是对的!下一个..。
我是不是听到你说‘危险’了?太棒了!
“不能左转”?没问题。
你是说‘下载’吗?
‘禁止摄影’是正确的!
为什么辨认它们如此简单?这是因为这些图标已经变得反复和普遍地与行动或意义联系在一起。
设计自己的图标的指导原则
我喜欢Joel Diaz用钢笔设计图标的过程,列出了设计更好图标的5条指导方针。他谈到了5件需要牢记的重要事情:
了解问题所在
采取全面的方法
明白简单就是更好
考虑上下文?
理解符号学
1)理解问题:他谈到他的客户的请求是如何为文档加载错误创建一个图标,如下所示:
乔尔建议把它剥离出来。要做到这一点:
这个图标没有给出任何参考,所以不容易理解。
2)采取全面的方法:在玩弄图标后,出现了这个问题。
然而,正如他们意识到的那样,这也被用作临床标志。重复使用已经被用来表示某些东西的图标的危险是您要避免的。了解一组图标是很重要的。
我建议通过阅读材料和做你自己的研究来做到这一点。让你的图标设计经过一群人,看看他们是否明白。
3)认识到简单就是更好:乔尔的客户随后推荐了这一条:
这太复杂了,比喻也令人困惑。
4)考虑背景:然后他们考虑以下内容:
这张图片用鲜艳的颜色和醒目的图标传达了“危险”的意思。浅颜色,如灰色和粉色,意味着问题不是很大,事情会好起来的。一个红色的、大的、闪烁的图标会让你陷入恐慌模式,就好像问题已经比实际情况更严重了。
5)理解符号学:乔尔指出,次交流是一种符号语言,在排版中也很重要。你可以有女性化的字体、精致的字体等等(我们的博客‘What the Font’会告诉你所有这些)。
问问你自己,你的偶像要传达什么信息。
乔尔指出,互联网停机的标志如下:
这些图标的完美之处在于尺寸很小,传达了一些错误的微妙信息,但浅色的图标颜色表明事情并不严重。
Joel和他的客户最终选择了这个(相当合适的)设计来解决文档加载错误:
更多需要牢记的最佳实践:
让它保持优雅和简单
避免在您的设计中使用过多图标
坚持整体网站设计主题,即使是图标
图标的优势
图标是一种很好的方式来:
1)让列表看起来很有趣
2)增加可读性,打破文本单调
3)加入一些个性和乐趣
4)用图标制作页眉
--
《图像库》
我们知道,伟大的图标是互联网送给网页设计师的礼物,或者只是Webydo送给设计师的礼物。这个网站为你提供了一堆免费的图标,这些图标对每种类型的设计都很好。以下是几个例子:
多用途图标集
万维网图标集
MiniCool图标集
你可以在这里探索所有的布景。
如果您正在寻找更好的东西,请尝试Iconspel,这是世界上最大的优质图标收藏,可以完美地适应您的项目。Iconspel为数百万设计师和开发人员提供超过100万个当前图标以及每月添加的超过50,000个新图标。我们对这个出色的设计资源提供50%的特别优惠。如果您感兴趣,请转至该页面。
继续,通过精心设计、精心挑选的图标让您的设计脱颖而出。