文章排版怎么有美感 超实用图文排版方法 下载本文

内容发布更新时间 : 2024/6/1 8:00:44星期一 下面是文章的全部内容请认真阅读。

适用于网页上的文章阅读。由于显示器是横向的,我们更要注意划分阅读区域。

文本宽度控制在450-700px为宜,此范围内参照字号大小: ● 英文每行80-100个字母(空格算一个字母)为宜; ● 中文每行30-40个汉字为宜。

4

对比:提高视觉性

对比(contrast)是四项基本设计原理之一,在网页中对文字的排版也非常适用。可以将对比分为三类,主要是标题与正文的对比、文字颜色的对比,以及文字颜色与背景颜色的对比。

1、标题与正文对比

标题使用18号的微软雅黑,正文使用12号的宋体,两种字体字号的对比让文字内容富有层次,很容易吸引读者眼球。

2、强调文本对比

一部分文字采用了与主要文字不同的样式,增加视觉效果,突出展示了段落的重点。一般规则是,强调文本不要超过整个文本的10%,如果所有都被强调,那就不是强调了。当然,一次仅仅使用两种或是三种强调技巧。换句话说,不要同时使用,颜色,字体改变,大小,下划线,斜体,黑体。

3、文字颜色与背景颜色对比

正文文本与背景合适的对比可以提高文字的清晰度,产生强烈的视觉效果。将文字内容清晰衬托出来,既有丰满的层次感,同时有具有很强的视觉冲击力。在使用这一原则时需要注意,必须确保文字是容易看清的,如果文字过小或过于纤细、色彩对比度不够,会适得其反。如果对色彩的对比度还不够熟悉时,可以通过颜色对比检测工具(Check My Colours、Colour Contrast Check)检测色差和亮度差,确保网页设计的易读性。

图文排版的简单化

为了增加阅读体验,一种友好的图文排版必不可少。图文混排的样式有很多,我们大体可以分为具有设计样式的和简单混排的。富有设计感的图文排版较复杂,需要一定的设计功底才能做的好看。因此简单好看的图文排版越来越受欢迎,处理好图片和文字的关系就可以。

1

图文的组织关系

?

图片靠左对齐

正常情况下,用户的注意力从左向右(当然不否定特例的)。其优势是可以增加内容的识别度,图片可以先吸引读者对内容的注意力。

?

图片靠右对齐

如果内容比图片更重要或者内容很难用相应的图片进行表达,同时又想充实页面提高页面美观度的,可以考虑图片放在右侧。

?

图片放在上方

一般都是类似瀑布流列表的排版方式。此时图片的重要程度比放在左侧还要高的多,基本每条记录的主要信息都靠配图来呈现。

?

图片放在下方

主要的优势,可以把文字和图片的结合优势充分发挥出来,文字简要陈诉,图片带你身临其境,还原真实情况。

?

图片作为背景