WordPress with JAWS for Windows
Class Three
By
CathyAnne Murtha
www.blind.training
cathy@blindtraining.com

© Copyright 2025 CathyAnne Murtha. All Rights Reserved.
No part of this publication may be reproduced, distributed, or transmitted in any form or by any means, including photocopying, recording, or other electronic or mechanical methods, without the prior written permission of the publisher.

For permission requests, write to the publisher, addressed “Attention: Permissions Coordinator,” at the address below.

Access Technology Institute, LLC
PO Box 90812
Tucson, AZ 85752
cathy@blind.training
www.blind.training

Introduction
There are a myriad of block types. When a block is inserted, JAWS does an excellent job explaining their use and access.
 
If you’re comfortable with standard Windows controls, consider turning off Tutor Messages to reduce JAWS verbosity. If you want a reminder, just read the focused control.
 
We’ll explore some popular block types and Group blocks. Don’t forget the Block Settings sidebar. It has options that enhance or disable features.
 
Group blocks are containers that hold related blocks. They can be organized in several ways and offer different layout options.
 
Group blocks also affect document navigation. List View shows how blocks are organized. Use it to label blocks, move between them, and review layout.
 
Finally, we’ll manage blocks using keyboard accelerators and the Block toolbar.
 
This lesson is packed with new skills. Combine them with what you’ve already learned to get the most out of blocks and Groups.
 
Navigate and explore the display. WordPress has hidden gems waiting to be discovered.


Contents
Introduction	1
Block Types	4
Heading Block	5
Heading HTML Anchor	8
Quotations	10
Separator	10
Group Block	11
Group	13
Row	13
Stack	14
Grid	16
List View	17
Block Labels	18
Close List View	18
Manage Blocks	19
Delete a Block	19
Move a Block	20
Select Blocks	20
Cut, Copy, and Paste Blocks	20
Conclusion	21



Block Types
You learned to select a block type with the slash menu and slash command. The slash menu has recently used block types. The slash command is handy, but it’s impossible to remember every block type. There are dozens. Let’s review.
 
Select a block in the slash menu:
* Type a forward slash (/)
* Activate a block type
 
Use a slash command:
* Type forward slash (/) followed by the block type
* /Paragraph
* /File
* /Separator
 
And more.
 
Review all block types, find your favorites, and insert them from the “Block Inserter” menu of the top toolbar.
 
To open the Add Block menu:
* Focus on the top toolbar
* Open the “Block Inserter” menu
 
The Block Inserter panel opens.
 
The Block Inserter has three tabs:
* Block
* Patterns
* Media
 
Press RIGHT and LEFT ARROW to select a tab. Activate a tab to load related blocks at the bottom of the panel
 
Panel controls include:
* Search: Search for a block type
o Insert a text string
o Search results propagate as you type
o Review search results at the bottom of the panel
o Clear the edit box to restore the block list
* Block list: A block type list is at the bottom of the panel
o Blocks are in rows and columns
o Use all four arrow keys to navigate blocks
 
Activate a block to insert it after the last page or post block
 
Reverse navigate to and activate the “Close” button to close the Block Inserter panel.  Focus is on the Block Inserter button.
 
To edit the block:
 
* Return to the document: CTRL-SHIFT-TILDE
* Navigate to the new block
* JAWS announces how to access the block
 
There are dozens of blocks
 
Let’s review some of the most popular.
Heading Block
All page and post headings start with a basic “Heading” block configured in the Block toolbar or Block Settings sidebar.
 
To add a heading:
 
* Add a Heading block using:
* The slash command
* The slash menu
* The “Block Inserter” panel
 
Configure the heading level in the Block toolbar:
 
* Focus on the Block toolbar: ALT-F10
* The “Heading” menu is selected
* Use this drop-down list to change the block style
* Navigate right to the “Change Level” menu
* Open the drop-down list and select a heading level
* Activate heading level 1 to 6
 
Configure the heading level and text or background colors in the Block Settings sidebar:
 
* Open the Settings sidebar: CTRL-SHIFT-COMMA
* If the Settings sidebar is open, use CTRL-TILDE to navigate to the sidebar
* Select and activate the “Block” property sheet
 
