文字排版技巧:简约、时尚、抓眼球的网页


很多人网页设计者对于文字排版可谓煞费苦心,其实任何网站都应该有一个较为统一的UI形象,UI形象中的重要元素最好能在各网页中有所体现,但重要的文字内容需要做一些抓眼球的处理。本文将结合WordPress块设计,介绍文字排版中的一些小技巧。

WordPress.org社区官网的简约设计

WordPress作为全球市场份额最大的开源CMS系统,我们看看其官网博客首页及内容页的设计(2022年更新的设计)。

WordPress.org 文章页
WordPress.org 文章页

这种设计虽然很简洁,但整体的UI得到了很好的体现,且极大的突出了文章标题这个重要的文字内容。

不要满屏都是内容

国内很多网页设计者受十几年前的一些门户网站影响,喜欢在屏幕中堆满内容。但现在流行的网页设计中,这是大忌。

密密麻麻的文字与图片,会让浏览者无所适从,看不到重点内容,整体阅读体验较差。

新浪首页
新浪首页
sina文章内容详情页
sina文章内容详情页

与上面的WordPress页面相比,不论从阅读体验还是美观性而言,这种门户网站风格都不怎么好。但可惜的是国内很多网站都愿意跟风这种过时的网页设计。

提示:排版的时候记住,空间要有浪费,不要想着节约空间。

文字应该保持合理的大小与距离

现在的人们不论是用手机还是电脑设备的时间较长,没人愿意盯着屏幕看那种大段且密度很高的文字。

所以文字较多的内容应遵循以下原则:

1、尽量多分一些自然段,避免出现连续的大段文字。

2、文字应该保持一定的间距,可以在CSS中使用 letter-spacing 属性设置间距,然后在WordPress文本块编辑器中添加额外的CSS类以便应用设置好的letter-spacing 属性。

3、段落间距,一般网页我们都推荐150%起步,这样可以让人阅读起来觉得较为轻松。

4、字体不应设置太小,一般情况下正文需要在17px至19px之间。

简约时尚的颜色搭配

对于一些特别重要的内容,可以采用一些颜色来区分。但尽量不要整篇文字都上色,否则显得太花。

对于颜色搭配上,用稍深的背景色配上浅色文字,是一种很时尚的选择。

这是重点内容示例!

在WordPress块编辑器中,简单设置块的背景和文字颜色,就能搭配出很好的效果。

这是重点内容示例2!

这是重点内容示例2,简单设置块的背景和文字颜色,就能搭配出很好的效果。

这样的文字块虽然很简单,但很抓眼球,而且还很时尚。

大写与粗体不能大范围使用

大家都习惯将重要的文字内容用大写字母与粗体来表示,但我要建议大家的是:“永远不要全部使用大写字母或粗体,因为人们会认为你在对他们大喊大叫!”

除非注明,否则均为本站原创文章,禁止任何形式转载。

精品WordPress资源下载