文章排版要怎么配色才好看?

    俗话说得好:有趣的内容千篇一律,好看的排版万里挑一,最近不少人在跟小三儿咨询配色的问题,所以今天,针对文章配色给大家一些建议

    俗话说得好

    有趣的内容千篇一律,好看的文章排版万里挑一

    最近不少人在跟小三儿咨询配色的问题

    所以今天,针对文章配色给大家一些建议0cec012738fa65d7c93b255b2b28b0e3.jpg

    俗话说爱美之心人皆有之

    一篇好的排版往往能够影响文章的传播度

    所以,怎样利用色彩点缀文章

    同时能让读者更愿意传播文章

    我劝你最好收藏本文



    1
    配色作用


    有个大V说得好:有哪些东西是你一旦知道,生活就从此回不去了的?审美

    人其实是视觉动物,审美的理解大都是从颜色开始,一篇微信推文中的颜色往往决定整篇文章的基调、逼格。

    颜色又可以从标题、正文、引用、标注、配图这几方面区分,一篇文章的配色是为整篇文章做辅助的,所以,排版得当的文章可以达到以下效果:

    减轻读者的阅读压力。因为一直读黑纸白字,人的视觉会疲劳,眼睛会有压力,颜色点缀能够缓解视觉疲劳。

    增加读者对文章的理解。适当的颜色醒目以及标注,能够引起读者的注意,因此全文颜色的出现位置方便读者判断进度,把握全局。

    提升小编&读者的审美水平。小编与读者往往是相爱相杀,就像谈恋爱一样,往往习惯了之后就分不开,因此好的小编无形中在培养优秀的读者,优秀的读者又反过来倒逼小编不断提升。


    2
    配色须知


    按设计学角度来说,文章中除了图片之外的颜色,全文颜色应该≤三种颜色,颜色太多显得肤浅。另外,不要选择饱和度太高的颜色,也就是日常所说鲜艳的颜色,比如大红大紫,这些颜色看起来比较low,也会对我们的情绪造成一定影响。

    一篇文章的配色需要一个相对合理舒适的框架或者说公式来支撑:主题色+正文色+标注色+图片色

    ▇ 主题色

    主题色,即全文最主要的颜色,可以用在标题、重点内容、二维码、头像、顶部和底部的引导等。

    ▇ 正文色

    正文色,即标题、引用之外的文字颜色,不建议用纯黑色(#000000),一般用适度灰色的配色:

    grey.gif
    grey.gif

    #7F7F7F

    #595959

    #3F3F3F

    #262626

    #0C0C0C

    grey.gif


    ▇ 标注色

    标注色,即用作文章引用内容、注释、声明等特殊位置的颜色。常用的颜色有:#888888#a5a5a5

    ▇ 配图色

    配图色,即文章配图的颜色,一般遵从全文主色调的颜色,不宜与全文主题色有强烈冲突,比如全文灰色系,你突然来个鲜艳的大红色配图,明显辣眼睛。


    3
    配色流程



    ▇ 第一步:整体定调

    给整篇图文确定一个大概的色彩基调,如冷色系、暖色系,做这一步可以有效防止在接下来的配色步骤中出现色彩混乱的情况。

    ▇ 第二步:确定主色

    主色决定着整体色彩趋向,是一个整体的色彩基调。在所有色彩中的出镜率不低于75%。

    ▇ 第三步:确定辅助色

    辅助色主要起到辅助主色的作用。辅助色可以使色彩更加丰富完美。辅助色的占比往往在20%左右。

    ▇ 第四步:确定点缀色

    点缀色,有时候也称作点睛色,取画龙点睛之意。往往具有引导阅读,装饰画面,营造具有特色的画面风格的作用,整体占比一般5%左右。

    以上配色理论比较抽象,如果你不明白也没关系,讲到底图文阅读还是白纸黑字为主打,关键要学会用颜色做点缀,这个点缀的比率是5%左右,用得好这5%,全文锦上添花自不必说,往往还能让人感觉很有逼格。好了,下面欣赏一些常见的配色方案,大家看看他们是怎么玩转文章配色的。


    4
    配色推荐




    01

    grey.gif
    grey.gif

    电商系配色方案

    主题色:#F9B1CF

    标注色:#F9B1CF

    正文色:#595959

    辅助色:#F7BC0A

    grey.gif


    grey.gif




    02

    grey.gif
    grey.gif

    课程系配色方案

    主题色:#F4E539

    正文色:#3F3E3F

    辅助色:#000000

    grey.gif


    grey.gif




    03

    grey.gif
    grey.gif

    小清新系配色方案

    主题色:#76DFE3

    正文色:#333333

    辅助色:#EDFFFC

    grey.gif


    grey.gif




    04

    grey.gif
    grey.gif

    素色系配色方案

    主题色:#444444

    辅助色:#3F3F3F

    grey.gif


    grey.gif




    05

    grey.gif
    grey.gif

    新闻系配色方案

    主题色:#C30707

    正文色:#0C0C0C

    辅助色:#FFFFFF

    grey.gif


    grey.gif




    grey.gif

    最后配色还可以服务于品牌,比如小黄车36氪摩拜单车丁香医生微信派,最最最后如果你不擅长排版,可以用我们的在线排版工具,若想更好的提升排版技术,那你不妨看看下面的课程推荐。



    grey.gif