SlideShare ist ein Scribd-Unternehmen logo
1 von 31
©2008 IBM Corporation

    
    
    




2

    
    
    




2
2.0







    
    
    
    




3

    
    
    




4

    
    
    




4
1



        <input type="image" name="Go" src="btn_go.gif" alt="Go" />


        <a href="digg.html"/> <img src="digg.gif" alt="" /> Digg This </a>






        <img src="home.gif" usemap="#HomeNav_Map" alt="Home Navigation Bar" />
        <map name="HomeNav_Map">
        <area coords=“x,x,y,y" shape="rect" href="philosophy.htm" alt="Philosophy" />
        <area coords=“x,x,y,y" shape="rect" href="portfolio.htm" alt="Portfolio" />
        <area coords=“x,x,y,y" shape="rect" href="technology.htm" alt="Technology" />
        <area coords=“x,x,y,y" shape="rect" href="employment.htm" alt="Employment" />
        <area coords=“x,x,y,y" shape="rect" href="contact.htm" alt="Contact us" />
        </map>

         4
        <img src="piechart.gif" longdesc="piechart_desc.html" alt="75% cars and 25% trucks." />





    5
1




    <object classid="java:gravity:class" width="200" height="250">
    <p>When gravity acts on an object, the weight...</p>
    </object>

    <object data="ibmworld.mpeg" type="application/mpeg">
    <p>IBM has offices in Argentina, Australia, ... Vietnam.</p>
    </object>



    <applet code="spin-lobe.class" alt="Spinning Globe">
    <p>This applet shows how the earth spins from west to east, but the
    line of darkness appears to move from east to west.</p>
    </applet>




6
1

    2
                1


                2


               3


        


        





                1


                2

                3




7
1

    3




    <table border="1" summary="A example simple data table showing the number of
    boys and girls in each grade of an elementary school">
    <caption>Boys and Girls in Elementary School Classes</caption>
    <tr>
    <th scope="col">Class</th>
    <th scope="col"># of Boys</th>
    <th scope="col"># of Girls</th>
    </tr>
    <tr>
    <th scope="row">1st Grade</th>
    <td>11</td>
    <td>10</td>
    </tr>
    <tr>
    <th scope="row">2nd Grade</th>
    <td>7</td>
    <td>12</td>
    </tr>
    ...
    </table>
8
1

    3


2          ID    HEADERS
    <tr>
    <th id="class">Class</th>
    <th id="teacher">Teacher</th>
    <th id="boys"># of Boys</th>
    <th id="girls"># of Girls</th>
    </tr>
    <tr>
    <th id="1stgrade" rowspan="2">1st Grade</th>
    <th id="MrHenry" headers="1stgrade teacher">Mr. Henry</th>
    <td headers="1stgrade MrHenry boys">5</td>
    <td headers="1stgrade MrHenry girls">4</td>
    </tr>
    <tr>
    <th id="MrsSmith" headers="1stgrade teacher">Mrs. Smith</th>
    <td headers="1stgrade MrsSmith boys">7</td>
    <td headers="1stgrade MrsSmith girls">9</td>
    </tr>




9
1

     4




10

     
     
     




11

     
     
     




11
2

     1


             “   ”




12
2
         2




                              ······


                     10                    ······

             
             
             
             


         3




                         1            3


    13
2



     <h1>All structures</h1>
     <h3>Rationale</h3> <p>This section talks about why the checkpoint is
     important</p> ...
     <h3>Techniques</h3> <p>This section defines specific techniques to meet the
     checkpoint.</p>




14
2




     <a href="#content-main">Skip to main content</a>
     <a href="#left-nav">Skip to navigation</a>
     <a href="#index">Jump to portlet page index</a>



             title <title>      2010              </title>
             title <title>      2010               |         </title>



     <input type="text" id="search" name="search" role="search" />



     <a href=“register.html”>              </a>




15
3




               <html lang=“zh-cn” xml:lang=“zh-cn">
            <html lang="en" xml:lang="en">
            <html lang="jp" xml:lang="jp">
            <html lang=“fr” xml:lang=“fr”>
               <html lang=“zh-tw” xml:lang=“zh-tw”>




16

     
     
     




17

     
     
     




