Button text and hide it in the UI, eg. with a visually hidden approach like the negative indent Jason mentions, or if you have a specific element something like:
.thing-to-hide {
border:0;
clip:rect(0 0 0 0);
height:1px;
margin:-1px;
overflow:hidden;
padding:0;
position:absolute;
width:1px;
}
...do not use display:none as that won't be available to screen readers.
aria-label in this case as you can already make the text available.title is a little sketchy and you shouldn't rely on it as the only alternative; although it does help sighted users who might not understand your icon.label just isn't the right element, you should use those for inputs but buttons don't need them.Another way to consider this question: you could make test cases for what you're thinking about, then run them through tools like AXE and test them yourself with screen readers. Hopefully they'll agree with the advice you're getting here ;) Similarly the WAI website has been overhauled recently with lots more dev resources .