As part of a redesign of my personal website, I have a hero picture with a flying animated flying. In hover, the airship switches to a different animation. I wish that a keyboard user can focus this element and trigger the animation.
tab-index. It works, but the animation seems strange with the focus
contour surrounding the airship.
My question is Is it acceptable to use a personalized focus indication as art direction? Normally, I would not want to play with the focus
contour a user expects to see because it is important for keyboard accessibility. However, this seems strange and misplaced here, and I could probably replace it with a lighting / drop shadow effect that would still indicate that the element's state has shifted to "focused" and fits the content better.