17
3




     



     




                        ······


     
     

             “active”            “focus”

18
3




2        <label for="phone">* Phone number:</label>

         <input type="text" id="phone" name="phone">

         <p>* indicates required information must be
           entered.</p>
19

     
     
     




20

     
     
     




20
4




21

     
     
     




22

     
     
     




22





















23
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//
          EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
          transitional.dtd">
     <html>
     <head>
     <title>Exposition universelle de Shanghai</title>
     <meta http-equiv="Content-Type" content="text/html;
          charset=utf-8">
     <link href="/css/index_fr.css" type="text/css"
          rel="stylesheet">
     <script type="text/javascript"> var ___pagestarttime = new
          Date().getTime(); </script>
     </head>

                                      title




        submit




24
25

Weitere ähnliche Inhalte

Was ist angesagt?

zynga-online.facebook.html
zynga-online.facebook.htmlzynga-online.facebook.html
zynga-online.facebook.htmladmin999
 
Itsecteam shell
Itsecteam shellItsecteam shell
Itsecteam shellady36
 
Devoxx 2014-webComponents
Devoxx 2014-webComponentsDevoxx 2014-webComponents
Devoxx 2014-webComponentsCyril Balit
 
Windows Phone 7 Development
Windows Phone 7 DevelopmentWindows Phone 7 Development
Windows Phone 7 DevelopmentMichele Capra
 
引き出しとしてのDjango - SoozyCon7
引き出しとしてのDjango - SoozyCon7引き出しとしてのDjango - SoozyCon7
引き出しとしてのDjango - SoozyCon7makoto tsuyuki
 
16. CodeIgniter stergerea inregistrarilor
16. CodeIgniter stergerea inregistrarilor16. CodeIgniter stergerea inregistrarilor
16. CodeIgniter stergerea inregistrarilorRazvan Raducanu, PhD
 
SULTHAN's - PHP MySQL programs
SULTHAN's - PHP MySQL programsSULTHAN's - PHP MySQL programs
SULTHAN's - PHP MySQL programsSULTHAN BASHA
 
Windows Phone 7 Development
Windows Phone 7 DevelopmentWindows Phone 7 Development
Windows Phone 7 DevelopmentClaudio Gandelli
 
Security: Odoo Code Hardening
Security: Odoo Code HardeningSecurity: Odoo Code Hardening
Security: Odoo Code HardeningOdoo
 
Martialask Нидерландия Шахбокс исторически събития и дати
Martialask Нидерландия Шахбокс исторически събития и датиMartialask Нидерландия Шахбокс исторически събития и дати
Martialask Нидерландия Шахбокс исторически събития и датиFIDE Master Tihomir Dovramadjiev PhD
 

Was ist angesagt? (17)

Pp checker
Pp checkerPp checker
Pp checker
 
1 eso-tema-2-el-relieve
1 eso-tema-2-el-relieve1 eso-tema-2-el-relieve
1 eso-tema-2-el-relieve
 
Jsf lab
Jsf labJsf lab
Jsf lab
 
zynga-online.facebook.html
zynga-online.facebook.htmlzynga-online.facebook.html
zynga-online.facebook.html
 
Html
HtmlHtml
Html
 
Hacking with YUI
Hacking with YUIHacking with YUI
Hacking with YUI
 
Itsecteam shell
Itsecteam shellItsecteam shell
Itsecteam shell
 
Devoxx 2014-webComponents
Devoxx 2014-webComponentsDevoxx 2014-webComponents
Devoxx 2014-webComponents
 
Windows Phone 7 Development
Windows Phone 7 DevelopmentWindows Phone 7 Development
Windows Phone 7 Development
 
9. lower in Symfony 4
9. lower in Symfony 49. lower in Symfony 4
9. lower in Symfony 4
 
引き出しとしてのDjango - SoozyCon7
引き出しとしてのDjango - SoozyCon7引き出しとしてのDjango - SoozyCon7
引き出しとしてのDjango - SoozyCon7
 
16. CodeIgniter stergerea inregistrarilor
16. CodeIgniter stergerea inregistrarilor16. CodeIgniter stergerea inregistrarilor
16. CodeIgniter stergerea inregistrarilor
 
