首先要明确,排版是为了内容服务。好的排版,一定都是顺应人性的排版。
排版的作用有三点:
正文排版,包括三部分:
1.文字:字号、颜色、标点符号、排版规范2.留白:字间距、行间距、段间距、页边距3.配图:封面图、配图、GIF
这些颜色看起来比较廉价,因为会对我们的情绪造成影响。
▍主题色
一种颜色作为主题色,可以用在标题、重点内容、二维码、头像、顶部和底部的引导等。
▍正文颜色
一种作为正文颜色,不建议用纯黑(#000000),手机端会比较刺眼,灰色会温和一点。常用的有:#595959、#3f3f3f
▍标注色
对齐方式主要有两种:左对齐、居中。
▍左对齐
左对齐型排版,首行不需要缩进。在中文书籍中,因为段落间没有间隙,所以需要用两个字符的缩进加以辨识。但在网页端和手机端,书本式的排版会让读者感到压力,大家改用空行作了段落区分。
▍两端对齐
针对这种情况,可以在编辑器中,使用两端对齐功能,将右侧也对齐,显得更加精致。
▍居中 居中型排版 一句话一行 视觉在中央 所以呢 每行不要多 否则就像这句话突然让眼球扫一整行好费劲
另外,不同的对齐方式不要混淆在一起。否则就打破了整体上的视觉统一,不够舒适。
标点的乱用,也会导致排版会乱。一些文字编辑对标点乱用是非常反感的。
中文标点符号应全部使用全角符号,下面举出几个常用的标点符号。
▍引号
引号推荐使用直角引号「」,这个符号是「我的最爱」。引号中再用引号使用双直角引号『』。表示讽刺、反讽暗示、强调语气、人物对话时,使用弯引号“ ”。
直角引号可以在中文输入法中「特殊符号 — 标点符号」中找到,或者是用直接日文输入法输入,键盘上的括号键即是。
直角引号源自日文,弯引号源自英文。
相比弯引号,直角引号在汉字排版中更为优雅和美观,也避免了全角半角不分的同学乱用弯引号导致的格式错乱。
▍省略号
千万不要用六个句号「。。。。。。」作省略号,也不要用三个点「...」,三个点是英文中的省略号。中文省略号「……」在中文输入法下,用 shift + 6 打出来。
▍破折号
破折号占两个汉字空间,不能用连字符代替,即「--」,除了书本里,我现在很少看到有人打出标准的破折号了。
在中文输入法下,用 shift + - (键盘 0 右侧的键)打出来,即「——」。
▍项目符号
有序列表:
1. 数字序列是最常见的有序列表。2. 数字之外还有英文、罗马文序列等。3. 数字后面加的是圆点而不是顿号。
无序列表:
● 小黑点是最常用的。 ■ 小方块跟中文搭配也很优美。 ○ 小圆圈多用于注释内容。
▍三角符
微信文章中经常可以看到各类三角符号,有各式各样的用处:▲正三角经常居中放在照片下方,注释内容前面,起指示作用。▼倒三角经常单独居中成行,用于分隔两部分内容,引出下文。
▍分隔符
除倒三角外,还有很多符号,都可以用作分隔符。
分割线也是最常用的一种,各种编辑器中都有不同样式的分割线,是排版中很重要的元素。除了用在文中,也可以用在文末。
▍进度符
下面我用一个小符号来示范下:
第一部分❖ ❖ ❖ 第二部分❖ ❖ ❖ 第三部分❖ ❖ ❖
PS:改不了颜色,我就先用斜体代替了。
▍强调
强调方式很多,但是千万不能乱用,更不能同时用在一个段落里,否则效果会让人很尴尬。下面进行一一说明。
▍下划线
下划线是打字机时代的产物,如今已经过时。如果用下划线进行强调,反而会喧宾夺主,对文字的阅读形成干扰。除超链接外,其他句子尽量不要使用下划线。
▍斜体英文从文艺复兴时期,就已经有了用斜体进行强调的排版规则。但中文不同,中文没有斜体,只有计算机程序变形的斜体效果。中文斜体后失去了中文字形原来的结构和美感,所以不要在中文中使用斜体。
▍加粗加粗是最理想的强调方式,也是最通用的做法。强调的时候除了加粗外,还可以改变字号或改变颜色。
▍引用开头的摘要、别人的资料、人物对话、重点语句,都可以使用引用功能。
▲引用功能
引用的内容要独立成段,如果来自别处,请记得加上引用说明。用了引动功能的句子,就是多了这句话前面那道竖杠。
引用格式中的句子,推荐使用标注色,即 #a5a5a5 或者#888888
▍中西文混排
中英文之间加空格:
中文与数字之间加空格:
中文夹杂英文单词使用全角标点:
对于完整的英语句子,则使用半角标点:
以上几点是通行的做法,不是标准规范。我查了很多资料,中西文混排目前还没有一套标准的官方规则,其中最主要的争论之一是关于空格的用法。
所以字母之间的距离应该合适,使得在很紧凑的句子和印刷很差的情况下,不会和其他的字母混淆在一起而影响阅读性。
上面说的文字和符号,就是排版设计中「黑」的部分,而设计「白」的部分,也是非常重要的。
字间距、行间距、段间距、页边距等,这些是「白」的部分。就像阴阳一样,黑白得当,才有了和谐的美感,给阅读留下了呼吸的空间。
针对一般的文本设计来说,字号越小,字母之间的间距就要越大,以使文字易于辨认。相反,如果将字号调大的话,紧致一些的间距以至于字符之间不会那么松垮,而更易阅读。
可以在编辑器中对字间距进行调节,0.5 —1.5 都很常见。
文字太过密集,容易让读者失去阅读兴趣,很多好内容因此被埋没。而相反过于稀疏,视觉效果也并不理想。
根据行业经验,行间距一般为字号的 1.5 倍左右。14px — 16px的字号,推荐 1.5 或者 1.75 的行间距。
段间距也有不同层次的划分,可以参考一下知乎用户 @Hindy 的习惯:
手动设置的话,标题和小节之间的行间距也有所差别。最好的方法,还是去参考喜欢的大号,模仿他们的习惯,然后在试图创新。
正文段落的长度,是影响留白很大的元素。
段落长,留白少。段落短,留白多。
如果都是长段落,黑压压的大段文字会让人觉得呼吸不过来;如果是一连串的短段落,大片的留白会打断排版的连续性。
而如果都是中等长度的段落,则就像唱片机卡碟一样,絮絮叨叨,缺乏丰富的节奏。
控制段落长度的节奏,是非常重要的排版技巧,这点很多人都不知道。长、中、短段落结合,能让读者在大段文字中迅速找到落脚点。
如此,排版真正成为文字情绪的一部分。
最后,段落最长也千万不要超过一屏。下图这种神人行为,我们一般人千万不要尝试,简直喘不过气。
图片是为内容服务,我把图片分为两种类型:有意义的、无意义的。
2.娱乐
一些表情包、GIF 等都是此类,跟读者进行情感上的娱乐互动。
3.销售
4.解决问题
有些信息只靠文字很难直观表达,或者过于复杂,需要图片来进行解释说明,辅助理解,如一些数据图片、趋势图等等。
▍无意义的图片无意义的图片有 3 种作用:美化排版、阅读奖励、凸显调性
1.美化排版
2.阅读奖励
尤其是一些有趣好笑的或者是性感美女图片,都是阅读奖励。
3.凸显调性
简单来讲,图片有两大选择标准:清晰、统一。
▍清晰图片高清不模糊,是排版的基本要求。除了原始图片是否高清以外,不同的格式也会影响最终效果,图片的格式部分下文会讲。
另外要注意图片上不要有水印,除非是经过特殊设计的水印,否则真的很土。
▍统一统一包括主题、风格、尺寸上的统一。图片要与文章主题统一,不同图片之间的风格要统一,不要上面都是漫画表情,下面一下子都变成了人物风景。另外不同类型的图片,最好将尺寸统一。
上图是@王如飞 研究的封面图裁剪情况这张图太复杂,不用记住。只要记住封面图的尺寸是 900 X 500,次条封面图的尺寸是 200 X 200 就好。按照这个尺寸来配图,效果是最佳的。
另外要把重要内容放在中间 400 X 400 的正方形内,这部分的内容一定不会被裁掉。
▍独家风格
可以用美图秀秀或者 PS 等一些制图软件,加上一些文字、图形、logo 等固定元素,形成自己独特的风格。当然更厉害的就是请专业的插画师定制插画。
▍尺寸
修改尺寸,可以用美图秀秀进行修改,或者直接用 PPT 也行。把图片放入 PPT 中,选中图片之后「点击格式 — 裁剪 — 纵横比 — 16:9」。
▍在线生成
▍获取封面图
关于如何获取别人的封面图,IT云课堂 提供了一个很实用的技巧:
▍导航
相信大家的文件夹里都收藏了一大堆图片网站,其实只要用好设计师导航网站就好了。绝大多数常用的图库,在这些导航中都有收录,并且已经按照免费 / 付费分好类,也有相应的介绍说明。
导航网站中除了图片以外,还包含各种素材和神器,可以去探索一下。
▍常用图片网站
下面这些是大家常用的图库网站,在上面三个导航中都有收录。
▍特殊网站介绍工欲善其事,必先利其器。下面再介绍几个比较特殊的。
文字云
这个网站可以在线生成文字云效果的图片。网站是英文的,可以借助谷歌浏览器自带的翻译功能。具体步骤是「上传字体 — 添加文字 — 上传图片」。
表情
Mockup
Mockup是指图片展示素材模型,什么意思呢,就像这张图。
你可以找一张手机截图,替换图中的手机图片,手机截图就可以瞬间变得高大上了。就像这样:
第一个网站只有台式机、笔记本、平板、手机、手表五种模板,但是好处是只要选好模板,可以上传图片进行自动替换。其他两个网站有各式各样的其他素材,不过需要下载 PSD 图层进行手动替换。
▍关键词用关键词有两个搜索方向:纵向、横向。
1.纵向
纵向就是缩小或者扩大关键词的范围。
同样也可以反过来扩大范围,比如需要一个小蛋糕的图片,可以试试搜索「下午茶」。
2.横向
横向就是搜索相近的词汇,很多时候找的图片是可以用其他图片代替的。
▍以图识图
有时候看到一些喜欢的图片,但是尺寸太小、不够高清,或者是有水印,这个时候可以用百度和 Google 的「以图识图」功能,让搜索引擎帮忙找这张图片的其他尺寸、格式。
在百度图片中选择好一张图片后,点击「按图片搜索」:
点击右下角那个放大镜,或者是在百度页面点击那个照相机,上传图片:
搜索引擎会自动帮你找到不同尺寸的相似图片。
另外也可以直接在谷歌浏览器的程序商店里下载安装 Tineye 插件。看到一张图后右键选择「Search Image on TinEye」,大多数图片都可以找到相似图片。
▍下载
有的时候好不容易找到了一张图片,但是下载起来可能又很麻烦。有很多插件都支持一键下载功能,可以在任何网站一键下载图片。
安装插件以后,在图片上直接 alt + 鼠标左键即可一键下载。除了插件,360浏览器、UC浏览器也有一键下载图片的功能。
▍水印
非原创图片不要打水印。对于原创图片,除非水印经过特殊设计,否则都不会好看,另外加了水印也不方便读者保存。
有时候网上找来的一些图片需要去水印,这个时候可以用美图秀秀或者是 PS:
另外还有一款常用的去水印工具:Inpaint,可以傻瓜式一键去水印。
▍截图美化
这个时候可以借助 PPT 图片样式中的「居中矩形阴影」,为截图加上阴影。
确定图源的,可以在图片下方,小字标明来自某部电影、某位摄影师、还是某个商业图库。
最大的 Gif 搜索引擎,找 Gif 用好 Giphy 基本就够了。
国内的动图网站,专门给公众号提供素材的。除此以外,还集合了GIF压缩、剪裁、制作的功能。
也是斗图常用的国内网站,每天都会更新专辑,内容全面且动图质量比堆糖、花瓣上的普遍要高。此外也自带 Gif 制作和压缩功能。
5.9gag
暴走漫画最初就是模仿9gag,这个网站的 GIF 质量非常高,注册后右键另存为可以下载。但是需要视频格式将转换 GIF 格式。
6.小猪动图
国内很专业的动图网站,素材更新快,并且把GIF动图划分了上百个子类。同时在网站上还可以对 GIF 压缩、制作、加水印、裁剪,以及将视频转换成 GIF 格式。
7.搜索引擎也可以在百度、必应、Google 等搜索引擎上直接搜索 GIF 图片,关键词 + gif,比如「小猫 gif」。
8.其他
▍压缩
▍录制
有时候需要自己录制一些 GIF,例如一些软件的教程。这里推荐几款口碑比较好、易上手的 GIF 录制软件。
▍转换
有时候需要把一些视频转化为 GIF,上面提到小猪动图的网站就具备这个功能。另外可以用迅雷播放器直接从视频中截取 GIF 图。用迅雷播放器打开视频,点击右键「GIF 图截取」即可。
良好的设计会增加内容的可信任感,而那些烂大街的模板,不仅难看没有效果,反而会降低读者对公众号的评价。
顶部通常放置的元素有:
顶部内容大概有三个方面的用途:
底部的元素有:
底部与顶部不同,读者已经看完了正文,整个人的状态比较放松,所以底部内容多一些也没有关系。这个时候应该尽量对上面缺失的要素进行补充,顶部没有放的信息,可以放在这里,一些重要信息可以选择重复。
一个经过用心设计的二维码,能够提高不少转化率。在各大编辑器中,都有各种二维码的样式,可以挑选合适的。
有时候需要自己生成一些二维码,这个时候要借助两个工具:短网址、二维码生成器。
这时候需要借助短网址工具,将长网址进行缩短,用缩短后的网址去生成二维码。
二维码生成器基本上都带有美化功能,生成后可以进行美化。这里推荐两个二维码生成器:
同时,我最希望你记住「黑与白」的排版理念,这是排版的道。如果你忘记了,可以翻看留白那小节。
---------------------------------下面推荐20个排版好看的公众号--------------------------------
| 未读
推荐之处:未读是做荐书的,经常做合集清单的同学推荐学习一下。
| 拾遗
推荐之处:我非常喜欢拾遗的配图,很有感觉。另外一节文字+一张图的排版样式也很值得学习。
| 物道
推荐之处:箱子有开箱体验,物道的落地头图也有一种开屏体验,很爽快。另外小标题会随着物品变动而改变,很有趣。
| 誰最中國
| 顾爷
| 好色派沙拉
推荐之处:好色派沙拉的配图都来自设计师之手,非常的有感觉。另外最后的图片链接做成推送的样子也很有意思。
| voicer
| 丹尼尔先生
推荐之处:这个号只有每周六是原创,作者很有品位。把(244,244,244)的底纹用到了极致。
| JZsolve
推荐之处:黑底白字很惊艳,而这只是 JZ 风格的一种,这个号除了干货什么都没有,连排版也是干货。
| 可能吧
推荐之处:可能吧的排版一直被人津津乐道,它并不花哨,但足够优雅和有呼吸感,对文字节奏的控制值得每个人学习。
| 正好有空
| 行动派
推荐之处:行动派的排版也经常被大家推崇,头图和尾图很好看,正文基本没有图片,但用小符号控制的很好。
| 24hours
推荐之处:24hours 的头图也很好看,值得学习,多图之间的节奏控制也很好。
| AppSo
推荐之处:AppSo 的排版比较适合那些“正经”一些的公众号学习参考。
| 姜胡说
推荐之处:这是我一个学员的公众号,在排版上也有很多值得借鉴和学习的地方。
| 那一座城
推荐之处:大家不要笑,那一座城的排版牛逼之处在于跟阅读情绪配合的十分到位,点名学习。
| 企鹅吃喝指南
推荐之处:很喜欢他们的动态头图,整体排版的感觉也很不错。
| 阿司匹林博物馆
推荐之处:封面图都是统一的插画,很有感觉,排版也很有呼吸感。
| 附中人Further
推荐之处:我不说你绝对猜不到这是一群高中生做的号,排版很赞,点名学习。
| 坤龙老师
---------------------------------------------我是分割线--------------------------------
我是坤龙,一家6个人的文化公司的创始人,90后新媒体老司机,在行超1000单行家。从业4年,前前后后参与了近50个公众号运营。
示例源码
专栏
9 人学习
在这个专栏中,您将找到一系列珍贵的示例源码,涵盖各种编程语言和技术领域。这些代码片段旨在帮助您快速掌握编程技巧,解决实际问题,以及提高您的开发效率。无论您是初学者还是经验丰富的开发者,这个专栏都将成为您的宝贵资源。让我们一起探索编程的奥秘吧!
公众号后台开发实战系列
专栏
31 人学习
用详细的代码实战带领初学者快速入门小程序和公众号开发
专栏
15 人学习
请填写红包祝福语或标题
红包个数最小为10个
红包金额最低5元
抵扣说明:
1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。 2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。