Making icons accessible without having screen readers repeat text or speak garbled unspeakable info

a link and am using the ion icon web component), but i did it this way recently after some testing:

<a href="{{ url }}" class="u-url" rel="bookmark" title="Permalink"><ion-icon name="link" aria-hidden="true"></ion-icon><span class="visually-hidden">Permalink</a>

(albeit, my commit message was “Keep link icon for permalink from being ugly for screenreaders: This is a longer approach than what i think we’ll take though”)

In your case just a title should be enough; again if this is being communicated in a way other than the symbol no title (for sighted or screen-reading users) is needed.

which tags can have a title attribute?

In HTML5, most any can.