4

I am using the title element to update the document title and using JAWS reader to read the page. Facing issue with the way it is reading the title of the document. Below is my code to update the title attribute

var _doctit = "MY TITLE";
document.title = "ISL - " + _doctit;

I am sitting through JavaScript, in screen reading like "IS"+L. But I want to make this to read as I S L. I tried with space/ dot means it works, but I cannot set the title like that with space /dot. Anyone please help me with this.

Shahzaib Mazari
  • 394
  • 2
  • 13
Sasi Dhivya
  • 469
  • 2
  • 5
  • 22

1 Answers1

3

So you want the page title read as "I S L" but visually you need it to show "ISL"?

Unfortunately, you can't fix it. If this were an element on the page and not the title, then you could use an aria-label or visibly hidden text to force a certain pronunciation, such as

<h1 aria-label="I S L - my title">ISL - my title</h1>

or

<p><span aria-hidden="true">ISL</span><span class="sr-only">I S L</span> - my title</p>

(See What is sr-only in Bootstrap 3?)

But the <title> element does not allow any aria attributes and the contents of the <title> can only be text.

Screen reader users are used to things being mispronounced. Normally they can navigate letter by letter themselves using the left/right arrow keys while in virtual pc cursor mode, but for the page title, you don't have that option.

slugolicious
  • 8,671
  • 1
  • 20
  • 30
  • but my need is for title only. Is there any option? – Sasi Dhivya Mar 14 '19 at 11:01
  • 1
    the `document.title` is the same as the `` element. that element can only contain text so you can't "fake out" a screen reader and embed blanks. there is nothing you can do about it. – slugolicious Mar 14 '19 at 18:13