SULTHAN's - PHP MySQL programs
SULTHAN's - PHP MySQL programsSULTHAN's - PHP MySQL programs
SULTHAN's - PHP MySQL programs
 
Windows Phone 7 Development
Windows Phone 7 DevelopmentWindows Phone 7 Development
Windows Phone 7 Development
 
Security: Odoo Code Hardening
Security: Odoo Code HardeningSecurity: Odoo Code Hardening
Security: Odoo Code Hardening
 
7. copy2 in Symfony 4
7. copy2 in Symfony 47. copy2 in Symfony 4
7. copy2 in Symfony 4
 
Martialask Нидерландия Шахбокс исторически събития и дати
Martialask Нидерландия Шахбокс исторически събития и датиMartialask Нидерландия Шахбокс исторически събития и дати
Martialask Нидерландия Шахбокс исторически събития и дати
 

Ähnlich wie 网站无障碍阅读知识

Vaadin Components @ Angular U
Vaadin Components @ Angular UVaadin Components @ Angular U
Vaadin Components @ Angular UJoonas Lehtinen
 
Vidéo approche en immobilier
Vidéo approche en immobilierVidéo approche en immobilier
Vidéo approche en immobilierhervepouliot
 
49368010 projectreportontraininganddevelopment(1)
49368010 projectreportontraininganddevelopment(1)49368010 projectreportontraininganddevelopment(1)
49368010 projectreportontraininganddevelopment(1)Kritika910
 
Facebook.html
Facebook.htmlFacebook.html
Facebook.htmladmin999
 
Facebook.html
Facebook.htmlFacebook.html
Facebook.htmladmin999
 
关于 Html5 那点事
关于 Html5 那点事关于 Html5 那点事
关于 Html5 那点事Sofish Lin
 
Ss 36932418[1]
Ss 36932418[1]Ss 36932418[1]
Ss 36932418[1]Ya Jinda
 
Building iPhone Web Apps using "classic" Domino
Building iPhone Web Apps using "classic" DominoBuilding iPhone Web Apps using "classic" Domino
Building iPhone Web Apps using "classic" DominoRob Bontekoe
 
Web Scripting Project JavaScripts and HTML WebPage
Web Scripting Project JavaScripts and HTML WebPageWeb Scripting Project JavaScripts and HTML WebPage
Web Scripting Project JavaScripts and HTML WebPageSunny U Okoro
 

Ähnlich wie 网站无障碍阅读知识 (20)

Html5 intro
Html5 introHtml5 intro
Html5 intro
 
Vaadin Components @ Angular U
Vaadin Components @ Angular UVaadin Components @ Angular U
Vaadin Components @ Angular U
 
HTML5 Essentials
HTML5 EssentialsHTML5 Essentials
HTML5 Essentials
 
Introduccion a HTML5
Introduccion a HTML5Introduccion a HTML5
Introduccion a HTML5
 
html5
html5html5
html5
 
Schoology tutorial[1]
Schoology tutorial[1]Schoology tutorial[1]
Schoology tutorial[1]
 
CAR Email 06.05.02 (a)
CAR Email 06.05.02 (a)CAR Email 06.05.02 (a)
CAR Email 06.05.02 (a)
 
Vidéo approche en immobilier
Vidéo approche en immobilierVidéo approche en immobilier
Vidéo approche en immobilier
 
Introduction to Html5
Introduction to Html5Introduction to Html5
Introduction to Html5
 
49368010 projectreportontraininganddevelopment(1)
49368010 projectreportontraininganddevelopment(1)49368010 projectreportontraininganddevelopment(1)
49368010 projectreportontraininganddevelopment(1)
 
Test upload
Test uploadTest upload
Test upload
 
The Devil and HTML5
The Devil and HTML5The Devil and HTML5
The Devil and HTML5
 
Facebook.html
Facebook.htmlFacebook.html
Facebook.html
 
Facebook.html
Facebook.htmlFacebook.html
Facebook.html
 
关于 Html5 那点事
关于 Html5 那点事关于 Html5 那点事
关于 Html5 那点事
 
CAR Email 6.5.02 (d)
CAR Email 6.5.02 (d)CAR Email 6.5.02 (d)
CAR Email 6.5.02 (d)
 
