Closed EricNiyo73 closed 2 weeks ago
Hi, and thank you for this idea!
This kind of feature-set would be outside the scope of Vocabulary, as it is just a UX framework, not a full technical implementation.
It already includes a mechanism in the menu bar for selecting other languages, when an implementation supports that, but as yet there isn't translation support baked into every implementation. One such example that is currently working would be the CC Legal Tools (see top of webpage). This utilizes Transifex, and any other implementations would need to do the same.
I'm closing this as outside the scope of the project, and already covered to the extent that Vocabulary would operate under.
Problem
The page content currently only displays in English, which limits accessibility for non-English-speaking users. There is no mechanism to switch between different languages, resulting in a lack of inclusivity and accessibility.
Description
This feature will add a language-switching mechanism to allow users to toggle between English and French (and potentially other languages in the future). By leveraging data-lang-en and data-lang-fr attributes on each text element, JavaScript will dynamically update the text content on the page based on the selected language. This enhancement will make the content accessible to a broader audience, improving user experience and inclusivity.
Alternatives
An alternative approach could involve server-side language processing to load the correct language version of the page based on user settings or browser locale. However, the proposed approach (using JavaScript and data-lang attributes) allows for faster implementation, better control over dynamic language switching, and does not require a page reload.
Additional context
This feature should integrate with the existing JavaScript function, setLanguage(language), which will update all elements with data-lang attributes. Ensure that the language toggle buttons are accessible and usable with keyboard navigation and screen readers.
Implementation