WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: how to use text spacing bookmarklet

for

Number of posts in this thread: 5 (In chronological order)

From: bhargavvaghasiya24
Date: Fri, Nov 20 2020 6:06AM
Subject: how to use text spacing bookmarklet
No previous message | Next message →

Hi all,

As subject says can someone guide me step by step how to use text spacing
bookmarklet to check 4.1.12. your help will be highly appreciated

Thanks,
Bhargav.

From: Mark Magennis
Date: Fri, Nov 20 2020 6:21AM
Subject: Re: [EXTERNAL] how to use text spacing bookmarklet
← Previous message | Next message →

Bhargav,

When you activate the Text Spacing test tool bookmarklet (http://html5accessibility.com/tests/tsbookmarklet.html) on a page, the page content should automatically take on the four changes that the user has to be able to make in order to meet SC 1.4.12:

Line height (line spacing) to at least 1.5 times the font size;
Spacing following paragraphs to at least 2 times the font size;
Letter spacing (tracking) to at least 0.12 times the font size;
Word spacing to at least 0.16 times the font size.

Sometimes the bookmarklet doesn't do this. As far as I can tell, there are two possible reasons for this:

1. The page code doesn't allow these changes to be made. In which case you have found an SC 1.4.12 violation.
2. The content is somewhere the bookmarklet can't reach. I think the bookmarklet may not be able to affect content within an iframe. That may have been changed though so I'm not sure.

If you're unsure of whether the lack of change is due to 1 or 2 above, then try editing the CSS directly. In the F12 code inspector, edit the CSS to set the following attribute values for all text:

line-height: 1.5 !important;
letter-spacing: 0.12em !important;
word-spacing: 0.16em !important;
margin-bottom: 2em !important;

This is what the bookmarklet does.

Mark

From: Vaibhav Saraf
Date: Fri, Nov 20 2020 7:07AM
Subject: Re: [EXTERNAL] how to use text spacing bookmarklet
← Previous message | Next message →

Hi,

When I am required to do this check I normally go for a code inspection to
check if the spacing is not restricted. Is there some ready bookmarklet
which can do this automatically?

Performing the check myself will not work as I am a screen reader user and
I know I will need someone to confirm on the results everytime.

Thanks,
Vaibhav


On Fri, 20 Nov 2020 at 18:51, Mark Magennis < = EMAIL ADDRESS REMOVED = >
wrote:

> Bhargav,
>
> When you activate the Text Spacing test tool bookmarklet (
> http://html5accessibility.com/tests/tsbookmarklet.html) on a page, the
> page content should automatically take on the four changes that the user
> has to be able to make in order to meet SC 1.4.12:
>
> Line height (line spacing) to at least 1.5 times the font size;
> Spacing following paragraphs to at least 2 times the font size;
> Letter spacing (tracking) to at least 0.12 times the font size;
> Word spacing to at least 0.16 times the font size.
>
> Sometimes the bookmarklet doesn't do this. As far as I can tell, there are
> two possible reasons for this:
>
> 1. The page code doesn't allow these changes to be made. In which case you
> have found an SC 1.4.12 violation.
> 2. The content is somewhere the bookmarklet can't reach. I think the
> bookmarklet may not be able to affect content within an iframe. That may
> have been changed though so I'm not sure.
>
> If you're unsure of whether the lack of change is due to 1 or 2 above,
> then try editing the CSS directly. In the F12 code inspector, edit the CSS
> to set the following attribute values for all text:
>
> line-height: 1.5 !important;
> letter-spacing: 0.12em !important;
> word-spacing: 0.16em !important;
> margin-bottom: 2em !important;
>
> This is what the bookmarklet does.
>
> Mark
>
>

From: bhargavvaghasiya24
Date: Fri, Nov 20 2020 9:21AM
Subject: Re: [EXTERNAL] how to use text spacing bookmarklet
← Previous message | Next message →

Thanks Mark.



Working well with Firefox and Internet explorer. Where in chrome unable to
bookmark the

Text Spacing test tool. How can I Accomplish the same.



Best,

Bhargav.

From: Mark Magennis
Date: Fri, Nov 20 2020 9:39AM
Subject: Re: [EXTERNAL] how to use text spacing bookmarklet
← Previous message | No next message

I went to http://html5accessibility.com/tests/tsbookmarklet.html and followed the instructions to drag it to my bookmarks bar.