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:

 

Use a slash command:

 

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:

 

The Block Inserter panel opens.

 

The Block Inserter has three tabs:

 

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:

 

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:

 

 

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:

 

 

Configure the heading level in the Block toolbar:

 

 

Configure the heading level and text or background colors in the Block Settings sidebar:

 

 

Configure the following:

 

 

The next options configure heading block typography settings:

 

 

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:

 

 

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:

 

 

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:

 

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:

 

 

Insert a Quote 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:

 

 

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

 

 

The Separator is inserted

Focus moves to a new block below the Separator

 

The Block Inserter panel:

 

 

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:

 

 

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 Block Inserter:

 

 

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:

 

 

 

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:

 

 

A single Row is inserted.

 

Add a block:

 

 

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:

 

 

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:

 

 

A single Stack column is inserted

 

To add a block:

 

 

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:

 

 

A single Grid row is inserted.

 

To add a block:

 

 

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:

 

 

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:

 

 

Or press the WordPress keyboard accelerator: ALT-SHIFT-O

 

 

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:

 

 

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:

 

 

The Top toolbar:

 

 

List View closes.

Manage Blocks

Blocks are moved, deleted, and managed with the Block toolbar or keyboard accelerators.

 

Let’s discuss:

 

 

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:

 

 

The block is moved. Focus returns to the block.

Select Blocks

Select blocks with WordPress keyboard accelerators.

 

To select blocks, press:

 

 

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:

 

 

JAWS announces the block is copied or cut to the clipboard.

 

To paste the block or selected blocks:

 

 

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---