Accessibility Review: Revamped website of Reserve Bank of India

Thanks to a good friend, Harish Kotian who posted news about revamp of RBI’s website on Access India mailing list (external link) so I decided to have a quick look at revamped website of Reserve Bank of India (external link) and make note of my comments:

As the page got loaded, (visually) I have noticed a inline modal dialog that talks about revamp of the website and it’s features. However:

• The keyboard focus does not go to this modal dialog
• As the focus did not go the dialog, content is unavailable to screen reader users
• I used mouse and clicked within the dialog and then tried closing the dialog with esc key and it failed
• There is no close link / button to close the dialog (even visually), but clicking on “next” link closed the modal pop-up. I recommend remove this “next link” and add a close button at the top right for such dialogs.

As this screen would anyway just go in a while, I don’t set this as a high priority ask but whenever there are such dialog components are used, they need to be accessible. An article on Accessible modal dialog by Marco Zehe (external link)

It is good to see features like Increase font size, dark theme etc., are included at the top of the website to help users with low vision and elderly. However, when I switched to dark theme, it did not get apply to the entire page. For instance, What’s new section still shows me with dark font on light back ground.

Text input (edit) box for Search does not have neither a visible nor a placeholder label. Screen readers just read as “Edit” and visually there is no label at all. It’s good that search has powered with auto suggestions and after keying a few letters, using down arrow, suggests are read aloud by screen reader. However one quick fix for tis to be made is notify user about availability of suggestions using aria-live.

In the top navigation, “Publications” and “Stastics” does have sub (mega) menus but they are not accessible using keyboard. Unable to expand these menus. But I liked it does have a visual indication for drop down. An accessible menu bar example from Open Ajax Alliance (external link).

There is a carousal just below the navigation showing different buildings of RBI and preamble message. However, there is no option to pause or stop the moving images.

Current rates and Function wise sites should be marked up as heading level 2 and not heading level 3.

Tabs used for What’s new, sections updated today and coming soon are working just fine. But a slight enhancement can be done. Currently once I expand any tab using space bar and use down arrow key to read the content, focus moves to next tab item and read them as well and then read content of selected tab. Instead, when using down arrow after selecting a tab, screen reader should be able read content of selected tab.

There is a link with screen text “more” under what’s new tab which is not descriptive. It should be something like “More on what’s new” etc.,

There is a “more links” marked up as h4, it should be marked as h3 and also I recommend this to be more descriptive.

In most of the inner pages, for example About Us page on RBI website (external link) there are sub menus in the side navigation for menus like Organizations and functions; but when browsing the page with tab key using screen reader, these menus are skipped. But when I tried using up and down arrow keys at this navigation, they worked and was able expand menus using space bar.

Overall, there are some good effort put in to make the site accessible. But just some more work is needed. Please note that I have tested only home page and part of About Us page for now.