title: Setting focus points in HTML for screen readers
body: <p>I was wondering if its possible to set specific areas for a screen reader to focus on in HTML content.</p>
  <p>I have a list that is something like the following:</p>
  <pre><code>&lt;ol&gt;
    &lt;li&gt;
      &lt;div class=&quot;duration&quot;&gt;
        &lt;time&gt;10:00&lt;/time&gt;
        &lt;span&gt;to&lt;/span&gt;
        &lt;time&gt;11:00&lt;/time&gt;
      &lt;/div&gt;
      &lt;div class=&quot;info&quot;&gt;
        &lt;span&gt;CA267 Lecture&lt;/span&gt;
        &lt;span&gt;Software Testing&lt;/span&gt;
        &lt;span&gt;Location: QG27&lt;/span&gt;
      &lt;/div&gt;
    &lt;/li&gt;
  &lt;/ol&gt;
  </code></pre>
  <p>When I bring a screen reader(in my case voice over) over the list item it starts off with 10:00 then I have to press ctrl+alt+left arrow key to move onto &quot;to&quot; and then again to move onto 11:00 and so on so forth.</p>
  <p>I was wondering is there a way to group the elements so that the screen reader focuses on the <code>&lt;li&gt;</code> tag and just reads out everything in it accordingly?</p>
  <p>I have tried setting a tabindex it somewhat works but requires the screen reader user to use the tab key for navigation rather than its built in shortcut keys.</p>