Configure the following:
 
* Color options: Two checked options show the text and background color options
o Uncheck an option to hide the related control
o Tap ESCAPE to close the menu without making changes
o Focus returns to the sidebar
* Text or Background: Activate “Text” or “Background” to open a color popup
o The popup overlays the document beside the sidebar
o Navigate once to the bottom of the panel and select a color
o Colors are arranged in rows or columns
* Activate a color to apply it
o A “Clear” button restores the default theme text or background color
o Tap ESCAPE twice to return to the Settings sidebar
* The first tap enables the virtual cursor
* The second ESCAPE returns focus to the sidebar “Text” or “Background” button
* This is the same for all sidebar popups
o Reset: Reset the background and text color to the theme defaults
 
The next options configure heading block typography settings:
 
* Typography: Open a drop-down list of typography options. Checked items are shown in the sidebar
o Uncheck an option to hide the related control
o Tap ESCAPE to close the menu without making changes
o Focus returns to the sidebar
* Set Custom Size: Toggle this button to enable text size settings. Three controls are enabled
o Size spin box: Input a font size or select a size with UP and DOWN ARROW
o Unit: Select the text unit of measure
* PX: A fixed pixel size. 16 is 16 pixels. This is the standard Windows text unit
* EM: The text size scales based on the parent element font size
* 2 EM doubles the font size
* You can use decimals such as 1.25 EM
* We’ll discuss parent elements later
* REM: The text size scales based on the default browser or theme font
* 2 REM doubles the font size
* You can use decimals such as 1.25 REM
o Percent: The font is scaled based on the parent element font size
* 200% doubles the font size
* You can use any positive percentage
o Negative values are not valid font sizes
o Custom Size: Use this slider bar to adjust the font size. The custom size uses the PX unit
 
A “parent element” is the element that contains another. For example, you can create block containers that hold other blocks.
 
The parent block’s text can differ from the rest of the page. Parent blocks function like folders that contain subfolders. The subfolders are children of the parent.
 
A block’s parent is often the page itself. Blocks can also be grouped and share font and formatting settings. A grouped block’s font size is based on the block group. If a block group’s font changes, the changes are applied to all child blocks unless you customize it.
 
We’ll cover block groups in detail shortly.
 
An “Advanced” button enables an “HTML Anchor” edit box. You can link to this heading text from elsewhere in the document.
 
Let’s talk about that next.
Heading HTML Anchor
Hyperlinks are called anchors. I imagine it as a tether to another web location that is “anchored” to my page.
 
Earlier, you learned how to create links or “anchors” to outside web resources or your website content.
 
A “same-page link” is a hyperlink to content on the same page. You can link to headings, paragraphs, pictures, and more. If a block has an “HTML Anchor” edit box in the Block Settings sidebar, you can link to it elsewhere in a page or on your site.
 
The Heading block Settings sidebar “HTML Anchor” edit box names the element. Add a name in the edit box. Concatenate anchor words or separate them with dashes or underscores. Anchors are case specific. ContactUs is different from contactus. I use all lowercase letters to avoid confusion.
 
HTML Anchor name examples:
 
* wordpress-info
* wordpress-syllabus
* wordpress-pricing
 
