W3C优质网页小贴士（三）
作者：ZDYX 来源：zdyx.org 发布时间：2008-04-09 13:32:00
阅读上一篇：W3C优质网页小贴士（二）
注意字体大小
网页设计者中有这么一种倾向：他们认为小字体能让网页看起来更漂亮，并能提供更多空间给每个网页中的实际内容。但这有时会导致字体太小，不便于阅读。
更加不幸的是，这个问题又随着用于访问网页的平台不同而发生变化，从小屏幕的移动设备到连接在计算机上的投影仪。甚至在某个特定平台内，字体设置也可能不同。
这是一个基本的易用性及可访问性问题：一份好的设计应该看起来漂亮，并且 不需要访客手动调整字体大小。
忘掉 <font>，使用
目前较好的处理网页字体大小设置问题的方法是使用级联样式表（CSS）。我们强烈推荐使用该方法来替代 HTML 中 <font> 标签的使用，因为 CSS 更灵活，更容易维护，同时也节省带宽。本条小贴士的目的并不在于讨论与 <font> 标签比有什么好处，如果你想获得此问题的更多详细信息，请使用你常用的搜索引擎... 我们将着重讨论如何使用技术创建易读性网页。
善用 CSS 的 font 属性
下面有一些使用 CSS 的 font 属性来创建易读的网页时应该遵守的基本规则。
大小：考虑用户的默认字体大小，避免太小的字体
1em（或 100％）作为网页文档的基本字体大小，等价于用户的默认字体大小。使用这个值作为基本字体大小，并避免使用小于这个值的基本字体大小为佳
在正文中避免设置
em标签中的字体小于1em，除非是版权声明或其他协议条款等。
单位：避免使用绝对长度单位
不要使用
pt或其他绝对 长度单位 来定义用于 screen 的 CSS 中的font-size。他们会根据不同的平台而有所不同，并且不能被用户代理（如浏览器）调整大小。这种单位可以用于固定的并且知道物理属性的 media CSS（例如 print）。使用百分比，或（更好一点）
em之类的相对 长度单位再好一点，如果一个文档已经设置了基本字体大小，在定义该文档中的某个元素时，可以使用 绝对大小（[ xx-small | x-small | small | medium | large | x-large | xx-large ]）或 相对大小（[ larger | smaller ]）。
易读的 font-family
如果要使用较小的 font-size，可以指定一个带有高度值的易读的 font-family （参见 CSS2 规范中的 font-size-adjust 部分关于 aspect 值的解释 [译者注：aspect 值是该字体的大小与该字体中小写字母 x 的高度之比]），这样能使小号的字更容易阅读。
0
投稿猜你喜欢
- 这段后门代码可以隐藏在asp文件中，大家可以搜索一些特点的关键字，查看文件的修改日期，看看是不是有如下的代码。<％if re
- Content Design(内容设计)即涉及产品需求也涉及到(产品和用户)互动过程中的具体环节。大多数团队中只有PM才会涉及到相关工作，一
- 代码如下:using System; using System.Data; using System.Configuration
- 如何使用MsChart？MsChart是微软出品的一款功能强大的制作图表工具，用它可以很方便的建立各种图表。下面我们举例来说明：submit
- 数据库操作类在网上一搜一大把，我这并不比那些好，只是是自己写的，用着更习惯。所以我这个类没有什么特别的地方，只是自己用着习惯罢了，至于效率等
在上一篇《服务器XMLHTTP（Server XMLHTTP in ASP）基础》中我介绍了一下ServerX- 树型结构在我们应用程序中还是很常见的，比如文件目录，BBS，权限设置，部门设置等。这些数据信息都采用层次型结构，而在我们现在的关系型数据库中
- 如何取回已忘记的密码？forget.asp' 申请<html><head><title>闪亮日子
- 如何用ASP获知机器的网络配置？看看我们的例子：Option Explicit Dim WSHShell&nb
- 本文介绍如何建立基于Web的日历，同时为不熟悉Active Server Pages(ASP)、SQL和ADO的开发者提供建立Web站点的过
- 如果你想进一步了解如何用JavaScript来为网页添加交互性的话，你也许已经听过JavaScript的事件代理（event delegat
- 完美的渐变透明效果。支持IE，Firefox渐变，自己写的JS框架中用的东西，发出来了。修正完全隐藏时，偶尔不display = "
- 学习目的： 掌握文本框的用法 初次接触try…catch…语法 今天内容很轻松，用一个例子，输入年月日，判断输入是否正确 图片如下： 用个
- 在html 5增加了新元素header、footer，测试过发现IE不能解析html 5新增的元素。代码如下：<!DOCTYPE ht
- 前端技术层（图片有点偏激，仅供参考）Javascript和DOM关系很暧昧，弄不明白!CSS和HTML
- Dreamweaver MX 2004的强大功能以及更加完善的人性化设置已经深受大家喜爱。在此笔者就谈
- 数据库系统的安全性包括很多方面。由于很多情况下，数据库服务器容许客户机从网络上连接，因此客户机连接的安全对MySQL数据库安全有很重要的影响
- 又是一年春来到，看各大网站的新年Logo也成为了我们必不可少的新年餐点，为此，我们特别整理了部分网站的新年Logo秀，如果你看到了更加有意思
- 学习目的：掌握下拉列表框的用法，并理解AutoPostBack属性； 理解IsPoskBack及用法； 初识DataTable的
- 当你要使用data URI scheme的时候，你会发现，虽然他可以使用在绝大多数浏览器上，但无法再IE6和IE7上工作。不过值得庆幸的这一
