Sortable tables how to design/ describe icons for not sorted/ ascending/ descending

Although I'm already for a long time making websites accessible, there still sometimes are problems and questions, that I would like to hear other peoples opnion about.
Today I have a question about sortable tables. I found an example by Heydon Pickering (see link below) and I understand, that there is a aria-sort for screenreader users, but as a seeing person, I find it confusing, that the arrow up (for ascending) results in values, where the lowest is on the top (which is logically right, because you start reading at the top, so the higher values are coming one after another and the highest should stand according to natural reading direction at the bottom - but why the arrow shows up? To me this implicitly means, the highest value should be on the top).

So this brings me to a demand from former german accessibility testing, where every icon should have a visible text alternative. Is there something similar in the WCAG (I can't find it)?

What is your opinion? And how would you provide this text? Honestly I have no idea where to put a text in this example table for people who can see...

Also I don't know what to do with the button itself. When coming to this table for the first time, of course all the buttons are "not pressed", but after one of them has been pressed once, you can change this particular button only from "pressed" (ascending) to also "pressed" (but descending). So first you toggle the button from "not pressed, not sorted" to "pressed, ascending" and with the next click not back to "not pressed, not sorted", but to "still pressed, descending".

Also confusing (this time for screen reader users).

So for me this example (which is already the best, taht I have found) still does not solve all issues for me and I would really appreciate any suggestion to improve it!


--
Mit freundlichen Grüßen

Marc Haunschild
www.mhis.de