提高理解能力的5大网站设计原则

你是否正在着手创建你的小型商业网站,并希望了解一些吸引人们关注的设计原则?

将这5条设计原则融入到你的网站中,可以最大化你的网站的可读性和理解力, 让它看起来更专业,让你自豪地把你的网站地址给潜在的客户, colleagues, and friends!

Now, let’s get down to business! 

1. Organize your content with white space

留白是最未被充分利用和赞赏的设计工具之一. 术语空白只是指拷贝周围和拷贝之间的空白, imagery, and videos of your website.

通常情况下,非设计师的人会在给定的空间中塞入尽可能多的内容. Mistakenly, 他们认为他们有效地利用了空间,但实际上他们所做的是让网站访问者更努力地辨别和理解所提供的dafa888.casino网页版.

留白的数量会影响访问者对你的专业性的看法——留白越多, the more credible you appear. 根据Crazy Egg的说法,它还有助于整体的用户友好性, 文本和标题周围的空白增加了20%的用户理解! (blog.hubspot.com)

以谷歌和apple这两家公司为例,它们都使用了大量的留白. 谷歌的主页上有两个东西:logo和搜索栏. Why? 因为谷歌知道,其他任何事情都可能会让用户分心,让他们不去做他们想做的事情——搜索!

苹果产品沉迷于空白区域,因为他们想让你把所有的注意力集中在你正在苦苦追求的产品上.

White space helps:

  • highlight calls to action (buttons/links)

  • 让你的网站看起来干净、整洁、有吸引力

  • 你看起来很有条理,很专业,井井有条

  • 在dafa888.casino网页版/产品/部门之间创建分隔

那么,你怎么知道你是在最大限度地利用空白呢?

首先,确保你在页边空白处有足够的空白. 在标题、副标题、段落和视觉效果周围留出空间. 在你的主页上保持你的段落最多3-6句话.

This web page utilizes margins on the sides, 在内容块之间利用边栏来组织内容并创建空白. It also shows content in small chunks.

This web page utilizes margins on the sides, 在内容块之间利用边栏来组织内容并创建空白. It also shows content in small chunks.

如果你的网站信息密度很高, 为了便于视觉组织,您可能需要添加更多的空格,但可以从使用列开始.

网页设计师使用12栏的网格,但3栏是一个很好的开始. 如果切换列数量,请确保内容在网格布局中沿着列轴对齐. 如果内容与前面或后面的部分不对齐,Dafa888casino通常会在内容后面使用颜色块来统一内容.

2. Your type choice can increase readability

字体设计是传达你的品牌价值和个性最快捷的方式之一. 当人们看到某些字体时,会下意识地产生联想,而这些联想通常是基于字体的历史和使用情况.

But looks, personality and history aside, 在选择字体时,最重要的考虑因素是可读性,最易读的字体都是圆形的, open or ample x-height.

What the heck is that you ask? In typography, x高度是字体中小写字母的基线和平均线之间的距离. 通常它是字体中字母x的高度.

Type families to consider that are readable, friendly and approachable, use fonts such as Poppins, Montserrat, or Raleway.

Modern, clean, and professional? Pick Lato, Open Sans, or PT Sans.

Traditional, respectable, serious? Choose Caslon, Garamond, or Cambria.

您需要使用为屏幕优化并具有不同权重的字体. 你的内容、标题、副标题和正文必须在台式机、平板电脑和手机上清晰可见. 

最后,我建议在你的网站上使用不超过1-2种类型的家庭. 再多的话,你的网站可能看起来太复杂了.

There are lots of font pairing sites 指导你用什么字体来讲述你的商业故事, 这反映了你的个性,最重要的是, will appeal to your target market. 如果你想了解类型,看看这个 website.

Geomanist是Dafa888casino为Design Powers品牌使用的类型. Dafa888casino选择了Geomanist,因为它是现代的,有一个圆形的x高度. 它也有很多权重,这允许Dafa888casino只使用一种类型家族简化设计决策.

Geomanist Dafa888casino为Design Powers品牌使用的类型是什么. Dafa888casino选择了Geomanist,因为它是现代的,有一个圆形的x高度. 它也有很多权重,这允许Dafa888casino只使用一种类型家族简化设计决策.

3. The Power of Color

交通标志的设计是先读出颜色.

交通标志的设计是先读出颜色.

颜色给你的网站访问者第一印象,因为人类的大脑首先看到颜色, then shapes, then numbers and text.

颜色能唤起记忆和情感,所以选择正确的颜色对网站的可用性很重要, longevity, and conversion. 你知道60% -90%的购买决定都是基于颜色吗?

在你的网站上使用不超过四种颜色.

关于颜色,我的原则是在你的网站上不要使用超过四种颜色——特别是如果你不是一个设计师. 原因又回到了理解和专注. 你的访问者在视觉上处理得越少,他们能吸收的内容就越多. 除非你经常使用色彩,否则它也会让你不知所措.

