中国策划师在线 » 〖网站运营策划〗 » 改善网站的可读性的30个方法

imcko 发表于 2008-4-6 18:29

改善网站的可读性的30个方法

什么是网站设计中最重要的一个环节?很多人会回答是网站的可读性，怎么样才能使你的内容更容易阅读。
_d3{t])X a^ D8x:hJoH
　　读者来到你的网站是在阅读他们关心的内容，如果文章的内容被设计所掩盖，导致读者难于阅读，这样只会使他们远离你的网站。
5?&p%J~0wO"IsX,omK 8R'C,BfNls[
　　那么我们可以做些什么来改善网站的可读性，使那些读者留下来继续阅读呢?Dl.d8X R&p~j

Z?qn#uF 　　你现在就可以做的 30 件事情：,sd.rN
z1u$Kz

2x5V6pN1F
NT 　　1、为你的链接添加下划线。读者期待看到带有下划线的链接，因此不要让他们失望。
X(H5N4OIX9v :c^ Y#S$U)^AX
　　2、为段落中的文字使用适当的行高。一种快速、简单的方法，用段落中字体的大小来测算行高。较为理想的情况是行高大约为字体大小的1.5倍。G/~N8r HfhOZ

0B.{7R7}&}9I-R 　　3、在设计中明确区分你发表的内容。你发表的内容从哪里开始，到哪里结束都应该是显而易见的，其它诸如侧边栏、文章评论、文章附加信息等模块应该在视觉上有别于实际内容。
_._!AlS z m[&_0A
　　4、如果你使用Pull-quotes，要保证这部分内容明显，并处于靠近文章顶部的地方。如果用户没有很快地识别它们，那它们就没有什么用处。
!}Z,U`g&Fl6Ila&C
5b;JiPZAx 　　5、保持简短。同样的意思，你用书面文字写出来需要50个字，但是用嘴说的话可能只需要30个字。E4V"w"sU#`0jP

.~BkPSx/~ht4_ 　　6、文字与背景的对比度。使用Snook’s 的Color Contrast Checker检测网页的文字与背景的颜色，确保那些有视觉障碍的用户也可以正常阅读你的内容。
i!yl&~&JS
(Let]U]$s 　　7、为你的文档使用结构层次。例如：文章标题——介绍——正文标题——内容——副标题——内容，这样会让你的网页更符合逻辑流程。r u+C3KX`2_1Ug

'H5gcEN
\ 　　8、避免在中间插入广告破坏文章的完整性，这样做会打断读者的思路。
"GcYCo&xk$` jd 4kF,^.gzD3`
　　9、为以斜体和粗体显示的文字应用样式时，不要改变它们的颜色。这样做容易让读者混淆，会让他们停下来思考：这是不是一个链接?
s o};T2Z#pz
.x+n:O6K8m 　　10、使用语义标记。比如为文章的标题使用h1 ，h2 ，h3 等标签来突出它们。可能你的
]#b_:`"p1E W
z E*~:Nc 　　11、读者当中有很多人在使用新闻聚合器阅读你的内容，诸如span class=”myheading” 这样的标签对他们而言是不会显示任何效果的。0Z5yy#| {Ox
4G&i&rl+q#?T
　　12、在开始的文章上使用贴图。这样做的目的是为了吸引读者的注意，通常会在最顶部的文章上应用贴图。
Q/Q B)f(C
+?1LWS:A R3L[ 　　13、避免整块的文本。没有什么能比像一面墙一样的文字更能吓跑访问者的了。\T)sKa b"M
qlj2};z&^0aF3\$X5_}9?
　　14、将文本居左对齐通常是最好的选择。我们很少能看到将文字居中或两边对齐的示例(标题除外)，而将文字居右对齐我想在任何时候都不是一个最好的选择。
;S5e&X}A!\ }B
:zBH-^&?$TU-g { 　　15、文本绕图。这主要取决于你如何将文本环绕在一个图像旁，你可以重新考虑文字的措辞，也可以调整图像的大小。h'g3p0["_(S0u!m


sm.a/vmD:x 　　16、文章标题和副标题必须突出。这样做的一个好处是可以让读者在第一时间了解这篇文章标题下面的内容是什么。使标题突出显示要做的工作只是使用更大的字体，为字体添加下划线、更改颜色等。,T;PyDM0y\1G(`/I

+C1A;G1eLFLW [ 　　17、了解何时使用有序列表，何时使用无序列表。如果你的项目列表有一个特定的顺序，最好用数字给它们添加编号。[P/Ql yeC

[.R9hZb$S 　　18、缩进列表。用以表明它们不仅仅是多个段落。
O)Q#nb$jm
R,H)e;vRZq.\)|(t 　　19、图像居中。如果有一些特定图片是你文章中无法划分出来的一部分(比如流程图、统计图)，最好把这些图像居中显示，并在图像前后指定一条分隔线。$K!Va/w ml9p |rp#r
T"xaKSH
　　20、创建一个打印样式表。记住并不是所有的读者都在电脑屏幕上阅读你的文章，建立一个打印样式表保证你的文章在纸上的效果同样出色。G rM2a~5[nAX

&St g/asm@ 　　21、选择通用字体。在你决定使用何种字体后，最好再选择一种人人都有的通用字体。w"y;y^9ITj(v!K Y

-r~8Z l-A 　　22、添加补充内容时最好与原文章空开一些距离。"~.EZ i Q4DzR3U
)n/O,Lt9C&^ hSl
　　23、突出的句子使用相同的字体大小。改变字体大小，将改变该行的高度，打乱页面布局。

Y5fr d$TZ?$Z
}DE!Q7]'{ 　　不要把正文中所有文字设置成使用全部大写。仅针对英文。
,fME"S ? b!rf4v%r8V+r
　　24、不要在链接上使用SnapShots 。
VVb"S2q2ArL@
IZ\$c#KVO6C[ 　　25、使文章内容保持一个合理的宽度。浮动布局常常会使文章的内容超出屏幕之外，使人无法阅读。
h}
d+eDS9O0im
{Qq*KM/qC&F 　　26、太多的段落总比太少的段落要好。在纸上写作时，通常每一段话有4-5个句子组成;而在网络上，每个段落有2-3句话组成是更加常见的。这样做是为了使段落呈现在一个漂亮的容易理解的小块中。
]0mE|L ][q2d0Oa
　　27、保持侧边栏的短小。~ rz4i"]-yx,c
)v!Q*yJ?q"R\v-r N
　　28、分页。如果你为一篇文章使用分页样式，要保证文章的导航是清晰且易于使用的。
wF@8Y:D3l
XkNidJ2N 　　29、使用淡化的颜色。为一些非关键信息使用淡化的颜色，比如发表时间、作者等。此外，淡颜色的线条不太会引起人的注意。/mt.a)Y7G;[I
SH*i%[]
^Kf
　　30、使用标签。为一些缩写词使用添加说明，并不是所有的读者都了解缩写词的含义。 的常规样式中在缩写词下面加一条虚下划线。

查看完整版本: 改善网站的可读性的30个方法