In the first section titled "General Steps for Building an Accessible Widget with WAI-ARIA"
there is sample toolbar markup which sets the tabindex of the toolbar to 0, and the tabindex of the 
first button to 0 as well.  Assuming this is an example of using the roving tabindex technique, the 
toolbar shouldn't have a tabindex set, right?  It should just be the first descendant.  
Additionally, the copy below the HTML example says "By avoiding tabindex on the 
toolbar and setting tabindex=0 on the first button...".  So based on that it seems like the 
tabindex on the toolbar should be removed.

<div role="toolbar" tabindex="0" id="customToolbar" 
      onkeydown="return optionKeyEvent(event);"
      onkeypress="return optionKeyEvent(event);"
      onblur="hideFocus()"
      onfocus="showFocus()"
      > 
      <img src="img/btn1.gif" tabindex="0" title="Home" 
           role="button" id="b1" alt="Home" 
           onClick="updateText('Home was invoked');">
      <img src="img/btn2.gif" tabindex="-1" title="Refresh" 
           role="button" id="b2" alt="Refresh" 
           onClick="updateText('Refresh was invoked');">
     <img src="img/btn3.gif" tabindex="-1" title="Help" 
           role="button" id="b3" alt="Help" 
           onClick="updateText('Help was invoked');"> 
</div>


Additionally, it'd be nice if the example didn't make use of inline JavaScript 
event listeners as that is not a best practice.  Can't we just update the example so that it 
binds the listeners completely via JavaScript?  For example:

<div role="toolbar" tabindex="0" aria-activedescendant="button1" id="tb1">
  <img src="buttoncut.png" alt="cut" role="button" id="button1">
  <img src="buttoncopy.png" alt="copy" role="button" id="button2">
  <img src="buttonpaste.png" alt="paste" role="button" id="button3">
</div>

 <script>
    ... 

    (function () {

        function optionKeyEvent(event)

          var event = window.event || event;

          {
          var tb = event.target;
          var buttonid; 
      
          DOM_VK_ENTER = 13;
          // Partial sample code for processing arrow keys
    
          if (event.type == "keydown") {
             if (event.altKey) {
               return true;  // Browser should use this, the menu view doesn't need alt-modified keys
             }
             // XXX Implement circular keyboard navigation within the toolbar buttons
      
             if (event.keyCode == DOM_VK_ENTER) {
               ExecuteButtonAction(getCurrentButtonID()); // This is an author defined function
             }
             else if (event.keyCode == event.DOM_VK_RIGHT) {
               // Change the active toolbar button to the one to the right (circular) by 
               var buttonid = getNextButtonID();   // This is an author defined function
               tb.setAttribute("aria-activedescendant", buttonid); 
             }
             else if (event.keyCode == event.DOM_VK_LEFT) {
                // Change the active toolbar button to the one to the left (circular) by 
                var buttonid = getPrevButtonID();  // This is an author defined function
                tb.setAttribute("aria-activedescendant", buttonid); 
             } 
             else {
                return true;
             }
             return false;
          }
          else if (event.type == "keypress") {
            ...
          }
        }
        
        var toolbar = document.getElementById("tb1");
        
        toolbar.onkeydown = optionKeyEvent;
        toolbar.onkeypress = optionKeyEvent;

    }());
    
</script>


Section 3.2.1 mentions that the tabindex property was originally implemented in IE, but has now 
been implemented in Opera, Firefox, and Mozilla.  You've left out Webkit/Safari - which has had 
support for tabindex on all elements since Safari 4.


Also in section 3.2.1 it states that "currently there is no standard DOM interface to get the 
current element with keyboard focus".  From my experience that is no longer the case.  All of the 
modern browsers now support IE's "activeElement" interface on the Document object - a property that 
is now in HTML5.


Section 3.2.7.3.1 has an example of labeling a landmark with its corresponding header element.  It'd 
be nice if this example illustrated this using an HTML header element rather than the header role to 
re-inforce the best practice of using existing semantics of the host language when they are 
provided.  So, this:

<div role="main" aria-labelledby="hdr1">
 <h1 id="hdr1" aria-level="1">Top News Stories</h1>
</div>

Rather than this:

<p role="main" aria-labelledby="hdr1">
 <div role="header" id="hdr1" aria-level="1">Top News Stories</div>
</p>