Hi all,

So the Experience Builder has some accessibility challenges but I found some workarounds to be able to use most of its functionality with the screen  reader. The notes below are for NVDA since you need to use the click and hold functionality for dragging and dropping. 

When you open the Experience Builder, on top there are a few buttons like Refresh Page, Undo, Redo, Preview etc. When you get to preview, if you press the down arrow key once, you get to an element that will just say Clickable if you haven't disabled NVDA's hint stuff that tells you the element types. 

Once you are at this Clickable Element do the following: 

1. Press NVDA + Numpad Slash to move the mouse to the object. 

2. Move the physical mouse down a tiny bit. 

3. Press the up arrow key followed by the down arrow key. 

If the mouse pointer is on the top of the icon, you  should hear the text that gets revealed on mouse hover. It should say components. Pressing enter won't activate this, so you should press the Numpad Slash button to trigger a left mouse click to activate the button. Your focus will now move to a new dialog where you can access the components. 

Besides the Components, there are 4 more icons that reveal when the mouse is on top of them. To get to those, you will need to repeat the steps above, but keep moving the mouse pointer further down as they are vertically positioned on the screen one after another. Keep inspecting the revealed text by moving up and down with the arrow keys. 

Those are my notes about accessing those hidden icons. The icons are Components, Settings, Theme, Page Structure, and one more that escapes me at the moment :). 

For adding a component, after you reveal the component list, you will need to enter NVDA Focus Mode after expanding a section. For example, in the Content section, after expanding it, the first item in the list is Calendar. 

1. Enable focus mode with NVDA + Space and use the arrow keys to select a component. 

2. Move the pointer with NVDA + Numpad Slash on top of it, then lock the left mouse button with Shift + Numpad Slash. 

3. Exit Focus Mode with NVDA + Space 

4. Go up until you reach the area where your page sections are displayed, you should hear things like Content Header, Content, Content Footer. 

5. When you know where you want to drop the component, move the mouse pointer  there with NVDA + Numpad Slash 

6. Drop the component by pressing Shift + Numpad Slash. 

Finally, if you want to delete a component, the easiest way to do this is via the Page Structure menu which can be accessed by the icons with hover text that I talked about in the beginning. The Page Structure section displays all the components in your page which lets you access their properties or delete them. 

Hope this helps.