1. 首页
  2. 部门
  3. Web服务
  4. 可访问性
  5. WCAG A标准

WCAG A标准

 

Non-distinguishable链接
"Error occurs when same text is used for links pointing to different destinations."
 
例子:
 

For instance an error will occur if the text "招生" is used twice on your webpage and it is linked to different destinations.   这是如何发生的:

First "招生" link is pointing to Office 招生 root directory at:
http://7rfi.cai56b.com/departments/admissions/

While the second "招生" link is pointing to the index.HTML文件:
http://7rfi.cai56b.com/departments/admissions/index.html

Although they are going to the same location, some reader applications will treat the links as pointing to a different destinations.  

 
如何修复该错误:
  
  1. Always make sure to create links using OU dependency 标签s pointing to the destination website root directory instead of pointing directly to the index file.
     
  2. If you are linking to separate destination sources then make sure internet users utilizing a screen reader can distinguish between the links by doing one of the following:

    1. 链接文本是唯一的.  For example "本科招生" & “研究生招生” 而不是“招生”.
    2. Using aria-label* attribute to place a descriptive text label on your link object.  
    3. In addition to using aria-label make sure your link title is using a unique value. 


什么是aria-label?
   aria-label helps readers override the text supplied within the link.

缺少图像替代文本
"All images including presentational images should include alt 标签.  如果图像是链接的 then the alt 标签 should state the purpose of the link."
 
例子:
 

An error will occur if you are missing the alternative text attribute in your image 标签.   例如:

演出的图片:


Non-presentational (linked) images:

 
如何修复该错误:
 

演出的图片:


Non-presentational (linked) images:
go to the setup page

表象的属性
"Error occurs when presentational attributes are used in html 标签s instead of CSS."
 
例子:
 

For instance an error will occur if "align", "bgcolor" and "border" presentational attributes are used within html 标签 like "table" or "img".  下面是一个例子:

 
如何修复该错误:
 
  1. 使用CSS代替.
  2. Contact Web服务 if you need assistance.
避免使用HTML粗体标签
"Please avoid using the html bold 标签 “b” on your webpages. 你可以用 HTML“强”标签. Our CMS Editor automatically uses the “strong” 标签 when you select 把一个字加粗."
 
例子:
 


Hello 

 
如何修复该错误: 


应该改成
Hello 

避免使用HTML斜体标签
"Please avoid using the html italic 标签 “I” on your webpages. 相反，你可以使用 html“EM”标签. Our CMS Editor automatically uses the “EM” 标签 when you select 把一个字变成斜体."
 
例子:
 


Hello  

  
如何修复该错误: 


应该改成 
Hello

头嵌套

"Headings should be used to structure the page and not just for formatting.

should follow

and if the size is not correct, apply an appropriate style like

to control the size."

Example of correct header nesting:


     


         


         


     


         



Example of incorrect header nesting:

This often occurs when the user is tempted to use inappropriate headings for styling.


     


         


         


如何修复该错误:

Instead use a styled heading to control the size and styling of the font to achieve the same look but achieve appropriate header nesting: