• HOME
    HOME
  • SERVICES
    SERVICES
  • BLOG
    BLOG
  • ABOUT
    ABOUT
  • CONTACT
    CONTACT
  • HOME
    HOME
  • SERVICES
    SERVICES
  • BLOG
    BLOG
  • ABOUT
    ABOUT
  • CONTACT
    CONTACT
logo
logo
To Blog

Digital Accessibility Unpacked: Crafting Blogs and Newsletters

April 13, 2021
-
Accessibility, Blog
-
No comments
-
Posted by Juliana Bigelow
Headings and Hierarchy Blog Graphic

Image Description: A person sits on the floor with a computer in their lap. Behind them is a larger screen that displays them writing code to properly order headings. 

 

If you’re like many internet users, your email inbox is home to several newsletters from organizations, and you’ve fallen down a research rabbit holes reading blogs and other written content. These written mediums serve as tools for marketers, writers, businesses, and everyday users looking to learn and share content. However, they’re not always accessible to all users. One main reason for this is the misuse and lack of general education surrounding proper heading use.

 

When we speak about digital accessibility, it is critical to remember that it impacts everyone. Newsletters, blogs, and articles become more readable with the inclusion of headings and clear visual hierarchy. Proper heading use can help any reader gain insight into the main ideas of your content. It can help people who use screen readers navigate content. It can also help people find content quickly and process content more easily.

 

In this article, we’ll define headings and hierarchy, show you how to implement them in your work, and give you a short list of tips as you start to make your blogs, newsletters, and other digital content accessible. 

 

Headings and Hierarchy

Headings help communicate the organization of a page by breaking down the content into sections. They are short descriptions of the content that follows them. For instance, if you were writing a blog post about fruit your headings would likely be different types of fruit.

 

Hierarchy helps further organize pages and documents by describing a heading’s level of importance. Most content management systems (CMS) and word processors give headings a number to describe their importance, starting with the most important heading, Heading 1. By using headings appropriate to the hierarchy of your document, you will help your audience better navigate your content. An example of proper hierarchy using headings follows below using a list of fruits and vegetables:

 

Types of Fruits and Vegetables (Title or Heading 1)

  • Vegetables (Heading 2)
    • Pepper (Heading 3)
      • Orange Bell Pepper (Heading 4)
    • Carrot (Heading 3)
      • Purple Carrot (Heading 4)
  • Fruits (Heading 2)
    • Apples (Heading 3)
      • Honey Crisp Apples (Heading 4)
    • Berries (Heading 3)
      • Blackberries (Heading 4)

 

In this example, the title, or Heading 1, describes what the list is about. Heading 2 breaks the list into the most significant categories, fruits, and vegetables. Then, Heading 3 describes things that fall under Heading two, different types of fruits or vegetables. Finally, Heading 4 breaks down every heading 3 into even more specific categories of fruits and vegetables, like types of apples. This makes the list easy to navigate and can help readers determine what is most important and how the content is organized.

 

The way you set up headings in a document may be different depending on the CMS or word processors you are using. Google Docs, Microsoft Word, Pages, and WordPress all have guides on how you can do this within their systems and you’ll want to check the documentation for your specific CMS. Here are some considerations you should make no matter what CMS or word processor you’re using. 

 

  1. Do not select a heading based on its color, size, or font. You are able to change these within your CMS or word processor. Only select a heading for its proper hierarchical position. 
  2. Only use Heading 1 or the Title Heading for your main title. There should only be one Heading 1 per page. The first main section in your document, beyond your title, should start with a Heading 2.  
  3. Use the “normal” text option for body text and paragraphs, rather than subheadings. 
  4. Make sure to use heading levels sequentially. Headings should be used in order so that their numbers correspond to their hierarchy. If you used a Heading 2 for a section title and then needed to use another heading within that section, the next heading level to use would be Heading 3, then Heading 4, and so on.
  5. Keep heading levels consistent. It’s okay to use more than one Heading 2 in a document, provided it’s used consistently. In our fruits example, notice that we’ve used a Heading 2 to separate the “Fruits” and “Vegetables” sections. This makes it easier for assistive technology to understand the structure of your document and makes it easier to navigate between the separate sections of the text. 
  6. Avoid creating a textbox to caption or configure content. Most word processors create text boxes as a separate element from the document’s main text layer, meaning they can be challenging to navigate using assistive technology. Instead, opt for using the word processor’s built-in formatting functions and captions tools.

