https://github.com/conor-darcy/screenreader-dates
Apply aria-label to time tag dates in a more readable format for screenreaders
https://github.com/conor-darcy/screenreader-dates
accessibility aria aria-label date-formatting datetime html html5 javascript time
Last synced: 9 months ago
JSON representation
Apply aria-label to time tag dates in a more readable format for screenreaders
- Host: GitHub
- URL: https://github.com/conor-darcy/screenreader-dates
- Owner: conor-darcy
- License: mit
- Created: 2017-04-10T08:05:20.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2017-04-10T08:37:52.000Z (almost 9 years ago)
- Last Synced: 2025-03-12T20:08:46.416Z (11 months ago)
- Topics: accessibility, aria, aria-label, date-formatting, datetime, html, html5, javascript, time
- Language: HTML
- Size: 5.86 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# screenreader-dates
Create screenreader friendly dates & apply them to an [aria-label](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute).
Checks for a '[datetime](https://www.w3schools.com/tags/att_datetime.asp)' attribute on '[time](https://www.w3schools.com/tags/tag_time.asp)' tags and converts it to a more readable format for screenreaders & adds the new formatted date to an 'aria-label' attribute.
Dates in 'datetime' attribute should be in [ISO standard format](https://www.w3.org/TR/NOTE-datetime).
**For example:**
```
```
is converted to
```
```
Screenreader users should hear **'Wednesday, April Fifth, two zero one seven'** instead of **'four slash five slash two zero one seven'**.
## Installation.
$ bower install screenreader-dates
## Usage.
- You must use a 'time' element
- Date must be in ISO format. Eg. 2017-04-07 for April 7th, 2017
- Date must be in a 'datetime' attribute
## Limitations/Potential features
- No configuration, it does what it does.
- Applies the aria-label to all time elements with a datetime attribute automatically. You cant choose which elements are included.
- Doesn't handle time (hours, minutes & seconds).
- Year is read out as digits, eg. 2017 is read as 'two zero one seven' & not 'twenty seventeen'.
- Always adds the week day, you cant turn this of.
- No localisation, english only.