网页设计排版技巧|提升易读性与美观度的实用方法
谈网页设计里的排版办法,教导你一些管用之法,能使你的排版显得美观 。
不妨这么讲,将排版视为UI设计里头最为困难的那一部分。于这篇文章之中,我会传授给你一些具备实用性的技巧,你能够在你的项目里加以运用。
一、考虑用户
我们应该记住,除了美学,我们还有用户。
所需要使用的字体得具备灵活性,其字体应当能够给出粗细各异的宽度,留意这些方面是相当重要的,好的排版对于读者而言是“透明”的,然而坏的排版却会致使读者从显示器上“尖叫”出来 。
要知晓哪种字体是可称作最容易被人阅读的,并且是从整体上看显得最为简洁大方的才行,如此才能够去选择那样子的字体来用于排版,。
二.易读性
在对特定字母进行区分时,易读性是用以考量此区分方式的标准,它针对特定字体,该字体为微型字体,着重于字体、字母以及细节方面,自然而然地,这属于极为重要的因素之一,并非所有字体皆是依据可辨认性这一主要设计功能来创建的,最为常见的问题便是未能区分大写字母L与小写字母l,你应当避开此类字体,鉴于人们在小显示器上阅读时会遭遇问题 。
1.高度
我们所读的百分之九十五的字母,皆是小写字母。大写字母与小写字母之间的字母比例越大,那字体就越易于辨认。
2.计数器
字母同样是要有空间的,举例来说,去看“O”,再看“U”,接着看“D”,而这些空间是被计数器以及排版专业人士认定的,在计数器里它能够助力我们更轻松地识别字母 。
3.宽度
较细的字体通常比较宽的字体更容易辨认。
4.宽比例
所称比例是,字母宽度和其自身高度两者之间的关系。 最佳笔划的宽度,大概是高度的18%,标点符号。
5.字母间距
不存在计算字母间距这般的最终途径,然而多数情形下,你所需的字母间距越大,文本尺寸就越大,字体看上去会过度开放,得手动去调整间距,针对UI设计而言,它通常适用于页眉部分,。
三.可读性
可读性是关乎整体阅读感受的,我们怎样轻松地去扫描文本布局,分辨标题、副标题、段落以及块,它的宏观排版,是要让文本更具视觉吸引力,从而使得阅读更令人振奋,这是一种涉及对比、色彩、大小、构图以及小细节的艺术,能给读者带来更佳阅读体验。有衬线字体与无衬线字体,历史表明衬线更易辨认,它们在印刷中被使用了很长时间,确实提升了大块文本的阅读体验,衬线能让眼睛在文本上更顺畅地流动。然而是有几个不存在衬线之处的设计具备可读性的,当下的视觉设计状况对于简单的字母表单更为青睐。于网络之上,尤其在手机方面,我们所见到的是更多不存在衬线的设计,此项设计能让人看上去更为简洁。
当然,这同样取决于你的项目以及用户,举例来说,在媒体方面,鉴于大部分时候你会去阅读冗长的文本,有衬线,这是一种相当不错的设计方式。
2.黄金比例高度
其可运用黄金比例的高度,将你的文字大小乘上1.618,如此便能收获完美的线条高度,小的计算,可用--JSBI.COM/TodiDu/1/* 倘若你颇具经验,那你能够手动调整这个结果,当然,此规则存在例外,若有必要,你总归能够打破它。
(左图为黄金比例的高度)
3.文本的间距
文本间距倘若太宽,咱们的眼睛会很难寻觅到下一行文本。要是间距太窄,眼睛就易于把这行错看成下行,常常破坏阅读的节奏。为激励读者,促使他们参与,你的文本行应当处于50到75个字符之间。
4.颜色
给大伙分享一个有关颜色的窍门,运用颜色之际尽量别用纯粹的灰色或者纯粹的黑色,当然了这也得看你项目的需求情况。并且也能够在这儿挑选你所喜爱的颜色,。
它会比运用平常的#CCC更具吸引力以及独特性,能让你的视觉效果更佳。
5.留白
这属于一个相当关键的关于事物的谈论主题,存在着数目众多的书籍以及种类多样的杂志,当涉及到进行排版操作的时候,均都需要将这一要点牢记在心里:留出空白区域的最根本的作用是去降低文本浏览者一次直视的具体数量。这样做会促使我们所设计的布局具备更强的能够被快速浏览的特性,从而不会致使我们所呈现的内容出现过量多余的状况。预留出空间能够引导我们的目光经由布局展开移动,进而营造出一种具备秩序且带有优雅之感的氛围。
6.层次分明
读者读取内容的方式由层次结构所定义,它告知我们怎样去区分标题,以及副标题,还有正文,我们能够借助运用不同的对比度,以及文本大小,再加上间距等来达成这一点,这是一项需要予以掌握的重要技巧,目的在于实现良好的可读性 。
结论
一个重要的历程是学习排版,技能并非源于阅读里的文章,而是源于学习以及实践,所以需要你多多地练习,去创造一些很棒的事物!
那艺术的伟大之处,并非在于去发现什么才属于共同的范畴,而是在于去发现什么才是独特的那种情况。这是艾萨克·巴什维斯·辛格(1904—1991)所表达的观点 。
如果你期望去学习更多有关网页前端设计的技巧,那么网页排版的知识是能够去学习一番的,要是你并没有ps基础,那可以去学习一下,如此你将会拥有更多的收获~倘若想要这些网页前端设计资料,能够在评论区留言扣 1,或者私信给我哦!
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】,社区存在部分内容,看起来疑似是借助AI辅助生成而来,在浏览这些内容的时候,请结合常识,并且还要参考多方信息,审慎地进行甄别。

请小编喝杯咖啡吧!