Table Component and Accessibility | Community
Skip to main content
lgazzillo
New Participant
Nov 20, 2019 9:08 PM UTC
Solved

Table Component and Accessibility

I am documenting how to make tables using AEM in my organization accessible. I see that the table component does offer scope attribution but from using the tool it only applies to the columns -- I have't been able to get the tool to also apply it to rows.

Any suggestions? Maybe, the component doesn't offer it OOTB.

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
    Shashi_Mulugu
    Shashi_MuluguAccepted solution
    New Participant
    Nov 21, 2019 1:03 PM UTC

    Table component is deprecated. Please use Text component with RTE and use Table feature in it.

    View reply

    5 replies

    KurtHo1
    Level 2
    Nov 21, 2019 2:53 PM UTC

    The table in the Text component RTE has the option to set the headings to column, row, or both. This will add scope like you asked. If you do not see the option for a table in your text component, expand the editor to full screen (top right) to see all available options.

    <table cellpadding="1" cellspacing="0" border="1">

    <caption>AEM Accessibility Table Test</caption>

    <tbody>

      <tr>

        <th scope="col">COL Heading 1</th>

        <th scope="col">COL Heading 2</th>

        <th scope="col">COL Heading 3</th>

      </tr>

      <tr>

        <th scope="row">Row Heading 1</th>

        <td>value1</td>

        <td>value2</td>

      </tr>

    </tbody>

    </table>

    Translate
    Shashi_Mulugu
    Shashi_MuluguAccepted solution
    New Participant
    Nov 21, 2019 1:03 PM UTC

    Table component is deprecated. Please use Text component with RTE and use Table feature in it.

    Translate
      Hamid1350
      Employee
      Nov 21, 2019 2:21 AM UTC

      That's correct ... I dont believe OOTB features provide that. 

      Translate
      lgazzilloAuthor
      New Participant
      Nov 20, 2019 9:50 PM UTC

      Sure! Nothing fancy, just tables with data in them on a web page. But I would like to make them accessible and the OOTB component doesn't seem to allow me to apply scope to both rows and columns. I am using aem 6.4

      Translate
      Hamid1350
      Employee
      Nov 20, 2019 9:31 PM UTC

      Can you clarify the use case ?

      Where these tables are ? i.e. part of a page ?

      Translate
      Terms & ConditionsAccessibility statement

      Loading footer...