Ss 36932418[1]
Ss 36932418[1]Ss 36932418[1]
Ss 36932418[1]
 
Building iPhone Web Apps using "classic" Domino
Building iPhone Web Apps using "classic" DominoBuilding iPhone Web Apps using "classic" Domino
Building iPhone Web Apps using "classic" Domino
 
RCEC Email 3.5.03
RCEC Email 3.5.03RCEC Email 3.5.03
RCEC Email 3.5.03
 
Web Scripting Project JavaScripts and HTML WebPage
Web Scripting Project JavaScripts and HTML WebPageWeb Scripting Project JavaScripts and HTML WebPage
Web Scripting Project JavaScripts and HTML WebPage
 

网站无障碍阅读知识

  • 2.    2
  • 3.    2
  • 4. 2.0      3
  • 5.    4
  • 6.    4
  • 7. 1  <input type="image" name="Go" src="btn_go.gif" alt="Go" />  <a href="digg.html"/> <img src="digg.gif" alt="" /> Digg This </a>  <img src="home.gif" usemap="#HomeNav_Map" alt="Home Navigation Bar" /> <map name="HomeNav_Map"> <area coords=“x,x,y,y" shape="rect" href="philosophy.htm" alt="Philosophy" /> <area coords=“x,x,y,y" shape="rect" href="portfolio.htm" alt="Portfolio" /> <area coords=“x,x,y,y" shape="rect" href="technology.htm" alt="Technology" /> <area coords=“x,x,y,y" shape="rect" href="employment.htm" alt="Employment" /> <area coords=“x,x,y,y" shape="rect" href="contact.htm" alt="Contact us" /> </map> 4 <img src="piechart.gif" longdesc="piechart_desc.html" alt="75% cars and 25% trucks." />  5
  • 8. 1 <object classid="java:gravity:class" width="200" height="250"> <p>When gravity acts on an object, the weight...</p> </object> <object data="ibmworld.mpeg" type="application/mpeg"> <p>IBM has offices in Argentina, Australia, ... Vietnam.</p> </object> <applet code="spin-lobe.class" alt="Spinning Globe"> <p>This applet shows how the earth spins from west to east, but the line of darkness appears to move from east to west.</p> </applet> 6
  • 9. 1 2 1 2  3    1 2  3 7
  • 10. 1 3 <table border="1" summary="A example simple data table showing the number of boys and girls in each grade of an elementary school"> <caption>Boys and Girls in Elementary School Classes</caption> <tr> <th scope="col">Class</th> <th scope="col"># of Boys</th> <th scope="col"># of Girls</th> </tr> <tr> <th scope="row">1st Grade</th> <td>11</td> <td>10</td> </tr> <tr> <th scope="row">2nd Grade</th> <td>7</td> <td>12</td> </tr> ... </table> 8
  • 11. 1 3 2 ID HEADERS <tr> <th id="class">Class</th> <th id="teacher">Teacher</th> <th id="boys"># of Boys</th> <th id="girls"># of Girls</th> </tr> <tr> <th id="1stgrade" rowspan="2">1st Grade</th> <th id="MrHenry" headers="1stgrade teacher">Mr. Henry</th> <td headers="1stgrade MrHenry boys">5</td> <td headers="1stgrade MrHenry girls">4</td> </tr> <tr> <th id="MrsSmith" headers="1stgrade teacher">Mrs. Smith</th> <td headers="1stgrade MrsSmith boys">7</td> <td headers="1stgrade MrsSmith girls">9</td> </tr> 9
  • 12. 1 4 10
  • 13.    11
  • 14.    11
  • 15. 2 1 “ ” 12
  • 16. 2 2 ······  10 ······     3  1 3 13
  • 17. 2 <h1>All structures</h1> <h3>Rationale</h3> <p>This section talks about why the checkpoint is important</p> ... <h3>Techniques</h3> <p>This section defines specific techniques to meet the checkpoint.</p> 14
  • 18. 2 <a href="#content-main">Skip to main content</a> <a href="#left-nav">Skip to navigation</a> <a href="#index">Jump to portlet page index</a> title <title> 2010 </title> title <title> 2010 | </title> <input type="text" id="search" name="search" role="search" /> <a href=“register.html”> </a> 15
  • 19. 3  <html lang=“zh-cn” xml:lang=“zh-cn">  <html lang="en" xml:lang="en">  <html lang="jp" xml:lang="jp">  <html lang=“fr” xml:lang=“fr”>  <html lang=“zh-tw” xml:lang=“zh-tw”> 16
  • 20.    17
  • 21.    17
  • 22. 3   ······    “active” “focus” 18
  • 23. 3 2 <label for="phone">* Phone number:</label> <input type="text" id="phone" name="phone"> <p>* indicates required information must be entered.</p> 19
  • 24.    20
  • 25.    20
  • 26. 4 21
  • 27.    22
  • 28.    22
  • 30. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- transitional.dtd"> <html> <head> <title>Exposition universelle de Shanghai</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <link href="/css/index_fr.css" type="text/css" rel="stylesheet"> <script type="text/javascript"> var ___pagestarttime = new Date().getTime(); </script> </head> title submit 24
  • 31. 25

