This page addresses how to handle various issues pertaining to the reading order in a document.

Part A:

The Issue: (QS-7)

Now that the table has been linearized, continuing to scroll down the Tag Tree will reveal that the text around the “Dates and Ticket Prices” heading is not in the correct reading order.  (There are two <P> tags being used for the one paragraph of text below “Dates and Ticket Prices” and these paragraphs are above the <H2> for “Dates and Ticket Prices” in the tag tree, meaning that they will be read before the heading for that section.)  Screen shot showing the two Paragraph tags in the incorrect reading order.

The Solution (Advanced Version):

  1. Select the two <P> tags containing the text that should be read after the “Dates and Ticket Prices” heading (hold Shift while clicking to multi select),
  2. Press Ctrl+M to merge the two tags into one <P>.  Tip:  Do not close the <P> tag that was just merged.  Leaving it open, in this instance, may help the remediator to not lose their “place” when moving content in the Tag Tree!
  3. Click on the <H2> that contains the “Dates and Ticket Prices” heading,
  4. Click and hold the left mouse button on the <H2> and drag it in the Tag Tree above the <P> tag that was merged in Step 2.  Then release the mouse button.  Caution:  Some care will have to be used here to move the <H2> between the two <P> tags in the tree and not to put the <H2> inside one of the <P> tags.  If the Heading tag is moved to the wrong place in the Tag Tree, use undo (Ctrl+Z), and try again.
  5. After the “Dates and Ticket Prices” heading tag is moved to the correct reading order, close the <P> tag that was left open from merging tags in Step 2.  Screen shot showing the two paragraph tags have been merged and the Heading 2 has been moved above the Paragraph tag in the tag tree.

The Solution (Standard Version):

These steps are very similar to how the first two <P> tags in the document were combined, in a previous section, before creating an H1.

  1. Click the arrow to the left of the first <P> tag (contains the text immediately below the heading for “Dates and Ticket Prices” in the physical view),
  2. Click the arrow to the left of the next <P> tag down in the tree,
  3. Click on the text element in the second <P> (to select it),
  4. Click and hold on the same text element,
  5. Drag the selected text element into the other <P> tag and place it below the text element that is currently there.
  6. Click on both text elements in order to verify that they are placed in the correct reading order.  If not, Undo (Ctrl+Z) and try again.
  7. Click on the <H2> that contains the “Dates and Ticket Prices” heading,
  8. Click and hold the left mouse button on the <H2> and drag it in the Tag Tree above the <P> tag containing the two text elements that were combined in Steps 1-6 then release the mouse button.  Caution:  Some care will have to be used here to move the <H2> between the two <P> tags in the tree and not to put the <H2> inside one of the <P> tags.  If the Heading tag is moved to the wrong place in the Tag Tree, use undo (Ctrl+Z), and try again.
  9. After the “Dates and Ticket Prices” heading tag is moved to the correct reading order, close the <P> tag that was left open.
Note:  If you are going in order through the document, after fixing the reading order issues in this section, then you’ll need to follow the steps to create a data table.  Follow this link to return to the page dealing with Tables (QS-8). 
 

Part B: (QS-10)

After creating a data table and removing empty tags, then there will be two more reading order issues to fix.

First:

Immediately after the table that was made in the previous section of this guide, there are two <H2> tags in the Tag Tree.  Clicking on the first one (directly below the <Table>) reveals the heading for “Location.”  The next tag in the tree is for the heading “Participating Vendors.”  However, the paragraph under “Location” should be read before the information about vendors is presented.  (We make these reading order decisions based on the physical appearance of the document.)  Screen shot showing two correctly marked H2 tags but without the correct text between the heading tags.

Second:

When a screen reader reads the <P> tags under the heading for “Participating Vendors,” the text will be read across the page as opposed to being read in two columns in this section.  Both reading order problems are fixed with the solution below in conjunction with the following section on tagging a list (QS-11).

Screen shot showing a paragraph tag selected and the text in the physical view highlighted is spanning two columns and incorrectly containing part of a list.

The Solution:

  1. Click on the <P> tag under the H2 for “Participating Vendors,”
  2. In the Physical View of the document, highlight the paragraph underneath the “Location” heading (again by holding the mouse button, dragging and selecting from top left to bottom right).
  3. In the Insert Tag tab in the Ribbon, click “Paragraph” (or hit Ctrl+7 on the keyboard).  Screen shot showing the paragraph text highlighted and the Insert Tag tab opened to select Paragraph.
  4. Close the <P> that is created (by using the left arrow on the keyboard or the arrow to the left of the newly created <P> tag).
  5. With the new <P> still selected after closing it, left click and hold on the tag and drag it between the two <H2> tags that are immediately below the <Table> tag and release the mouse button.  (We are simply using the <Table> tag as a point of reference in this example.)  Tip:  It may be helpful to use the scroll bar on the right side of the Tags Panel to locate the two <H2> tags in this step.

Generally speaking:  When tags need to be moved to a different location in the reading order, simply click on the tag once to select it and then click and hold the mouse button to be able to drag it to its correct location in the reading order.

Part C: (QS-12)

The Issue:  In the Tag Tree, immediately under the list that was just created (in QS-11), is a <P> tag (correctly placed) and then three <Figure> tags.  Clicking on the first figure reveals that these <Figure> tags are not in the correct reading order.  (The first <Figure> should actually be the last one read).  Screen shot showing the incorrect order of figure tags in the tag tree.

The Solution: 

  1. Click on the first <Figure> tag (near the bottom of the Tag Tree),
  2. Click (again) and hold, and drag it below the last <Figure> in the tag tree and release the mouse button.
  3. Clicking on the <Figure> tags in order now should show that the images will be read from left to right across the page.
  4. Clicking on the last <P> tag in the document and verifying that it contains the last portion of text in the document verifies that the reading order for the document is now correct!

 

Next Pages

Follow the links below to view the pages in this Getting Started Guide.

Index of steps by Quick Start Number (QS-Number)

Page 1 – Getting Started

Page 2 – Heading Levels

Page 3 – Figures, Images, and Artifacts

Page 4 – Tables

Page 5 – Fixing Reading Order

Page 6 – Removing Empty Tags

Page 7 – Lists

Page 8 – Compliance Verification

Page 9 – Closing Comments

Back to the Top