10个排版技巧可以提高网站的可读性

10个排版技巧可以提高网站的可读性

操作方法

  • 01

    1、改正行高 最常见的网页布局错误之一是定义了不正确的行高。行高是定义一行文本的高度,所以我们必须遵守文本字体大小来设定行高。一般来说,在设置文本行高的时辰,我经常在字体大小的根蒂根基上加上7个像素(对12-17像素的字体而言)body{font-size:14px;line-height:21px; /* 14px + 7px */}

  • 02

    2、改正题目margin值 另一个常见的错误是题目四周不正确的margin值。题目其实是与它下面的段落是相接洽关系的,而不仅仅是两个段落的分割符。这就是为什么题目标margin-top比margin-bottom要宽。

  • 03

    3、不要应用过多的字体 为了确保可读性和专业性,你的网页上不该应用跨越3种字体。应用过多的字体会干扰你的用户并且让你的网站看起来很乱。相反,较少的字体让你的网站显得干净易读。你可以题目应用一种字体,正文应用一种字体,最后 logo或副题目应用别的的字体。

  • 04

    4、代码项目组应用等宽字体 若是你是一位开辟者(就像大项目组读这篇博客的人)你可能想贴一些代码在你的博客里。若是这样,请应用等宽字体。那么,什么是等宽字体?它就是字母和字符占雷同程度宽度的字体。

  • 05

    5、只给链接的文本加下划线 浏览器用在链接的默认样式一向是蓝色文本加下划线。固然这个蓝色经常被改成别的的色彩,但下划线一向被当做是链接的常规样式。这就是为什么除了链接你不要给其他的器材加下划线的原因。不然,这可能对你的用户造成很大的困惑。

  • 06

    6、存眷对比 即使你的网站有很好的排版了,另一个须要重视的是对比。若是你的页面背景是中灰色,那么不要应用深灰色的文本,不然你的内容很丢脸的,尤其是对一些年数大的或视力差的人。总之,除非你的网站是关于黑客、黑帽搜刮引擎优化或哥特摇滚的,不然你应当应用淡色背景和深色字体,清楚的对比度增长你网站的可读性。

  • 07

    7、创建样式库 让你的网站产生视觉震动的一个简单高效的办法是给特别的页面创建特别的样式。例如,创建一个.warning的CSS类来向 你的用户显示“警告”。

  • 08

    8、大胆留白 我认为最重要的排版技巧之一是“大胆留白”。留白是指空白区或没有应用的空间,它会使你的设计整洁而专业。很多人喜好苹果网站的原因是:它尽管简单但很精细,并且有很多留白。

  • 09

    9、按级别来分列题目和文本 为了增长可读性,给题目、介绍段落和常规文本创建标签层级是很重要的,也许你的用户可以看清你的文章布局并能很快的找到他们感爱好的项目组。

  • 10

    10、正确应用标点符号 若是你想提拔你的排版程度不容忽视的一点是正确应用标点符号。例如,引号经常用双撇符号代替。

(0)

相关推荐

  • 10个小技巧教你怎样提高PS技术?

    10个小技巧不仅仅是软件的实际操作,更包含到平时各种小习惯的培养!一个个好的小习惯,可以让你在实际中游刃有余. 操作方法 01 设置恰当的分辨率 图像在设计师手中会进行拉伸.扭曲等各种操作,如果没有设 ...

  • 网站制作者必须精通的DIV+CSS排版技巧

    操作方法 01 网站建设及网站布局的基本是要懂得DIV+CSS,通过合理的利用DIV+CSS可以利于搜索引擎的抓取,个人感觉DIV+CSS作为制作网页,美化网页的一个重要辅助是很强大方便的,可以弥补t ...

  • 10个排版秘诀搞定你的设计!

    文字排版(Typography)不只是从下拉选单选择字型和点数而已,文字排版是一项流传数世纪的技艺,自木制和金属的活版印刷便开始,而且它不只历史悠久,还很实用,大部分的人只要掌握一些实用的诀窍,就可以 ...

  • 怎样提高网站信任度

    作为电子商务类网站,尤其是不出名类站点,如果想通过网站销售商品的话,首先得提供网站的信任度.因为不管是传统购物还是在网上购物,信誉一直都是所有消费者非常看重的一点,或者说是最看重的.几乎所有淘宝卖家, ...

  • ppt排版技巧:ppt中多对象如何快速对齐、组合、调整相同间距?

    我们在PPT中进行图形.图片.文本框的排版时,需要经常用到多个对象对齐.组合对象.对象保持相同间距问题.如果要凭感觉手动去调整的话,不但效率很低,效果也未必好.那么,有什么比较快的方法和技巧吗?详细的 ...

  • Word排版技巧,文档瞬间高大上

    一份好的文档会提高读者的阅读兴趣,今天小Q教大家Word分栏排版技巧,瞬间让你的文档看起来更高大上. 下面我们看一下排版 后的效果图.是不是觉得文档看起来好看,更有兴趣去阅读呢? 杂志风排版制作步骤: ...

  • 电商 Banner 之五大排版技巧

    在电商设计中,Banner 是设计最多的一个,只要有新品.专题.直通车出来,都需要示一个有力的 Banner.在淘宝美工有一大部分不是专业设计师,最多是会 PS 这个设计软件. 没关系,即使你是初级设 ...

  • 常用平面排版技巧汇总

    为大家总结了几个常用平面排版技巧,也许对你有用! (一)平面设计的目的 我们在做任何一个平面设计的前提,都要搞清楚我们做设计的目的,不是为了单纯的追求美感,不是为了炫技,而是为了信息传达.为了让用户在 ...

  • 不论是海报、PPT还是杂志封面设计,都离不开的图文排版技巧

    网站落地页面和在线广告设计,无论从广告牌到名片,我们每天遇到的许多设计都有一些共同之处.我说的是什么呢?平面设计的最基本的组成部分之一--图文排版.虽然在一张漂亮的照片上写上一句引人入胜的短语,可能看 ...