Using proper headings and hierarchy can make your content more accessible to everyone. It is also something that is simple to implement once you get the hang of it. If you’re interested in looking deeper into this concept, you can check out Web Design’s full guide to the importance of headings. Additionally, for more accessibility resources check out our introduction to accessibility blog. If you have questions about accessibility at Portland State University, you are able to contact and learn more about the Portland State Disability Resource Center on their website.

PREVIOUS POST
Check Out Our New Self-Love Playlist
NEXT POST
Transcription and Captioning Services

Juliana Bigelow

Recent Posts
  • How to Recruit Talent With Classroom Canvassing
  • Photo Composition Part 1: Rule of Thirds and Shot Size
  • Intro to Camera Exposure
  • Sub-Basement Studios Halloween Hearts Movie List
  • Adobe Premiere Rush Tutorial: Getting Started
Recent Comments
  • Equipment Recommendations For Mobile Videos – Student Media Tech on Youtube-Quality Videos on Mobile
Archives
  • December 2022
  • March 2022
  • January 2022
  • October 2021
  • September 2021
  • April 2021
  • March 2021
  • February 2021
  • October 2020
  • September 2020
  • August 2020
  • July 2020
  • June 2020
  • May 2020
  • April 2020
  • March 2019
Categories
  • Accessibility
  • Audio
  • Blog
  • Culture
  • Digital Tools
  • Photography
  • Podcasting
  • Social Media
  • Video
  • Workshops
  • Writing

Leave a Comment

Your feedback is valuable for us. Your email will not be published.
Cancel Reply

Please wait...
Submit Comment →

psustudentmedia

Join us on the PSU Park Blocks for Party in the Pa Join us on the PSU Park Blocks for Party in the Park! Student Media will be there on Thursday, September 29th from 11am to 2pm. 

Come grab some candy, connect with fellow student leaders, and learn more about what our student groups have to offer! 

Image Description
PSU Student Media logo on a blue background. The logo is surrounded by illustrations of students using various media related items such as a DSLR camera, a sound board, a laptop with writing materials off to one side, and a video camera. Text contained in the image is duplicated earlier in this post.
Party in the Park is back on September 29th!!! Ea Party in the Park is back on September 29th!!!

Each year, PSU's Student Activities Leadership Program and Campus Recreation team up to put on Party in the Park, an engagement fair featuring PSU's many on-campus organizations, along with engagement opportunities, free food and swag giveaways.

Student Media Tech will be there from 11-2:00, accompanied by several of PSU's Student Media groups. 

Drop by, say hello, learn about opportunities in Student Media, and grab some free food from Basha's Mediterranean Cuisine! We hope to see you all there. 

#PortlandStateUniversity #StudentMedia #PortlandStateStudentMedia #StudentsInMedia #SALP #StudentLeadership #RemoteViks @portlandstate
Student Media Technology is thrilled to announce t Student Media Technology is thrilled to announce that we have a new Technology Advisor - Rae Fickle!

Rae has been with Student Media Technology since 2020. Having worked on the team as a Student Web Developer and Project Manager, they are committed to creating professional development opportunities for other students. In addition to their new role as Tech Advisor, Rae is also an upper-division student in the Computer Science program. Before enrolling at Portland State, they received their Associate’s Degree in Website Development & Design from PCC, where they first became passionate about web usability and accessible design. Rae is excited to serve Student Media and hopes their knowledge of modern web technologies will benefit student leaders and employees moving forward.

#PortlandStateUniversity #StudentMedia #PortlandStateStudentMedia #StudentsInMedia #SALP #StudentLeadership #RemoteViks @portlandstate
Student Media is hiring a part-time Technology Adv Student Media is hiring a part-time Technology Advisor to lead our Tech Team. For details and to apply, please see the link in our bio's Linktree

#PortlandStateUniversity #StudentMedia #PortlandStateStudentMedia #StudentsInMedia #SALP #StudentLeadership #RemoteViks @portlandstate
Load More... Follow on Instagram
Recent Posts
  • Three human figures are in a classroom setting. One appears to be standing, and is gesturing towards a sitting figure raising its hand
    December 7, 2022
    How to Recruit Talent With Classroom Canvassing
  • photo composition part 1, rule of thirds and shot size
    March 14, 2022
    Photo Composition Part 1: Rule of Thirds and Shot Size
  • Triangle of Exposure
    January 18, 2022
    Intro to Camera Exposure
Looking for something?
Digital Accessibility Unpacked: Crafting Blogs and Newsletters | Student Media Tech
Skip to content
Open toolbar

Accessibility Tools

  • Increase Text
  • Decrease Text
  • High Contrast
  • Negative Contrast
  • Light Background
  • Links Underline
  • Readable Font
  • Reset