1. 首页
  2. 新闻资讯

新闻资讯

06 2014 0三月

10条比较基础的网站易用性技巧

by DareWe

WebAIM队伍搏客的一些有关企业网站易用性的散文，相对较基础理论，简洁翻译英语看：

1. 给你的logo添加替代文本

是这样有的两个利弊：电子屏幕阅读书器能辨别的logo圖片大全体现的涵意，圖片大全未弹出到时，能够得知非视障朋友东京是你们的logo。 那种方式： 

						
				

<img src="logo.png" alt="前端界">

						
			

		
	




	或，你用图片背景图来实行了logo语句，也能能增加title附属性来实行了：



	

		
			

				


						
				

<span title="前端界"></span> </code>

						
			

		
	




	其中，的链接+蓝本图的玩法是比较好的，但比较好也还有title特性：



	

		
			

				


						
				

<a title="前端界">前端界</a>

						
			

		
	





	2.添加基本的Landmarks



	ARIA Landmark是W3C判定的整套网可以选择性规定，面对网有差异 的模组修改叙述性的Landmark——甚至直接性叫role，有帮助于读屏工具更佳的认为你的电脑官方网站，进而让视障玩家更佳的选择你的网。



	

		
			

				
					

						
				

<nav role="navigation"> <div id="maincontent" role="main"> <form action="search.php" role="search">

						
			

		
	




	等等等等，重要的制度请如何查看W3C的建意。



	3.增强focus定义



	实际上有许多网站首页要用到尽凡事方案去除阅读记录器的:focus文本框文本框样式，十分是关于IE阅读记录器，实际上，阅读记录器快捷设置加上:focus文本框文本框样式是有事理的，它能技巧顾客当今的光标目光地理位置是哪儿里。这关于琴键流十分必要。


	因此请就不要盖住:focus形状，几乎，你都觉得默许的形状不比较吸引人也许不一致（IE是虚线框，Webkit是高亮显示的实线框，有时候，Safari是天蓝色，Chrome是橘色）也能够 各自给定位一名高亮显示色：



	

		
			

				


						
				

a:focus{ outline:1px solid red; background:yellow; }

						
			

		
	




	比如你的新产品运营经理或视觉艺术设计方案师始终坚持要清除focus阶段话语，把TA的鼠标滚轮抢走那天并提醒TA只是用Tab切回超链接就了。。。



	4.定义必填表单项




	用aria-required属性可以定义表单中的必填项——嗯，主要还是告诉读屏软件：




	

		
			

				


						
				

<input type="text" name="username" aria-required="true">

						
			

		
	





	5.给你的页面添加一个h1



	原由很简便，不只是不要不但SEO，对网建筑体的需用性和流畅性都很有让。单独，你并没有码感情洁癖么？



	6.定义表格的表头




	通常很多人习惯表格全部使用td标签，其实，表格不止有hd标签，还有th、col、scope等。




	所以简单来说，表头换成th标签吧：




	

		
			

				


						
				

<th scope="col">Date</th>

						
			

		
	





	7.定义表格描述



	最好不要方便的在申请表和数据表最前面/后面的英文加个p了事了，申请表和数据表有通用型的caption标签纸可作，就是图片大全一个。



	

		
			

				


						
				

<table> <caption>Class Schedule</caption> <tr> ……

						
			

		
	




	相对于图表部位，微弱网友推荐坏点重新发现HTML图表



	8.避免“点击此处”



	虽然说只要的地址描术对常见人都无即是，同时对读屏小软件言之，是该是差的，它就是是对望障业主的是一种电磁干扰。


	全部，可以把的链接涉及到正地区吧。



	9.去掉tabindex




	曾经，很多人用tabindex来“增强”用户体验，但是这个属性却会打乱页面的正常阅读顺序，对视障用户是灾难性的，对普通用户也未必是友善的。




	所以千万不要滥用tabindex属性。




	10.在线检测一下



	呃，看过这知道或许是个软广，其实一旦能检查出來平台网站能作性问题，也是件大好事情情，WebAIM开拓的某个淘宝网页辅助工具，放入URL也会定时检查。