移动Web最佳实践1.0
最佳实践清单
最近在翻译W3C的这个最佳实践建议文档,为方便起见,将以下最佳实践清单放到此处讨论,以后文章会以主题形式发布,以下主题将会添加详情链接:
-
[主题一致性]确保内容在被不同设备访问时,能有连贯的用户体验。
-
[ 功能 ]利用设备能力,以提供增强的用户体验。
-
[ 缺陷 ]采取合理的步骤来解决不足的实现。
-
[ 测试 ]在实际设备以及模拟器上完成测试。
-
[ 统一资源定位符(URIs) ]保证站点入口URI的简短。
-
[导航栏 ]在页面顶部提供且仅提供最小的导航。
-
[ 平衡 ]'重视在链接数量'和'希望用户能链接中找到他们想要的'之间的平衡。
-
[ 导航 ]提供一致的导航机制。
-
[快捷键]为导航菜单和频繁访问的功能分配快捷键。
-
[链接目标ID(LINK_TARGET_ID)]明确确定每个链接的目标。
-
[链接目标格式]注意目标文档的格式,除非您知道该设备支持它。
-
[图片映射(IMAGE_MAPS)]不要使用影像映射,除非您知道设备能对其提供有效的支持。
-
[弹出窗口]不要产生弹出式窗口或其他窗口出现,不更改当前窗体,除非事先提醒用户。
-
[自动刷新]不要建立定期自动刷新页面,除非您已通知用户,并提供了停止的方法。
-
[ 重定向 ]不要使用标记来自动重定向页面。相反,通过配置服务器执行重定向,使用3xx系列的HTTP代码。
-
[外部资源]保持外部链接资源减少到最低限度。
-
[ 适合 ]确保内容适合在移动情况下使用。
-
[ 明晰 ]使用简单明了的语言。
-
[ 有限度 ]根据用户请求控制内容。
-
[页面尺寸可用性]将页面切割成可用但是有限大小(尽量小)的部分。
-
[页面大小限定]确保了页面的整体规模是适合设备的内存限制的。
-
[ 滚动 ]只向一个方向滚动,除非次要滚动无法避免。
-
[中心思想]确保材料接近于中心思想优先于非中心思想的材料。
-
[间距图形]不要使用间距的图形。
-
[大字符]不要使用不能由设备呈现的图像。避免使用大的或者高分辨率的图片,除了会丢失关键信息的情况。
-
[色彩的使用]确保信息在彩色和黑白色情况下都能够被有效传达。
-
[色彩对比度]确保前景色和背景色组合提供足够的对比度。
-
[背景图片可读性]当使用背景图片时,确保内容仍然在设备上的可读性。
-
[页面标题]提供一个简短但描述网页的标题。
-
[无框架]不要使用框架。
-
[ 结构 ]使用标记语言的逻辑功能,显示文档结构。
-
[表格支持]不要使用表格,除非确定该设备支持表格。
-
[表格嵌套]不要使用嵌套的表格。
-
[表格布局]不要使用布局表格。
-
[表格替代]如果可能,使用替代表格形式呈现。
-
[ 非文本元素替换]为非文本元素提供一个替代文本。
-
[对象或脚本]不要依赖于嵌入的对象或脚本。
-
[设定图片大小]在标记中指定的图像的大小,如果他们有固定的大小。
-
[图片大小]在服务器上调整图片大小,如果他们有一个固定的大小。
-
[有效标记]创建的文档符合正式发表的验证语法。
-
[ 测量 ]不要使用像素计量,并且避免在标记语言中的属性值和级联样式属性值中使用绝对单位。
-
[样式表的使用]使用样式表来控制编排和版面设计,除非已知设备不支持他们。
-
[样式表的支持]整理文档,以便必要时他们可能不读取样式表。
-
[样式表大小]保持样式表尽量小。
-
[ 最小大小 ]使用简洁,高效的标记。
-
[内容格式化支持]发送被公认是由设备支持的格式内容。
-
[内容的首选格式]如果可能的话,发送的首选格式的内容。
-
[字符编码支持]确保内容使用的字符编码是已知的设备支持的。
-
[字符编码的使用]在应答中指明所使用的字符编码。
-
[错误消息]提供有用的错误信息和从错误信息导航到有用信息的途径。
-
[ COOKIES ]不要依赖于可用的Cookie。
-
[ 缓存 ]提供缓存的HTTP响应信息。
-
[ 字体 ]不要依赖于相关的字体样式的支持。
-
[尽量少的按键]保持按键的数目减少到最低。
-
[避免自定义文本]尽可能的避免自定义文本( free text)。
-
[提供默认值]尽可能提供预先选定的默认值。
-
[默认输入模式]指定一个默认的文字输入模式,语言和/或输入格式,如果该设备是众所周知的支持。
-
[TAB键顺序]在控件和对象上通过链接创建一个逻辑顺序。
-
[控件标签]适度而明确的为所有窗体控件设置标签和关联标签。
-
[控件位置]位置标签,为其关联的空间设置适当的布局。
Quoted from 【W3C】
另外,推荐使用W3C的MobileOK Checker进行移动有好度测试,MobileOK相关标准与与本文最佳实践是一致的。