网页设计之文字的辨识度与可读性
作者:子条 来源:UCDChina.com 发布时间:2007-10-26 16:19:00
不久前因业务需要,我在自己的笔记本中安装了搜霸。当时一个做平面的朋友过来和我做一些设计交流,我在笔记本前准备输入一个网址,他靠近我的电脑,大叫道:“嗷!你也认识我的老同学“高亮”啊!”
我惊出一身冷汗。
几乎所有的产品中,都会使用到文字。小到错误、警告、提示信息,大到介绍、专题策划、广告文案。如果文字出现问题,修改起来成本很低。然而文字的可用性如果不好,将直接作用于产品。
我将文字的可用性理解为 辨识度 与 可读性 两个方面。
辨识度就是文字在界面上出现时,用户能不能正常阅读。在设计中最常遇到的问题是关于文字的字体、字号、以及行距、间距。在中文的WEB设计中,12号和14号宋体是最常使用的,纵观几大国内门户网站,这几乎已经成为中国网友的阅读习惯。
而遇到列表或大段文字,还需要注意行距问题。例如12号宋体时,我们一般使用18-20像素的行距。14号宋体通常使用22-24像素的行距。
WEB设计时,一般不用考虑平面设计中字与字的间距问题,而使用默认状态。
但是也有例外。有时我们会用到18号的黑体或宋体,例如新闻内页的标题。
特别要提一下UCDCHINA.COM上的文章顶部右侧都会有一个“-”一个“+”号:
这是一个很贴心的设计,当视力较弱或者年老的读者需要大一点的字体时。
可以使用“+”这个功能来提高文本的辨识度。
同时,设计师还要考虑文本的颜色、加粗、对齐方式、对比度、链接样式等辨识度方面的问题。为了重点显示某些信息,我们通常会给文字加粗或改变字体的颜色,但是要慎用。过度的强调等于没有强调,例如下面这种情况:
一些保守的设计师强烈要求带链接的文本要有下划线,而一些设计师却很反感大面积出现下划线的链接。
我觉得重点不是下划线的问题,而是凡是有链接的文字,需要与别的文字做一个明显的提示,以示区别。如:
在可读性方面,会出现的问题也不少,设计师遇到时要学会将它们剔出来。经常出现的会是“术语”问题,因为我们经常会在设计产品时无意识地使用一些术语。很多术语对我们自己来说简单,但是对我们的目标用户群来说并不容易。
例如,要避免使用”ISP”,而要说成”网络服务供应商”。别对用户说”PV”,而告知“流量”等等。
我们应尽量使用用户的语言,而不是想当然的使用术语。如果一定要使用术语,那么在每次出现这个词时要一致。千万不要一会“搜索”,一会“查找”,一会“查询”,不一致会增加用户的学习成本。
另一个常见的问题就是含义模糊不清,词不达意。
例如上文提到的“高亮”,其实重点不是会不会联想到你的同学叫高亮,而是“高亮”代表什么功能让人摸不着头脑:是谁让谁高让谁亮,为什么要高亮,
不高亮行不行?是变高还是变亮?这不是产生误解的问题,而是不解——不知道它是干什么的,自然就不敢去使用它。


猜你喜欢
- 本文实例讲述了python使用socket连接远程服务器的方法。分享给大家供大家参考。具体如下:import socketprint &qu
- 例如1441,那么会产生“运行时错误”,报错信息类似下面:SessionID 错误 'ASP 0164 : 80004005'
- 作为分布式系统(或任何系统)的一个组成部分,监测基础设施的重要性怎么强调都不过分。监控不仅要跟踪二进制的 "上升 "和
- 需求通过分析nginx访问日志,获取每个接口响应时间最大值、最小值、平均值及访问量。实现原理将nginx日志uriuriupstream_r
- 与运算 &举例: 3&5 &n
- clone 一个新项目,发现导包的时候出错 …原因可能是 pycharm 的根目录设置不对。设置根目录的步骤 如下 :来源:https://
- OUTLINE 常见的时间字符串与timestamp之间的转换日期与timestamp之间的转换常见的时间字符串与timesta
- 1.使用jobsName.ini文件保存要创建job的名字jobs1jobs2jobs32.使用Jenkins创建job时自动生成的conf
- 最近工作中的一个项目需要自动发送一些信息邮件到指定邮箱的需求,那么如何实现Python自动发送邮件的功能呢?接下来我们就来简单的介绍下如何利
- 前言终于下定决心学习Python了。既然从头开始,就需要认认真真。首先需要说的是,我是初学Python,这篇文章只是用于展示global和n
- PHP asXML()函数实例格式化 XML(版本 1.0)中的 SimpleXML 对象的数据:<?php $note=<&l
- 那你也许会问及,怎样获取当前系统日期的最大时间值,如yyyy-MM-dd 23:59:59.997。 我们可以使用DATEADD函数,来实现
- 一、概述任务描述:开发一个程序,用于获取局域网中开启snmp服务的主机ip地址列表,并写入相应文件以便其它程序使用。背景知识:SNMP是基于
- 首先将一个字典转化为DataFrame,然后以DataFrame中的列进行频次统计。代码如下:import pandas as pda={&
- 一、说在前面 需求:有一张长为960,宽为96的图片,需要将其分割成10张96*96的图
- 问题描述:某天使用idea,突然发现git提交记录没法查看具体提交的文件了。只能看到提交记录,如下图:分析可能是修改了控件设置的原因,于是尝
- 本文实例讲述了C#访问SQL Server数据库的实现方法。分享给大家供大家参考。具体如下:这里介绍一下用C#访问SQL Server数据库
- 相对于http协议,http是的特点就是他的安全性,http协议的通信内容用普通的嗅探器可以捕捉到,但是https协议的内容嗅探到的是加密后
- 1、grid 布局说明:参数说明: sticky:在插件正常尺寸下,分配单元中多余的空间(如果没有声明属性,默认插
- 有时在处理不规则数据时需要提取文本包含的时间日期。dateutil.parser模块可以统一日期字符串格式。datefinder模块可以在字