Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

189
Visualizações
How to handle focus and define ARIA roles

In the 1001st implementation of carousel I would like to "properly" handle the focus.

A few quick questions related to UI/UX of this component:

  • the arrows and the page navigation can accept focus if the TAB key is used. Should I keep the focus on the arrow button after a click event? Is it possible to do it wo calling element.focus() method - like pure HTML/CSS solution?
  • the page navigation area is suppose to handle the arrow keys inputs - the same question for it: Should I keep the focus once a page navigation button is pressed? Is it doable wo element.focus()? What should be ARIA role for this component?
  • the design requires 4px height navigation buttons - really hard to click on mobile. In order to make them useable, a div is added as a child of a navigation button so the height of click zone is extended to +20px. Is there better way to extend the "hot zone"?
  • how can I exclude the additional divs so as not to contribute to area of focus rectangle
about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

Regarding focus, you ask if the focus can be kept on the buttons without using focus(). Absolutely. In fact, when you click on a button, the focus will not move unless you specifically move it or if the element you clicked on gets hidden. So if your desire is to leave the focus on the button, then you don't have to do anything.

That's the preferred behavior - leave the focus on the button. If I'm exploring the carousel slides and I'm a keyboard user, I will navigate/tab to the "next" button and press enter. I'll review the slide and if it's not what I want, I'll press enter again (assuming my focus remained on the "next" button) to see the next slide. If you force the focus to move away from the button and to the carousel content, then I have to navigate back to the "next" button before I can view the next slide. It can be annoying to have to keep navigating back to the element I just selected.

I don't understand your third or fourth questions.

Have you looked at the two W3.org references regarding carousels?

  • https://www.w3.org/TR/wai-aria-practices/#carousel
  • https://www.w3.org/WAI/tutorials/carousels/
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda