IRCTC has recently launched their next generation ticketing system and we decided to post accessibility review in a two or more parts. Reason for splitting into parts is that we would want IRCTC to fix problems in phased manner and start with the main and popular section of the website – Booking a train ticket!
Firstly, I congratulate IRCTC for their efforts to provide best possible experience. For a long time we hear comments like “IRCTC is slow”, “never able to book tickets on IRCTC” and so on… and this next generation ticketing system is really fast. I have used it for about last a month or so and booked several tickets and never had a problem in terms of speed or booking process.
So one problem is almost solved as far as booking process is concerned and now I urge IRCTC to consider looking into accessibility aspect of the portal. Below are some findings to start with:
In this post, I’ll be using terms like “screen reader” “assistive technologies” etc., Let;s understand a little bit about them. Assistive Technologies are enabler to people with disabilities and help them using computers and mobile devices. For instance:
- Users with vision impairment uses screen reader – whatever is on the screen will read aloud for them. If you are a windows user, to experience a screen reader, just download and install NVDA – a free and open source screen reader. If you are a Mac user, just press CMD+F5
- Users with low vision uses a screen magnification software or use high contrast mode
- Users with motor disabilities such as having problems with fingers or palm, uses switches or voice recognition
- Captions (for videos) would be helpful for people with hearing loss
Login Page
- Very difficult for keyboard users to reach login form: As we know login is one of the popular section that a user would use. For a keyboard only users, as of writing, it requires using tab key for 8 times. One way to resolve this issue is by providing a same page link called Skip to Login at the top of the page. The code would look something like this:
At the top of the page:<a href="#login">Skip to login </a>
Just before the login heading:<a name="login"> - Lack of heading structure: Though visually all sections appears to have headings, they are not marked up with
<heading>attributes thus assistive technologies such as screen readers and search engines cannot identify these headings. - Associated labels are missing for form fields: Similar to headings, visually one would see form labels but due to lack of “for” and “id” attributes, association between
<label>and<input>fields are missing. For a screen reader user, it would be read something like “edit, edit, select” and so on… - CAPTCHA: I know security is important and for such a large scale application, definitely “yes”; however, currently there is no way on this site how customers with vision impaired can solve this image based CAPTCHA. There needs to be an alternative such as audio CAPTCHA and to address needs of everyone, it would be recommended to have a text based CAPTCHA such as a math question etc.,
Search trains & book tickets
- Like mentioned above, it’s very difficult for keyboard only users to reach the booking form. It requires them to press tab key for 11 times to reach booking form. Solution would be add “Skip to booking form” link at the top of the page.
- Associated labels are missing for form fields: Similar to headings, visually one would see form labels but due to lack of “for” and “id” attributes, association between
<label>and<input>fields are missing. For a screen reader user, it would be read something like “edit, edit, select” and so on… - When users start typing a station name, auto-suggestions will pop-up, same are not available to screen reader users.
- Date picker: It’s impossible for a keyboard only user as well as screen reader users to use date picker. Firstly while pressing tab key, focus will just skip the date picker field being it a read-only input field; thus it cannot be used via keyboard. Solution would be let user enter the date either manually or using date picker. Providing both options would be great. In addition required date format can be notified.
- Radio buttons to select “general / ladies / tatkal” does not have associated labels
- Appropriate labels are present to fill in passenger details – great! However, a few fields like contact number are missing the associated labels
- Again, there needs to be an alternative for CAPTCHA on booking page
I think if IRCTC could start fixing these issues, it would be really great! In addition, it would be absolutely valuable to avoid table mark-up for layout purposes; instead use CSS.
Dear IRCTC, you delivered a really fast and intuitive portal so please consider looking into accessibility and it would be helpful to large number of customers who are with disabilities. Thank you in advance.
Best,
Srinivasu
Leave a comment