找回密码
 加入怎通
查看: 993|回复: 8

[其他] 有用的排版技巧提升你网站的可读性

[复制链接]
商摆小路 发表于 2012-08-02 15:28:52 | 显示全部楼层 |阅读模式
  排版在网页设计中经常被忽略。其实这是很傻逼的,因为注重网页排版确实可以提高你的网页设计水平和可读性。下面,我列出了10个非常有用的排版技巧让你的网站看起来更好。
9 M  t6 E' n) S
# U1 `) p4 }$ X$ r& S* a6 }  1、创建样式库8 x+ u' l6 c2 K7 a: @
% X5 ^( i& _. E# q# ^1 E$ A( I3 J
  让你的网站产生视觉震撼的一个简单高效的方法是给特殊的页面创建特殊的样式。例如,创建一个.warning的CSS类来向 你的用户显示“警告”。
, C/ W6 j5 G- c# W/ }8 V* n  v9 {4 M! _, i
  2、正确使用标点符号
, s& H6 Y& u& J1 J; O! k8 u7 C; w/ k. `; x! f" B, ?
  如果你想提升你的排版水平不容忽视的一点是正确使用标点符号。例如,引号经常用双撇符号代替(译者注:我想作者要表达的意思应该是全角符号和半角符号的区别,就像中文的引号和英文的引号不同一样)。
6 T) a; Y  d4 \. S) @0 A! u$ d7 i  t
; f; D+ b! M$ J1 i& A  3、关注对比
# z) G" Y, B$ D
4 A& @/ g3 \' E+ s9 ^$ ]" o  即使你的网站有很好的排版了,另一个需要注意的是对比。如果你的页面背景是中灰色,那么不要使用深灰色的文本,否则你的内容很难看清,尤其是对一些年纪比较大的或视力差的人。
8 R1 [0 d: G( w  g. G7 r
! f+ f0 p( v/ k# K( I! u0 w  总之,除非你的网站是关于黑客、黑帽seo或哥特摇滚的,不然你应该使用浅色背景和深色字体来保证清晰的对比度增加你网站的可读性。: @# ^: t6 ~% U! @, z
& K$ f. m* q! T" j/ p
  4、代码部分使用等宽字体
& C7 g: ^( y  p" s$ ^
; M' h) Z( h5 f  如果你是一位开发者(就像大部分读这篇博客的人)你可能想贴一些代码在你的博客里。如果是这样,请使用等宽字体。 那么,什么是等宽字体?它就是字母和字符占相同水平宽度的字体。
8 T" i6 n1 f  g5 d1 Q; s& y8 U: g+ b  k# E  u8 T1 E
  5、按级别来排列标题和文本: H& |  c" G4 Z" F

7 q3 X$ H6 m7 P1 x7 _  为了增加可读性,给标题、介绍段落和常规文本创建标签层级是很重要的,这样你的用户可以看清你的文章结构并能很 快的找到他们感兴趣的部分。
9 i" F  Y7 K- b: a: e; M0 ^" Q! V
/ Q1 w/ `+ V# t$ ]; v  6、不要使用过多的字体
) {9 T; r* \, x" Y
, r3 \- C: q( ~& c: w8 `+ z  为了确保可读性和专业性,你的网页上不应该使用超过3种字体。使用过多的字体会干扰你的用户而且让你的网站看起 来很乱。相反,较少的字体让你的网站显得干净易读。你可以标题使用一种字体,正文使用一种字体,最后 logo或副标题使用另外的字体。( P- q3 P' \& E
* D) T0 }% U  t1 B9 k+ l
  7、只给链接的文本加下划线
+ m0 [" v4 B' c/ R& M) v8 r
; L3 }" R/ l2 U9 Z% c: C  在我上网的12年中,浏览器用在链接的默认样式一直是蓝色文本加下划线。虽然这个蓝色经常被改成另外的颜色,但下划线一直被当做是链接的常规样式。这就是为什么除了链接你不要给其他的东西加上下划线的原因。否则,这可能对你的用户造成很大的困惑。

暂时无法加载帖子列表

回复

使用道具 举报

一天上百度前三 发表于 2012-08-02 16:30:05 | 显示全部楼层
这些排版方法很好 很有用
回复

使用道具 举报

amy328 发表于 2025-11-08 12:49:45 | 显示全部楼层
分析得很透彻,很多细节都说到点子上了~
回复

使用道具 举报

不在那岸边 发表于 2025-11-10 19:15:29 | 显示全部楼层
楼主太厉害了,整理得这么详细,必须支持
回复

使用道具 举报

a8585737 发表于 2026-02-09 22:13:34 | 显示全部楼层
这个分享太实用了,刚好能用到,感谢楼主!
回复

使用道具 举报

劲风 发表于 2026-04-10 01:30:15 | 显示全部楼层
蹲了这么久,终于看到有价值的讨论,支持一下!
回复

使用道具 举报

神马也疯狂 发表于 2026-07-14 19:23:54 | 显示全部楼层
完全赞同,我也是这么认为的,英雄所见略同~
回复

使用道具 举报

tuoyi123 发表于 2026-09-10 09:52:12 | 显示全部楼层
楼主辛苦了,整理这么多内容,必须点赞收藏
回复

使用道具 举报

凯迪拉克 发表于 2026-09-11 09:46:36 | 显示全部楼层
这个思路很新颖,打开了新世界的大门,谢谢分享
回复

使用道具 举报

    您需要登录后才可以回帖 登录 | 加入怎通

    本版积分规则

    QQ|手机版|小黑屋|网站地图|真牛社区 ( 苏ICP备2023040716号-2 )

    GMT+8, 2026-10-26 20:32 , Processed in 0.057768 second(s), 25 queries , Gzip On.

    免责声明:本站信息来自互联网,本站不对其内容真实性负责,如有侵权等情况请联系420897364#qq.com(把#换成@)删除。

    Powered by Discuz! X3.5

    快速回复 返回顶部 返回列表