Dafa888casino经常使用深色或更深的颜色来做标题, 动作调用(按钮/链接)的醒目明亮颜色. 还有一个免费的中间色调,可以用在很多方面.

Make your body copy 85-90% black. 它对眼睛的影响比在白光屏幕下100%黑的眼睛要温和一些,但密度足够大,在移动设备上很容易阅读. And it also looks more sophisticated. 您现在正在阅读90%的黑色文本(十六进制代码#414042).

绝对不要在50%或更少的屏幕上使用颜色. 在手机上阅读很困难,特别是对于50岁以上的人来说.

Your web sight-literally…

当看到暗色区域时,瞳孔会变大. 瞳孔变大=焦点变弱,字体边缘模糊. 当瞳孔最大限度地放大时,人眼的聚焦是最差的. That’s why it's harder to read in dim light.

当看到浅色的书页时,瞳孔会变窄. 窄瞳=更清晰的焦点(增加字型的边缘对比度).

这是很重要的,因为白色或颠倒的类型有 significant impact on reading comprehension. In one study在美国,在黑色背景下阅读白字长篇文章的理解率为零! Yes, you read that right. 人们在刚读完的时候并不理解他们刚刚读过的内容.

这是上面引用的研究结果.

这是上面引用的研究结果.

边栏:这也与你喜欢的软件界面相关. 当你选择一个较暗的界面(Night Shift)时,你的理解能力比选择较亮的界面要差. It may be time to lighten up!

Screen+Shot+2020-10-22+at+8.11.54+PM.png

你对字体的选择也起着一定的作用. 只有当它是标题或标注,而且文字不多的时候,才使用黑色背景的反式字体.

颜色对比差也被认为是不好的网页可访问性. 这意味着有视力障碍和色盲(全世界估计有3亿人患有色盲)的人不能区分互补色和相似值的颜色.

你可以测试你网站的颜色,以及它们在网页可访问性方面的得分 here. 还有一个chrome和firefox扩展.

如果你不确定什么颜色能很好地搭配在一起,你可以在你的网站上使用相同颜色的色调来创造和谐的平衡. 

在你的网站和市场营销中始终使用你的品牌颜色,使浏览愉快. There are color scheme generators to help you too.

这五组颜色是Dafa888casino最近在客户网站上使用的调色板. 要了解深入的颜色解释,请浏览Dafa888casino的案例研究. 大多数情况下,Dafa888casino采用不超过四种颜色的规则.

这五组颜色是Dafa888casino最近在客户网站上使用的调色板. 有关深入的颜色解释,请浏览Dafa888casino的 case studies. We apply the rule of no more than four colors most of the time.

4. Limit line length and chunk your content!

你是否曾经去一个网站(在桌面上),看到从左到右贯穿整个屏幕的句子,然后想“啊?.这是因为排长队很难阅读,而且也让人筋疲力尽.

line-length-characters.jpeg

一列中最长的一行应该大约是45-75个字符的长度,因为人眼开始疲劳.

当跳到下一行时,Dafa888casino的潜意识就会充满活力. 每一行新的内容都会吸引读者的注意力,但随着阅读的持续,注意力会逐渐减弱.

  • Use varied line lengths 在你的网站的副本中,你可以保持你的用户的注意力和对你的内容的兴趣. 

  • Get to the point: 人们喜欢快速轻松地找到他们想要的东西,但也不要排太短的队!

  • Separate your content: Make your paragraphs into digestible chunks. 它将帮助访问者浏览你的网站的不同部分.

一般的用户会浏览你的文章——在快速进入下一节之前寻找文章的大意. Don’t expect people to read content that isn’t easily scannable. 当你的网站上有大量的文字时,人们不会去阅读. 

把你网站上的文案分成几部分,用标题吸引读者. Place relevant, 在每个块旁边有相关的图形,让你的用户在理解你的内容的时候有东西可看. 

You have 6.8秒抓住一个网站访问者的兴趣,否则他们就会退出! 人的注意力持续时间比金鱼短2秒! I know, I know, the pressure!

You have 6.8秒抓住一个网站访问者的兴趣,否则他们就会退出! 人的注意力持续时间比金鱼短2秒! I know, I know, the pressure!

5. Be consistent

现在你知道了如何创建一个能让访问者专注的网站, there’s only one thing left to do—build your website and maintain it. 和生活中的大多数事情一样,要想成功, consistency is key

在你的网站上使用相同的字体和颜色, social media, and branding collateral. 这将有助于维护你的品牌,让你更容易被人认出和记住. 

I hope you found the 提高理解能力的5大网站设计原则 helpful. 如果你觉得你的品牌或网站没有发挥其最大的潜力,你需要一些专家的帮助, check out our Power Plan,旨在帮助像你这样的小企业主发现如何提升你的在线形象.

 

GET BLOG POSTS IN YOUR INBOX

SUBSCRIBE TO POWER PLAY


Previous
Previous

Dafa888casino赢得了2020年最佳居家企业奖

Next
Next

7 Tips On Typography in Web Design