网站设计中排版的最佳方法
发布日期:2020-07-07 浏览次数:862 关键词:网站页设计
环顾互联网,注意排版如何在各个方面主导网页设计。 毕竟,有95%的网页设计布局是有原因的。 当您考虑它时,这是一个有意义的世界。 互联网是关于内容的,内容是指文字和文字。 这意味着排版。 精明的Web设计师知道这一点,并将投入大量的思考和思考,以便在他正在工作的任何网站上正确排版。 为了使该类型既实用又吸引读者,他在计划站点的信息体系结构时必须考虑许多不同的因素。 哪种字体最容易阅读? 哪些字体易于读者浏览? 清晰字体呢?
由于所有这些问题和考虑因素,第一次尝试在网站上钉上字体并不容易。 但是我们搜索了互联网,发现Smashing Magazine的这项开创性研究已成为当前最佳的排版实践,至少令人大开眼界。 我们对这些数据进行了深入研究。 在本期高端网站睿思设计公司中,我们为您介绍了网站设计中的排版最佳实践。
1.标题
可以说,网站副本中的标题非常重要,因为令人沮丧的研究表明,大多数人只在Internet上阅读该标题。 如果用户的行为使许多读者不喜欢该文本,则必须使标题的字体特别醒目,以吸引他们的注意力并说服他们进一步阅读。 根据前面提到的Smashing Magazine从2013年开始的研究,标题几乎是无衬线字体和衬线字体之间的链接,其中51%的标题使用无衬线字体,超过47%的标题使用衬线字体。 近年来,衬线字体变得越来越流行,主要是因为人们认为衬线字体在头条新闻中脱颖而出,并为站点访问者提供了一种易读的结构。 就受欢迎程度而言,标题的两种最受欢迎的衬线字体是Georgia和Chaparral Pro,而标题的两种最受欢迎的sans-serif字体是Arial和Freight Sans Pro。 尽管您当然可以在网站上使用自己的字体测试标题,但请注意,这些字体的受欢迎程度是由于读者的积极反馈。
2.内容
即使内容阅读的人数少于页面上实际标题和标题的人数,网站的主体也构成了内容的最重要部分。 与标题中Sans和Sans-Serif字体之间的紧密联系不同,衬线是文本复制中的明显赢家。 根据同一项研究,多达61.5%的网站在文本中使用衬线字体,但是只有36.5%的无关紧要的网站使用无衬线字体。 让我们看看它是如何进一步细分的。 用于正文的最常用衬线字体是Georgia和Chaparral Pro,它们几乎可以反映标题的比例。 在sans-serif的前端,用于文本复制的最常用的sans-serif字体是Arial和Helvetica。
3.有趣的笔记
值得注意的是,该研究还确定了当前的大多数网站都没有使用任何标准字体作为其主要字体。 在该研究中,大约有39%的文本和66%的网站未使用标准字体。 这一令人惊讶的发现的一种理论是,像Fontdeck和Typekit这样的服务以独特且前所未有的方式将品牌与竞争对手区分开来。 这是所有这些内容的要点,是的,您可以放心地使用它并选择一种“不具威胁性”的标准字体,但是许多网站都大胆反对这样做。 他们发现,只要他们的网站访问者和读者不会损害网站的用户体验,他们就会非常喜欢非常规字体。
4.背景资料
不用说,网页设计中流行的背景是可以与文本形成鲜明对比的任何颜色。 这自然使站点访问者更容易更有效地阅读副本,从而提高了可读性。 Smashing Magazine的研究发现,大多数网站都喜欢暗光布局。 这意味着浅色背景上的深色文字。 但是,当前要指出的打印状态真正重要的一点是,降低了暗光设置的粗糙度。 例如,某些网站正试图在深灰色米色背景上使用文本。 在这种方案中,对比度不是很明显,但是它仍然为阅读器提供了舒适的阅读体验,有助于轻松扫描每一行。 毫不奇怪,在复制文本时,在白色背景上使用黑色文本的最喜欢的方法仍然是黄金标准。 黑白效果除了因清晰的对比而易于阅读外,还可以追溯到报纸上的经典色彩格式,这也解释了其在互联网文本中的广泛流行。
5.标题的字体大小
至少就在线头条新闻而言,趋势越大越好。 当前标题的字体大小为38像素。 自Smashing Magazine于2009年进行最后一项研究以来,它实际上增加了10个像素! 显然,为了吸引主要阅读标题的用户,越来越多的网站不得不诉诸增加标题像素的大小。 如果您感到好奇,BootstrapBay的博客使用Roboto字体作为标题,标题为28像素,标题为24像素,文本为16像素。 但是,应该注意的是,标题中最常用的字体大小是20到32像素,这使BootstrapBay的博客命中率处于受欢迎状态的中间。
6.文字的字体大小
文本和标题是不同的野兽,因此文本的典型字体大小要小得多也就不足为奇了。 但是,即使对于主副本,也存在一个事实:字体大小的总体趋势正在变大。 在这项研究中,几乎相同数量的网站使用14和16像素进行文本复制。 与Smashing Magazine在2009年进行的网络发布研究相比,这明显增加了两个像素的大小,因为当时大多数网站仅使用12和14像素进行文本复制。 同样,BootstrapBay的博客是与时俱进的印刷最佳实践的完美示例:我们使用16像素作为博客文本的副本。 标题与正文字体大小的最常用比率(如果经常重复)为2.5。 基本上,您需要获取标题的像素大小,然后将其除以正文副本的像素大小即可获得所有重要比例。