网页设计制作中巧用文字技巧增强文章可阅读性

客户提问:
如何网页设计制作中巧用文字技巧增强文章可阅读性?

凯铧互联设计师回复:
网络上传播信息95%是靠文字进行传播的,那么我们怎么做好文章的可阅读性就十分重要了。今天就由凯铧互联UI设计师,教大家巧用字体设计增强文章的可阅读性。

文章字体类型使用不要超过三种

三种文字类型使用基本上是最大值,如果超多三种文字类型的使用会使我们的网站看起来非常的不专业,没有一个合理的结构感觉,不容易让用户产生信任,有可能还会是用户怀疑这个网站的正规性。还有就是合理的使用尺寸、风格优化布局。

字体最好选择标准字体

网页设计制作中字体的嵌入服务(如Google Web Fonts或Typekit))为我们提供新鲜的和意想不到的许多有趣的字体。但是我们不能在这其中迷失,还是要考虑网站类型,网站的目的这些因素。例如我们是一个新闻类网站,我们字体就一定要选择标准字体,既能让网站有一种正规,有公信力的感觉,又能增加用户信任。而且标准字体是万能字体,也是我们使用最为广阔的字体,当你不知道具体该怎么选择的时候最好选择标准字体。

要注意分辨字母

我们做网站的文字页面排版布局是,文字的内容有可能会出现字母(英文)的情况,这时候我们一定要主要区分好这些字母,例如“i”和“l”这两个字母如果“I”大写就直接和“l”差不多一样了,所以我们一定要做好区分才能避免用户得到的是错误信息。

注意字体的大小设置

文字的大小对于一个文章页面是至关重要的,通常情况下我们的标题一般设置在三号或者小三号,而文字一般设置为小四号,这样是用户阅读文章最为舒适的字体大小。

行间距让页面能“呼吸”

网页设计制作中排版,有一些专业的术语,两行文本之间的距离叫做间距(或行高)。通过调整行间距,可以增加或者建设文本间的距离适当的留白使网页能够“呼吸”,提升用户的阅读体验增加文章的可读性。行间距在字符高度的30%,是能起到提升文章阅读性的最佳高度。

色彩的合理利用,尽量避免使用红色和绿色

色彩往往更能抓住用户的眼前,我们在设置时可以把一些最重要的,最能提升用户阅读兴趣的信息改变它的颜色,吸引用户优先浏览,从未增加文章的可阅读性。但是在颜色的选择中尽量少使用红色、绿色这种非常扎眼的颜色。

千万不要出现闪烁的字体

闪烁的字体特效虽然我们感觉是非常的酷炫,但是对我们文章的可阅读性危害是非常大的,会让用户感觉这片文章的内容不正规,不严谨,从而降低浏览,降低阅读。

阿里云产品优惠联系凯铧互联

凯铧互联设计部:专注于为企业提供高品质优秀网站视觉设计和高端程序开发以及互联网品牌整合,不单为中小企业提供高端网站设计制作服务,还从市场的角度和客户的需求出发,融合视觉美学及有效营销,提升企业与产品的内在品质,将高端网站设计产品和用户体验更好的融入到整个网站模板设计体系当中,为企业品牌创造独到的形象,拓展市场竞争空间与竞争优势,并以设计指导师别出设计和品 牌营销体验创新实现客户的商业目标。

北京网页模板,北京网站模板,北京模板建站,北京模板网站,北京企业建站,北京企业网站模板,北京营销互动网站

建站咨询热线:136-5130-9831 (王小姐) QQ:2550856134(高品质优秀网站视觉设计-维尼)

网站UI设计、大型平台界面设计(P2P/B2C/B2B/教育平台/风控/借贷等)、软件界面设计、app界面设计等UI设计,咨询热线:186-4746-6099 周导

CSS网页制作工具,网站建设基本技能

一个网站是由无数个网页组成的,一个好的网站肯定有无数个好的网页,而好的网页CSS是最基础的东西。

CSS是Cascading style Sheets的简称,中文译作“层叠样式表单”。

1、CSS在网站网页制作中一般有三种方式的用法,那么具体在使用时该采用哪种用法?
当有多个网页要用到的CSS,采用外连CSS文件的方式,这样网页的代码大大减少,修改起来非常方便;只在单个网页
中使用的CSS,采用文档头部方式;只有在一个网页一、两个地方才用到的CSS,采用行内插入方式。

2、CSS的三种用法在一个网站、网页页中要以混用吗?
三种用法可以混用,且不会造成混乱。这就是它为什么称之为“层叠样式表”的原因,浏览器在显示网页时是这样处
理的:先检查有没有行内插入式CSS,有就执行了,针对本句的其它CSS就不去管它了;其次检查头部方式的CSS,有就执行
了;在前两者都没有的情况下再检查外连文件方式的CSS。因此可看出,三种CSS的执行优先级是:行内插入式、头部方
式、外连文件方式。

3、CSS在网站/网页制作中的调用方法
第一种:从页面头部调用
从页面头部调用CSS是将CSS写在页面的head元素中,然后在页面中调用。其语法结构如下:
选择符{属性:属性值;}

——————————————————-
例如:

测试

————————————————————
ps:这个是在头文件里面写
第二种:采用链接的形式调用
采用链接的形式调用CSS通常有两种方法:
使用link元素
使用link元素调用CSS的语法如下:
文件路径” type=”text/css”/>
————————————————————————-
例如:

测试

———————————————————————
使用@import
——————————————————————
例如:

测试

————————————————————————–
ps:这个也是写在头文件里面的
第三种:元素中直接使用
这种调用方式的写法如下:
<</span>元素名称 style=”属性:属性值;”></</span>元素名称>
在样式中直接使用CSS,语法是使用style标签,在双引号中,样式的语法结构和独立样式表中完全相同。
————————————————————————-
例如:

示例:元素中直接调用