There are lots of a11y issues with websites powered by Obsidian Publish.
This is less a single bug (but I’ll provide an example) and more an urging to make your products accessible to disabled people. Obsidian Publish (and presumably other Obsidian products) exclude them and limit your market.
It would be easiest to identify and prioritize issues by hiring someone with the expertise to perform a proper audit. I don’t have that expertise, but I could help you find someone if you don’t know where to start.
Steps to reproduce
Publish any content using Obsidian Publish.
Visit your Obsidian Publish-powered website.
Attempt to navigate via keyboard. (Hit tab a lot.)
Expected result
It should be obvious which element has focus, because it should most likely have a ring around it. This is an a11y feature that exists as a browser default, and it has been disabled.
I also expect to be able to focus on the navigation in the left sidebar using only my keyboard (using the default styles), but it appears that focus has been trapped within the content of the published file. This is another default a11y feature that exists as a browser default that has been disabled.
This one most likely can’t even be addressed by individual users since it’s almost certainly disabled via JavaScript, and Obsidian Publish prevents users from publishing their own JavaScript.
Actual result
Default focus styles have been disabled without being replaced by others.
Navigation isn’t focusable.
Environment
Operating system: Browser / macOS
Obsidian version: v0.12.3
Additional information
I can’t use Obsidian Publish as it exists today due to its exclusion of disabled people. It doesn’t even just affect users, but even audiences of users. I’m cancelling my subscription and using another tool.
I agree that things can and should be improved on this front. However, your deduction as to why this isn’t working isn’t accurate. Anyway, we’ll look into this.
Here’s a starting point (though not the complete list) for issues to be on the lookout for : Checklist - The A11Y Project
What would help me (because I have close to 0 coding knowledge) would be a publish.js that complies with the checklist or something similar - that way using obsidian publish has a default accessible version for people like me to use with publish.
I’m currently figuring out what the best way to start publishing for the Internet would be, so any update on this would be useful
In addition to the keyboard navigation and focus issues described in the original report, Obsidian Publish sites typically get amber rated scores for accessibility in Lighthouse due to missing image alt text and a lack of a language attribute.
Open a public vault that has folders on the left side and/or links in the main content area.
Use the tab key to navigate through interactive elements on the page. (On macOS, you need to enable Keyboard Navigation.)
Expected result
Focused elements are clearly highlighted. All interactive elements, including collapsed and expanded folder names, can be reached with the keyboard. When also using a screen reader, the state of the folder (expanded/collapsed) would be conveyed.
Actual result
There is no focus highlight at all. Folders cannot be reached or expanded. The state metadata is not added to the underlying code.
Environment
Obsidian Publish
Additional information
Accessibility is not only a requirement in many professional contexts, it is also a human right. The underlying HTML/CSS/JavaScript of a published Obsidian Vault can easily be made accessible. The international standard WCAG 2.1 on Level AA is a requirement in many countries, including the USA and the European Union. Hence, this is also a sound business decision.
The inaccessibility of Obsidian Publish means I am unable to share my knowledge base with disabled colleagues.
While accessibility is often seen as a daunting task, the changes here would be minimal – better focus styles, using buttons instead of div elements for the expand/collapse functionality.
(Disclaimer: I am an accessibility professional, but reporting this bug is in my functionality as a user who wants to be able to share notes without barriers. The issues are so basic, any accessibility support should be able to find and fix them.)
)