FontAwesomeSVG-PHP v1.1: improved accessibility

I've updated FontAwesomeSVG-PHP with improved accessibility features.

If you are not familiar with FontAwesomeSVG-PHP, it is a PHP class that inlines Font Awesome's SVG icons without Javascript. It renders the icons on the server side instead of outputting something like <i class="fas fa-file"></i> and have Javascript replace that with the actualy SVG icon on the client side.

What's new?

Automatic aria-labelledby

With the previous version you could add a <title>:

1echo $FA->get_svg('fas fa-file', [
2 'title' => 'File',
3]);

The above outputs something like:

1<svg>
2 <title>File</title>
3</svg>

With the new version you can also add an id to the <title>. If you do, aria-labelledby will be automatically set for you:

1echo $FA->get_svg('fas fa-file', [
2 'title' => 'File',
3 'title_id' => 'file-id',
4]);
1<svg aria-labelledby="file-id">
2 <title id="file-id">File</title>
3</svg>

aria-* attributes

You can now add any aria-* attribute to the SVG tag:

1echo $FA->get_svg('fas fa-file', [
2 'aria-label' => 'File',
3]);
1<svg aria-label="File"></svg>

aria-hidden attribute

Decorative icons should be hidden from screen readers. So aria-hidden="true" is added to the SVG tag by default unless <title id=""> (and hence aria-labelledby) or aria-label is set:

1echo $FA->get_svg('fas fa-file');
1<svg aria-hidden="true"></svg>