From 1633b70b0e9a92bb04e09c1c1c6347367c1ffcfa Mon Sep 17 00:00:00 2001 From: Michael Horton Date: Sat, 2 Nov 2024 13:58:58 -0400 Subject: [PATCH 1/4] Stage Byte No. 7 Lists --- _posts/2024-11-01-byte-007-lists.md | 157 ++++++++++++++++++++++++++++ assets/css/index.scss | 15 ++- 2 files changed, 171 insertions(+), 1 deletion(-) create mode 100644 _posts/2024-11-01-byte-007-lists.md diff --git a/_posts/2024-11-01-byte-007-lists.md b/_posts/2024-11-01-byte-007-lists.md new file mode 100644 index 000000000..6d49ac240 --- /dev/null +++ b/_posts/2024-11-01-byte-007-lists.md @@ -0,0 +1,157 @@ +--- +layout: post +permalink: blog/accessibility-bytes/lists/ +type: article +title: 'Accessibility Bytes No. 7: Information Grouped in a List' +tags: Accessibility-Bytes Content-Creation Testing #choose one or more (comma separated): Accessibility-Bytes, Acquisition, Content-Creation, Design-and-Develop, Events, Policy-and-Management, Testing +social_img: 'https://assets.section508.gov/files/images/social-media-og-image-bytes.jpg' +created: 2024-10-16 +description: "Do you know some people rely on structured content to understand and navigate information grouped in lists?

Lists in HTML and documents serve as structured ways to present grouped information, making it easier for readers to understand relationships between items. Lists help break down information into manageable parts, improving readability and navigation." +contributors: +redirect_from: +- blog/accessibility-bytes/7/ #Allows users to navigate by number +--- +

Do you know some people rely on content structure to navigate the information within a document?

+ +Lists in HTML and documents serve as structured ways to present grouped information, making it easier for readers to understand relationships between items. Lists help break down information into manageable parts, improving readability and navigation. HTML and documents share two main types of lists: + +* **Ordered lists** (Numbered List): These present items in a numbered or alphabetically ordered sequence, useful when steps or priority matters. +* **Unordered lists** (Bulleted List): These display items in a bulleted format, ideal for grouping related but unordered content. + +For accessibility, lists are essential because they provide semantic structure that screen readers can recognize and announce to users. Screen readers can identify and convey the number of items in a list, helping users who are visually impaired understand content layout and relationships without visual cues. This structure also enables users with motor impairments to navigate the document more easily, especially when using keyboard shortcuts to move between list items. + +## Document Lists +Creating lists in electronic documents authoring tools such those in Microsoft Office 365 including Word, PowerPoint, OneNote, and Outlook, is straightforward and can be done using either bulleted, numbered, or multi-level lists. Here’s how to create each type: + +
+
+
+
Figure 1. Microsoft Word Home Ribbon with unordered and ordered list controls highlighted. +
+
+ +### Bulleted List +* Select the text you want to turn into a bulleted list or place the cursor where you want to start the list. +* Go to the **Home** tab on the Ribbon. +* In the **Paragraph** group, click the **Bullets** button (●). +* Word will automatically create a bulleted list, and you can press **Enter** to add new items. Each new line will start with a bullet until you press **Enter** twice to end the list. + +### Numbered List +* Select the text you want to turn into a numbered list or place the cursor where you want to start it. +* Go to the **Home** tab on the Ribbon. +* In the **Paragraph** group, click the **Numbering** button (1., 2., 3., etc.). +* Word will begin numbering the list automatically. Press **Enter** to add additional items to the list, or press **Enter** twice to end the list. + +### Multi-Level List +* Place your cursor where you want to start the list or select text. +* Go to the **Home** tab and select the **Multi-level List** button in the **Paragraph** group. +* Choose a list style from the dropdown menu. This allows you to create lists with multiple levels (e.g., outlines). +* To increase or decrease indentation for list items, press **Tab** or **Shift + Tab**. + +### Formatting List +* To customize bullets or numbering, right-click on a bullet or number and select **Define New Bullet** or **Set Numbering Value**. +* You can change bullet symbols, number formats, and even use custom symbols or images as bullets. + +## HTML List +Creating lists in HTML is straightforward using specific tags for each type of list. Here’s how to create **unordered lists** and **ordered lists** lists in HTML. + +### Unordered List (Bulleted List) +To create a bulleted list, use the **