Some of your visitors never touch a mouse. The storefront locator is built so those visitors can find a store the same way everyone else does: with the keyboard alone, and with a screen reader reading the map out as text. Here is what that looks like on your storefront.
The map is reachable with Tab and announces what it is when focus arrives. Inside it, arrow keys move from marker to marker, Enter opens the marker your visitor is on, and Escape leaves the map and continues down the page. Each marker announces the store it belongs to, and a cluster announces how many locations it holds. When a marker opens, focus moves into its details, and closing it puts focus back on the marker so the visitor never loses their place. Zoom, full screen and reset are ordinary buttons with names. If your map uses the Google Maps provider, the map, its markers and the details window follow Google's own keyboard behaviour instead.
The list is a full text version of the map, so a screen reader can read your stores without touching it. It is announced as a list, and arrow keys move between results, so a long list is a few keystrokes rather than a long tab sequence. Each result reads out as the store name and address, store names are marked up as headings, and collapsible groups open and close with Enter. When results are loading, when a search returns nothing, and when something goes wrong, the list says so out loud instead of only changing on screen.
The search field is labelled, and the suggestions under it, addresses or products, are announced as a list of options the way screen readers expect: arrow keys move through the suggestions, Enter picks one, Escape closes the list. In the checkbox layout, tag filters are real checkboxes with labels, so they are reached with Tab and toggled with Space. Focus stays visible throughout: whatever holds the keyboard gets a clear outline, including the map controls.
The map and its controls, the search bar, the groups and the filters announce themselves from the app's translations, so they speak your storefront language. You can reword any of them in Settings → Translations, which is also where you add a language the app does not ship yet. What a result reads out is your own data: the store name and address exactly as you entered them.
Try it yourself: load your locator page, press Tab, and walk through the search, the list and the map without touching the mouse.
Keep the results list switched on. It is what makes your locations readable without the map.
Choosing colours in the map and list design settings? Keep enough contrast between text and background for the wording to stay readable.
Stuck on any of this? Open the chat in the bottom right corner of the app and we will help you set it up.
