Hi Chris thanks for your response, I inserted the code into this post.
I think you're right, though. I believe that the DesignPlus features that I am using are somehow conflicting with the table.
<div id="dp-wrapper" class="dp-wrapper">
<header class="dp-header dp-square-right">
<h2 class="dp-heading"><span class="dp-header-pre"> <span class="dp-header-pre-1">Severe Issues |</span> <span class="dp-header-pre-2">Alternative Text</span> </span> <span class="dp-header-title">Adding Alt Text with Ally</span></h2>
</header>
<p>Start with the <strong data-start="894" data-end="918">Missing Descriptions</strong> tab, then move to <strong data-start="937" data-end="948">Complex</strong> or <strong data-start="952" data-end="966">Decorative</strong> as needed.</p>
<div class="dp-content-block">
<div class="dp-panels-wrapper dp-tabs-pills-vertical">
<div class="dp-panel-group">
<h3 class="dp-panel-heading">Missing Descriptions</h3>
<div class="dp-panel-content">
<div class="dp-panels-wrapper dp-tabs-pills">
<div class="dp-panel-group">
<h3 class="dp-panel-heading">Step 1</h3>
<div class="dp-panel-content ">
<div class="dp-card card h-100 cp-bg-light">
<div class="card-body">
<p>When Ally Report flags an image as "missing a description,":</p>
<ol class="">
<li>Click on the flagged image in the Ally Course Accessibility Report or from your Canvas File Index.<img class="dp-full-width dp-image-bordered-thick dp-border-dir-all dp-border-style-solid cp-out-dp-primary dp-shadow-b6 mx-auto d-block dp-popup-image" style="border-radius: 5px; height: auto;" src="https://canvas.nau.edu/courses/53561/files/14340494/download" alt="The Ally Course Report index page for Images that do not have a description." width="360" height="270" data-name="M4.c.png" data-size="38 KB" data-available-range="false" data-hidden="false" data-file-id="13386575" data-filename="M4.c.png" data-locked="false" data-api-endpoint="https://canvas.nau.edu/api/v1/courses/53561/files/14340494" data-api-returntype="File" /></li>
</ol>
</div>
</div>
</div>
</div>
<div class="dp-panel-group">
<h3 class="dp-panel-heading">Steps 2 and 3</h3>
<div class="dp-panel-content ">
<div class="dp-card card h-100 cp-bg-light">
<div class="card-body">
<ol class="">
<li data-value="2">Enter your description into the <strong>Add image description</strong> field. Aim for ≤ 125 characters; describe function, not appearance.</li>
</ol>
<p><img class="dp-full-width dp-image-bordered-thick dp-border-dir-all dp-border-style-solid dp-shadow-b6 cp-out-dp-accent mx-auto d-block dp-popup-image" style="height: auto;" src="https://canvas.nau.edu/courses/53561/files/14340495/download" alt="The Ally File Feedback with an added alt text highlighted as step 2, and the add button as step 3. " width="360" height="270" data-name="M4.cc.png" data-size="142 KB" data-available-range="false" data-hidden="false" data-file-id="13386585" data-filename="M4.cc.png" data-locked="false" data-api-endpoint="https://canvas.nau.edu/api/v1/courses/53561/files/14340495" data-api-returntype="File" /></p>
<ol>
<li data-value="3">Click the Add button.</li>
</ol>
<p>Depending on your Internet connection, Ally may take 30–60 sec to rescore—refresh if you don’t see a change in score. You should see, displayed, an improvement in the accessibility score.</p>
<p class="dp-heading-ignore"><img class="dp-image-bordered-thick dp-border-dir-all dp-border-style-solid dp-shadow-b6 cp-out-dp-accent dp-popup-image" style="border-radius: 5px;" src="https://canvas.nau.edu/courses/53561/files/14340496/download" alt="The Ally File Feedback window showing 100% after adding alt text." width="360" height="270" data-name="4.ccc.png" data-size="23 KB" data-available-range="false" data-hidden="false" data-file-id="13387391" data-filename="4.ccc.png" data-locked="false" data-api-endpoint="https://canvas.nau.edu/api/v1/courses/53561/files/14340496" data-api-returntype="File" /><span style="color: #000000; font-family: inherit; font-size: 1rem;"> </span></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="dp-panel-group">
<h3 class="dp-panel-heading">Complex Images</h3>
<div class="dp-panel-content ">
<p>Some images can’t be summarized in one sentence—think detailed diagrams or charts. </p>
<p>To convey to your screen reader users the necessary information,</p>
<ul id="" class="">
<li class="">Include a long description within the text editor. </li>
</ul>
<div class="dp-card card rounded-2 cp-bg-mid">
<div class="card-body">
<h4 class="card-title dp-ignore-theme">Sedimentary Rocks</h4>
<p class="card-text"><img class="" src="https://canvas.nau.edu/courses/53561/files/14340599/download" alt="Complex Images.png" width="0" height="0" data-name="Complex Images.png" data-size="3 MB" data-available-range="false" data-hidden="false" data-file-id="13401056" data-filename="Complex+Images.png" data-locked="false" data-api-endpoint="https://canvas.nau.edu/api/v1/courses/53561/files/14340599" data-api-returntype="File" /><img class="dp-image-bordered-thick dp-border-dir-all dp-border-style-solid cp-out-dp-primary dp-shadow-b6 dp-popup-image" style="border-radius: 5px;" src="https://canvas.nau.edu/courses/53561/files/14340599/download" alt="A complex diagram being used to demonstrate long descriptions in place of alt text." width="360" height="270" data-name="Complex Images.png" data-size="3 MB" data-available-range="false" data-hidden="false" data-file-id="13401056" data-filename="Complex+Images.png" data-locked="false" data-api-endpoint="https://canvas.nau.edu/api/v1/courses/53561/files/14340599" data-api-returntype="File" /></p>
<p class="card-text"> (<em>Long Description</em>) This diagram visually explains the process of sedimentary rock formation through five key stages: weathering, transport, deposition, compaction, and cementation. It begins on the left with weathering and erosion, where exposed rock breaks down into smaller particles. These sediments are then transported by a river, depicted by red dots moving downstream. As the river slows, the sediment settles in a basin, forming distinct horizontal layers through deposition and sedimentation.</p>
</div>
</div>
<p><strong>Note</strong>: <strong>Alt text for a complex image is still necessary.</strong></p>
<ul id="" class="">
<li class="">Include an alt text that refers to the long description within the text.<br />
<ul id="" class="">
<li class="">For example: Diagram showing the process of sedimentary rock formation. Full description provided in surrounding text. </li>
</ul>
</li>
</ul>
<div class="dp-content-block">
<h4 class="">For Graphs and Charts</h4>
<p>When using a graph or a chart that presents tabular data:</p>
<ul id="" class="">
<li class="">include an accessible version of a table in the text editor. </li>
</ul>
<div class="dp-card card cp-bg-mid">
<div class="card-body">
<h5 class="card-title dp-ignore-theme">Sediments over Time</h5>
<div class="dp-column-container container-fluid">
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-12">
<p><img src="https://files.ciditools.com/cidilabs/dp_icon_placeholder.jpg" alt="image placeholder" width="0" height="0" /><img class="dp-image-bordered-thick dp-border-dir-all dp-border-style-solid cp-out-dp-primary dp-shadow-b6 mx-auto d-block dp-full-width dp-popup-image" style="border-radius: 5px; height: auto;" src="https://canvas.nau.edu/courses/53561/files/14340629/download" alt="A graph being used to demonstrate adding an accessible table for screen reading users." width="360" height="270" data-name="Graph Alt Text example.jpg" data-size="103 KB" data-available-range="false" data-hidden="false" data-file-id="13405079" data-filename="Graph+Alt+Text+example.jpg" data-locked="false" data-api-endpoint="https://canvas.nau.edu/api/v1/courses/53561/files/14340629" data-api-returntype="File" /></p>
</div>
<div class="col-lg-6 col-md-6 col-sm-12">
<table class="table-bordered default-base-style" style="border-collapse: collapse; width: 100%; height: 85px;" data-active-table="true">
<thead>
<tr style="height: 27px;">
<th style="width: 50%; height: 27px;" scope="col">Year</th>
<th style="width: 50%; height: 27px;" scope="col">Sediment Depth (mm)</th>
</tr>
</thead>
<tbody>
<tr style="height: 29px;">
<td style="width: 50%; height: 29px;">2000</td>
<td style="width: 50%; height: 29px;">12</td>
</tr>
<tr style="height: 29px;">
<td style="width: 50%; height: 29px;">2002</td>
<td style="width: 50%; height: 29px;">18</td>
</tr>
<tr>
<td style="width: 50%;">2004</td>
<td style="width: 50%;">25</td>
</tr>
<tr>
<td style="width: 50%;">2006</td>
<td style="width: 50%;">36</td>
</tr>
<tr>
<td style="width: 50%;">2008</td>
<td style="width: 50%;">46</td>
</tr>
<tr>
<td style="width: 50%;">2010</td>
<td style="width: 50%;">55</td>
</tr>
<tr>
<td style="width: 50%;">2012</td>
<td style="width: 50%;">63</td>
</tr>
<tr>
<td style="width: 50%;">2014</td>
<td style="width: 50%;">72</td>
</tr>
<tr>
<td style="width: 50%;">2016</td>
<td style="width: 50%;">81</td>
</tr>
<tr>
<td style="width: 50%;">2018</td>
<td style="width: 50%;">90</td>
</tr>
</tbody>
</table>
<p> </p>
</div>
</div>
</div>
</div>
</div>
<ul id="" class="">
<li class=""> Include in a graph or charts' alt text a reference the table.
<ul id="" class="">
<li class="">Example: Line graph showing sediment depth increasing steadily from 2000 to 2018. Full data is available in the accompanying table.</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
<div class="dp-panel-group">
<h3 class="dp-panel-heading ">Decorative Images</h3>
<div class="dp-panel-content">
<p>If an image adds no instructional or contextual value:</p>
<ul id="" class="">
<li class=""><strong>mark it as decorative</strong> in the Ally Feedback window.</li>
</ul>
<p><img class="dp-image-bordered-thick dp-border-dir-all dp-border-style-solid dp-shadow-b6 cp-out-dp-accent mx-auto d-block dp-popup-image" style="border-radius: 5px;" src="https://canvas.nau.edu/courses/53561/files/14340661/download" alt="The Ally Feedback window with a ribbon and the button to "Indicate image is decorative" highlighted." width="700" height="379.516" data-name="M4.39.jpg" data-size="98 KB" data-available-range="false" data-hidden="false" data-file-id="12797594" data-filename="M4.39.jpg" data-locked="false" data-api-endpoint="https://canvas.nau.edu/api/v1/courses/53561/files/14340661" data-api-returntype="File" /></p>
<p>For example, there are icons of all types in the NAU template that you may have in your courses. <em>Icons that function as buttons still need alt text (e.g., ‘Search’).</em></p>
<p>Mark images decorative <strong data-start="2090" data-end="2098">only</strong> if they add no meaning.</p>
<p>If you were using this ribbon icon on a page solely for aesthetic purposes, then it would be appropriate to <strong>"indicate the image is decorative</strong>". </p>
</div>
</div>
</div>
</div>
</div>