Add the heading name to the page path preceded by a hash tag (#) to link to a same-page heading. These anchors work from the same page or may be “cross-linked” from another page.
 
Patterns can help you remember anchor names:
 
* wordpress-info
* word-info
* powerpoint-info
 
If all class information anchors follow the same pattern, they are easier to recall.
 
Use same-page links to add a menu of links at the top of a page or link to class prices from another webpage.
 
For example: A page advertising a training course has links to class information, syllabi, and pricing. Links at the top of the page whisk visitors to the section they want to read.
 
To add an HTML Anchor:
* Focus on a block
* Focus on the HTML Anchor edit box in the Settings sidebar
* Input an anchor name
o Concatenate or use dashes or underscores to separate words
o I recommend lower case unless you are concatenating
o For example:
* WordPressSyllabus
* zoom-wordpress-link
* contact_us
 
Same-page anchors are not found through a Link dialog edit box search. You can enter them manually or append them to a searchable page or post.
 
To link or cross-link to a same-page link:
Search for or Input the page address. If necessary, add a FORWARD SLASH after the page name, followed by a hashtag (#) and the anchor name:
 
www.mysite.com/wordpress/#info
https://stella.mysite.com/word/#pricing
 
Notice there is one slash after the page name. Two slashes before the hashtag breaks the link. HTML is precise.
 
When a visitor activates the link, focus is placed on the anchored content. You direct readers to specific content sections without scrolling by linking directly to the anchor.
Quotations
Quoted text can be formatted to stand alone on the page, gaining the spotlight it deserves.
 
There are two ways to add a quote:
 
Paste and convert:
 
* Copy the quote to the clipboard
* Paste it into a Paragraph block
* Use the Block toolbar or Block Inserter panel to convert the block to a Quote block
 
Insert a Quote block:
 
* Use the slash command, slash menu, or Block Inserter to insert a Quote block
* Type the quote
* Navigate to the next or previous block
 
Quotes are formatted by the theme.
 
You can select colors, typography settings, and an HTML Anchor in the Settings Sidebar.
Separator
A Separator is a thin grey line that spans the page horizontally and divides document sections or topics. It provides visual separation for sighted and low vision users. JAWS ignores separators. They are essentially invisible to screen reader users.
 
For example:
 
* Course info
* Separator
* Course syllabus
* Separator
* Course pricing
 
The Separator provides a visual break between topics. It draws attention to new content and gives sighted and low vision users a break from what may otherwise feel like a wall of text.
 
This graphical bar serves multiple purposes and is inserted like any other block. Because Separator is not a frequently used block, use the slash command or Block Inserter panel to add it.
 
The slash command:
 
Focus on a new block
 
* Type /separator
* Press ENTER
 
The Separator is inserted
Focus moves to a new block below the Separator
 
The Block Inserter panel:
 
* Focus on a new block
* Open the Block Inserter panel
* Search for and activate “Separator”
* Close the Block Inserter
* Return to the Content Area
 
Separators do not affect accessibility
They break up content and add a touch of style
Group Block
A Group block is a container for other blocks. Group blocks create document sections. JAWS users navigate sections using Navigation Quick Keys.
 
You can add blocks to a Group in two ways:
 
* Copy or move an existing block
* Create new blocks within the Group container
 
The Group container is itself a block that holds other blocks. You can insert multiple blocks into a Group.
 
Create a Group using the slash command or Block Inserter.
 
* The slash command:
* Focus on a new block
* Type /Group
* Press ENTER
 
The Block Inserter:
 
* Focus on a new block
* Open the Block Inserter panel
* Search for and activate Group
* Close the Block Inserter
* Return to the Content Area
 
The Group block includes four layout options. One is free-form, and the others are structured. Navigate through the options and activate a layout.
 
Activate one of the following:
 
* Group: The block behaves like an insular page. Insert content just as you would on a page
o Gather a name, picture, and recipe in a single Group block
o Since each Group is a section, navigation is easy
* Row: Blocks are arranged horizontally and aligned across browsers and platforms
o A row of social media icons
o A timeline of pictures
o Side-by-side comparisons
* Stack: Blocks are arranged vertically and aligned across browsers and platforms
o A testimonial, quote, and image
o A class name, summary, and syllabus link
o Your picture, name, and title
* Grid: Blocks are arranged in rows and columns
o Team or student pictures
o Product thumbnails
o A Bingo card
 
 
Use List View to quickly access blocks and Groups in a tree view.
Group
“Group” is the most popular Group Block.. Activate Group in the new Group Block to insert the group.
 
Navigate to and activate the Add Block button. The Block Inserter popup opens.
 
Select and activate a block type. The block is inserted inside the Group.
 
Insert and edit blocks inside the Group. As long as you don’t use the ARROW KEYS to move out of the Group, new blocks are inserted within the Group container.
 
Groups can hold any block type, including Heading, Paragraph, Quote, Separator, and more.
 
You may notice that standard page navigation doesn’t function as expected when a page contains Groups.
 
Row
The Group block “Row” layout places blocks side by side in a single horizontal line. This is a great option for content that should be visually grouped across the page, like social media icons, a timeline of images, or side-by-side comparisons.
 
To create a Row layout:
 
* Focus on a new block
* Type /Group
* Press ENTER
* Navigate the Group layout options
* Select and activate “Row”
 
A single Row is inserted.
 
Add a block:
 
* Navigate to and activate the Add Block button
* The Block Inserter popup opens
* Select and activate a block type
* The block is added
* Repeat to add more blocks across the Row
 
The Row layout aligns blocks horizontally regardless of screen size, browser, or platform. The layout is consistent. Sighted and low vision users see the blocks aligned side by side across the display.
 
JAWS treats each block in a Row as an individual block. There’s no spatial indicator that they’re side by side.
 
For example:
 
* “Follow us on social media” followed by a Row of icons with ALT text
* “Compare plans” followed by a Row with three paragraph blocks titled “Basic,” “Plus,” and “Pro”
 
Screen reader users hear each block in order. Sighted users see them aligned across the screen. The Row layout gives you an accessible, attractive, and space-saving option.
Stack
The Stack layout places blocks in a single vertical column. Each block stacks on top of the next like a layer cake. This layout works well for content that should align from top to bottom regardless of screen size or platform.
 
To create a Stack layout:
 
* Focus on a new block
* Type /Group
* Press ENTER
* Navigate the Group layout options
* Select and activate Stack
 
A single Stack column is inserted
 
To add a block:
 
* Navigate to and activate the Add Block button
* The Block Inserter popup opens
* Select and activate a block
* The block is added vertically
* Repeat to add more blocks to the Stack
 
Stack layouts hold content meant to be read or viewed in vertical order. They work well for testimonials, quotes, contact sections, or student bios. The layout works on all platforms and browsers.
 
Screen reader users navigate each block in an order that matches the visual layout. Sighted users see the blocks layered from top to bottom.
 
For example:
 
A quote
A name and image
 
Or
 
A class name
A summary and syllabus link
 
Or
 
Your picture
Your name
Your title
 
Stack keeps the blocks grouped. Visually, they are clean and readable. JAWS recognizes the section and follows each block in order.
Grid
The Grid layout arranges blocks in rows and columns. It’s like a flexible table, but easier to create. Grid layouts work well for evenly spaced thumbnails, product previews, or student bios. You can group related content and visually organize it without writing HTML.
 
To create a Grid layout:
 
* Focus on a new block
* Type /Group
* Press ENTER
* Navigate the Group layout options
* Select and activate Grid
 
A single Grid row is inserted.
 
To add a block:
 
* Navigate to and activate the Add Block button
* The Block Inserter popup opens
* Select and activate a block
* The block is added to the grid
* Repeat to add more blocks to the grid
 
Each new block fills the next space in the row. When the row fills, the grid adds a new row. The Grid can hold unlimited blocks.
 
The Group automatically adjusts based on screen size. Sighted users see the blocks cleanly aligned across and down the screen.
 
Like the Row and Stack layouts, JAWS users seamlessly navigate the Grid. There is no announcement or column headings. Each block is echoed in order.
 
Examples include:
 
* A grid of team photos
* A set of class thumbnails
* A row and column layout for a Bingo board
 
Use Grids to showcase pictures that link to biographies, states that link to newspaper indexes, or product images that link to detail pages. Grids save space and are completely accessible.
List View
List View opens in a sidebar on the left side of the screen. It has a tree view that lists all page blocks and Groups. Each List View item matches a page block.
 
To open List View:
 
* Navigate to the Top Toolbar: CTRL-SHIFT-TILDE from the document editing area
* Focus is placed on the “View Posts” button
* Navigate once to the Top Toolbar
* Activate “Document Overview”
 
Or press the WordPress keyboard accelerator: ALT-SHIFT-O
 
* Navigate the tree view to review page blocks and Groups
* Expand a Group to access its nested blocks
* JAWS announces each block type and tree view level
 
Activate a block to focus on it in the editor.
 
At first glance, List View may seem useless. JAWS echoes the block type rather than the content. So how do you know which block has focus?
 
Sighted and low vision users match the highlighted item in List View to its corresponding block in the Content Area. 
 
We use labels.
 
Each block can have a tree view label. Let’s label some blocks.
Block Labels
Blocks can be labeled to facilitate List View access. You can label key Groups and pages for easy reference. The ambitious among us will label every block. I love that idea, in theory.
 
For ease of access, I use the List View keyboard accelerator to label blocks. Focus is placed directly on the matching List View block.
 
To label a block:
 
* Focus on a block or select a Group block
* Open List View: ALT-SHIFT-O
* Focus is placed on the matching tree view block
* Press CTRL-SPACEBAR to select it
* An “Options” menu is to the right of each tree view item
* Press RIGHT and LEFT ARROW to navigate between the menu and List View block
* Open the “Options” menu and activate “Rename”
* A small dialog opens
* Type a new label and activate “OK”
 
The dialog closes. Focus returns to the “Options” menu. Press LEFT ARROW to navigate to the block label. JAWS echoes the new label
 
Block labels let you review the block order and make changes to the document layout.
Close List View
Close List View using the Top toolbar or the List View close button.
 
The List View “Close” button:
 
* Focus on List View
* Reverse navigate to and activate “Close.”
 
The Top toolbar:
 
* Navigate to the Top Toolbar
* Activate “Document Overview”
 
List View closes.
Manage Blocks
Blocks are moved, deleted, and managed with the Block toolbar or keyboard accelerators.
 
Let’s discuss:
 
* Deleting blocks
* Moving blocks
* Cutting and copying blocks
* Pasting blocks
 
These features give you control over webpage layout and appearance.
Delete a Block
Delete a block in the Block toolbar or with a WordPress keyboard accelerator.
 
In the Block toolbar:
 
Focus on the Block toolbar: ALT-F10
Open the “More Options” menu
Activate “Delete”
 
Use the WordPress keyboard accelerator: ALT-SHIFT-Z
 
The focused block is deleted
 
You can recover deleted blocks with the Undo command
The Windows Undo command remembers every step of your current editing session
 
If you reverse too far, press the Redo command: CTRL-SHIFT-Z
 
Redo reverses the last Undo.
Move a Block
Move a block above the previous block or below the next block using the Block toolbar
 
To move a block:
 
* Focus on a block to move
* Focus on the Block toolbar
* Navigate to “Move Up” or “Move Down”
* Activate a button to move the block
 
The block is moved. Focus returns to the block.
Select Blocks
Select blocks with WordPress keyboard accelerators.
 
To select blocks, press:
 
* To select a block: CTRL-A
* To select the entire document: CTRL-A twice
* To select multiple blocks:
o Select the first block
o Press CTRL-SHIFT-DOWN ARROW
 
JAWS announces each block or block group as it’s selected.
 
Remove selection with any ARROW KEY.
Focus is placed on the last selected block.
 
You’re ready to cut and copy.
Cut, Copy, and Paste Blocks
Cut or copy a block by focusing on the block and using the Block toolbar “Options” menu or the Windows keyboard accelerators.
 
To cut or copy a block in the Options menu:
 
* Focus on a block and enter Forms Mode
* Focus on the Block toolbar
* Open the “Options” menu
* Activate “Cut” or “Copy”
 
JAWS announces the block is copied or cut to the clipboard.
 
To paste the block or selected blocks:
 
* Create a new block where you want to paste the copied content
* Execute the “Paste” command
 
The blocks are pasted to the destination.
 
Even if multiple blocks are selected, you only need to create one new block. WordPress automatically adds the additional blocks.
Conclusion
This lesson is the final piece of your WordPress foundation. You’ll build on the skills you’ve explored to bring your website to life.
 
Websites are all about content. Content is presented in blocks. Blocks have settings that finesse their content in the Block toolbar and Settings sidebar.
 
Documents don’t go live until you activate “Publish.”
 
To save a draft, activate “Save as Draft,” and edit the content in the “Pages” or “Posts” page.
 
You know everything you need to create an attractive and accessible webpage. The hard work is behind you. Upcoming lessons will refine your site with images, files, plugins, categories, and more.
 
Experiment and explore. If you get lost, refresh the page or move focus to a familiar point. You won’t break anything by adding and editing pages and posts.


---END---
