This Microsoft video, Improve Header Accessibility, will demonstrate the steps to use styles for headings to make your syllabus easier to navigate. Download a pre-formatted Course Syllabus Template or Distance Syllabus Template to get started.

Add a heading style in Word:

1. Type the document as plain text.
2. Select a line that is a heading.
3. Select the Home tab in the ribbon.
4. Select the appropriate heading level in the Styles group, such as the Heading 1.

Confirm the syllabus navigational structure

1. Select the View tab in the ribbon.
2. Select Navigation Pane in the Show group

Canvas Syllabus

Heading Styles principles can be applied when creating your online syllabus in Canvas with main headings sectioned as tab for easy navigation. This design allows anyone to navigate through the information in the syllabus quickly.

How to add HTML Code in Canvas

1. Select and copy the basic text code on this page or

   load the advanced HTML code

2. Select View All Pages at the top of the current page.
3. Select +Page in the Pages list.
4. Enter a Title for the Page, such as Course Syllabus.
5. Select HTML Editor.
6. Paste the code into the content area.
7. Select Save or Save and Publish.
8. Edit the page with your own content.

Basic Tabbed Syllabus Code

<!--Copy below This Line-->

<div class="enhanceable_content tabs">
<ul>
<li><a href="#fragment-1"><span>Instructor Information</span></a></li>
<li><a href="#fragment-2"><span>Course Information</span></a></li>
<li><a href="#fragment-3"><span>Course Elements</span></a></li>
<li><a href="#fragment-4"><span>Technical Requirements</span></a></li>
<li><a href="#fragment-5"><span> KSU Services and Policies</span></a></li>
<li><a href="#fragment-6"><span>Weapons Policies</span></a></li>
</ul>
<div id="fragment-1">
<p>Add your text anywhere between this paragraph</p>
<p style="border-top: 1px solid black;">&nbsp;</p>
<p style="text-align: right;">Select the&nbsp;<strong>Course Information</strong> tab above for more information.</p>
</div>
<div id="fragment-2">
<p>Add your text anywhere between this paragraph</p>
<p style="border-top: 1px solid black;">&nbsp;</p>
<p style="text-align: right;">Select the&nbsp;<strong>Course Elements</strong> tab above for more information.</p>
</div>
<div id="fragment-3">
<table class="ic-Table">
<thead>
<tr>
<th>Week</th>
<th>Date</th>
<th>Topics Covered</th>
<th>Notes</th>
</tr>
</thead>
<tbody>
<tr>
<td>Weeks</td>
<td>Dates</td>
<td>Topic Description</td>
<td>Comment</td>
</tr>
</tbody>
</table>
<p style="border-top: 1px solid black;">&nbsp;</p>
<p style="text-align: right;">Select the&nbsp;<strong>Technical Requirements</strong> tab above for more information.</p>
</div>
<div id="fragment-4">
<p>Add your text anywhere between this paragraph</p>
<p style="border-top: 1px solid black;">&nbsp;</p>
<p style="text-align: right;">Select the&nbsp;<strong>KSU Polices and Services</strong> tab above for more information.</p>
</div>
<div id="fragment-5">
<p>Add your text anywhere between this paragraph</p>
<p style="border-top: 1px solid black;">&nbsp;</p>
<p style="text-align: right;">Select the&nbsp;<strong>Weapons Polices</strong> tab above for more information.</p>
</div>
<div id="fragment-6">
<p>Add your text anywhere between this paragraph</p></div>
<div>
</div>
</div>

<!--Copy above This Line-->

Note: The beginning code creates tabs for each heading of your syllabus. The tabs are identified as enumerated Fragments - #, such as fragment-1, 2, 3, and so on. The text that follows labels the heading, i.e., Instructor Information, Course Information, Course Elements, etc. The sections content follows with a “div” or divider ID: <div id="fragment-1">.