Hinweis der Redaktion

  1. \n
  2. \n
  3. \n
  4. \n
  5. &amp;#x76EE;&amp;#x524D;&amp;#x4E16;&amp;#x535A;&amp;#x5B98;&amp;#x7F51;&amp;#x662F;Form + DIV&amp;#xFF0C;&amp;#x9996;&amp;#x9875;&amp;#x7684;&amp;#x56FE;&amp;#x50CF;&amp;#x6587;&amp;#x4EF6;&amp;#x6539;&amp;#x4E3A;&amp;#x80CC;&amp;#x666F;\n1&amp;#x3001;&amp;#x9875;&amp;#x9762;&amp;#x4E2D;&amp;#x7684;&amp;#x8BF4;&amp;#x660E;&amp;#x6027;&amp;#x56FE;&amp;#x7247;&amp;#x5E94;&amp;#x6709;&amp;#x76F8;&amp;#x5E94;&amp;#x7684;&amp;#x66FF;&amp;#x4EE3;&amp;#x6587;&amp;#x672C;&amp;#xFF0C;&amp;#x5982;&amp;#x4EBA;&amp;#x7269;&amp;#x56FE;&amp;#x7247;&amp;#x5E94;&amp;#x8BE5;&amp;#x5728;ALT&amp;#x5C5E;&amp;#x6027;&amp;#x4E2D;&amp;#x52A0;&amp;#x5165;&amp;#x8BE5;&amp;#x4EBA;&amp;#x7269;&amp;#x7684;&amp;#x59D3;&amp;#x540D;&amp;#xFF1B;&amp;#x64CD;&amp;#x4F5C;&amp;#x8BF4;&amp;#x660E;&amp;#x56FE;&amp;#x7247;&amp;#x5E94;&amp;#x8BE5;&amp;#x5728;ALT&amp;#x5C5E;&amp;#x6027;&amp;#x4E2D;&amp;#x52A0;&amp;#x5165;&amp;#x64CD;&amp;#x4F5C;&amp;#x8BF4;&amp;#x660E;&amp;#x6587;&amp;#x672C;&amp;#xFF1B;\n2&amp;#x3001;&amp;#x5F53;&amp;#x56FE;&amp;#x7247;&amp;#x88AB;&amp;#x7528;&amp;#x4F5C;&amp;#x63D0;&amp;#x4EA4;&amp;#x6216;&amp;#x5BFC;&amp;#x822A;&amp;#x7528;&amp;#x9014;&amp;#x65F6;&amp;#xFF0C;&amp;#x9700;&amp;#x5728;&amp;#x56FE;&amp;#x7247;&amp;#x7684;ALT&amp;#x5C5E;&amp;#x6027;&amp;#x4E2D;&amp;#x52A0;&amp;#x5165;&amp;#x8BF4;&amp;#x660E;&amp;#x6027;&amp;#x7684;&amp;#x66FF;&amp;#x4EE3;&amp;#x6587;&amp;#x672C;&amp;#xFF1B;\n3&amp;#x3001;&amp;#x5982;&amp;#x679C;&amp;#x76F8;&amp;#x90BB;&amp;#x7684;&amp;#x56FE;&amp;#x7247;&amp;#x548C;&amp;#x6587;&amp;#x672C;&amp;#x6307;&amp;#x5411;&amp;#x76F8;&amp;#x540C;&amp;#x7684;&amp;#x94FE;&amp;#x63A5;&amp;#xFF0C;&amp;#x5219;&amp;#x5C06;&amp;#x4E24;&amp;#x8005;&amp;#x5408;&amp;#x5E76;&amp;#x8D77;&amp;#x6765;&amp;#xFF0C;&amp;#x5C06;&amp;#x56FE;&amp;#x7247;&amp;#x548C;&amp;#x6587;&amp;#x672C;&amp;#x653E;&amp;#x5728;&amp;#x540C;&amp;#x4E00;&amp;#x4E2A;&lt;a&gt;&amp;#x6807;&amp;#x7B7E;&amp;#x4E2D;&amp;#xFF0C;&amp;#x5E76;&amp;#x4E14;&amp;#x5C06;&amp;#x56FE;&amp;#x7247;&amp;#x7684;&amp;#x66FF;&amp;#x4EE3;&amp;#x6587;&amp;#x672C;&amp;#x8BBE;&amp;#x4E3A;&amp;#x7A7A;&amp;#xFF0C;&amp;#x5426;&amp;#x5219;&amp;#x5C06;&amp;#x548C;&amp;#x6587;&amp;#x672C;&amp;#x91CD;&amp;#x590D;&amp;#xFF1B;\n4&amp;#x3001;&amp;#x9700;&amp;#x4E3A;&amp;#x5BA2;&amp;#x6237;&amp;#x7AEF;&amp;#x56FE;&amp;#x50CF;&amp;#x6620;&amp;#x5C04;&amp;#x56FE;&amp;#x70ED;&amp;#x70B9;&amp;#x63D0;&amp;#x4F9B;&amp;#x66FF;&amp;#x4EE3;&amp;#x6587;&amp;#x672C;&amp;#xFF1B;&amp;#x5BF9;&amp;#x670D;&amp;#x52A1;&amp;#x5668;&amp;#x7AEF;&amp;#x56FE;&amp;#x50CF;&amp;#x6620;&amp;#x5C04;&amp;#x56FE;&amp;#x70ED;&amp;#x70B9;&amp;#x63D0;&amp;#x4F9B;&amp;#x7B49;&amp;#x6548;&amp;#x7684;&amp;#x6587;&amp;#x672C;&amp;#x94FE;&amp;#x63A5;&amp;#xFF1B;\n
  6. \n
  7. http://www.london2012.com/news/video/index.php\n
  8. &amp;#x5185;&amp;#x5BB9;&amp;#x7684;&amp;#x5C55;&amp;#x73B0;&amp;#xFF0C;&amp;#x4E0D;&amp;#x5E94;&amp;#x8BE5;&amp;#x4E22;&amp;#x5931;&amp;#x4FE1;&amp;#x606F;&amp;#x6216;&amp;#x7ED3;&amp;#x6784;&amp;#x7684;&amp;#x5185;&amp;#x5BB9;&amp;#xFF0C;&amp;#x4ECE;&amp;#x76F2;&amp;#x4EBA;&amp;#x548C;&amp;#x7A0B;&amp;#x5E8F;&amp;#x5316;&amp;#x786E;&amp;#x5B9A;&amp;#x8BBA;&amp;#x8FF0;\n
  9. http://www.london2012.com/news/video/index.php\n
  10. &amp;#x5305;&amp;#x62EC;&amp;#x6253;&amp;#x5370;&amp;#x7248;&amp;#x672C;\n
  11. \n
  12. \n
  13. &amp;#x62CD;&amp;#x5356;&amp;#x72B6;&amp;#x51B5;&amp;#x53EF;&amp;#x4EE5;&amp;#x9664;&amp;#x5916;\n
  14. http://www.london2012.com/news/video/index.php\n
  15. http://www.london2012.com/news/video/index.php\n
  16. http://www.london2012.com/news/video/index.php\n
  17. \n
  18. http://www.london2012.com/news/video/index.php\n
  19. http://www.london2012.com/news/video/index.php\n
  20. \n
  21. http://www.london2012.com/news/video/index.php\n
  22. \n
  23. \n
  24. \n
  25. \n