Consistent and predictable naming

Example: How to name a button

Test this with a screen reader and with voice recognition software

No name

<button>
  <svg viewBox="0 0 20 20"
        focusable="false"
        role="presentation">
    [...]
  </svg>
</button>

Heart icon?

<button aria-label="Heart icon">
  <svg viewBox="0 0 20 20"
        focusable="false"
        role="presentation">
    [...]
  </svg>
</button>

Describe the action

<button aria-label="Like">
  <svg viewBox="0 0 20 20"
        focusable="false"
        role="presentation">
    [..]
  </svg>
</button>

Start with the right word

<button aria-label="Please like this post">
  <svg viewBox="0 0 20 20"
        focusable="false"
        role="presentation">
    [..]
  </svg>
</button>

Add text! As in don't make me guess

<button>
  <svg viewBox="0 0 20 20"
        focusable="false"
        role="presentation">
    [..]
  </svg>
  Like
</button>