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

172
Visualizações
Is there a way to make screen reader announce only once when the element is rendered?

I have a timer that handled by js to decrease from 59 to 0 every seconds. I'm using aria-live to detect the changes. However, the screen reader keeps repeating everytime element is changed.

How could I make a screen reader announces the timer for the first time it was rendered only?

about 4 years ago · Juan Pablo Isaza
2 Respostas
Responde à pergunta

0

What I've done before is have a visually hidden container (<div> or <span>) that has aria-live and I only update that container every XX seconds. I also have a visual container that's updated every second to countdown from 59 to 0. This allows me to control how often the timer is announced.

Depending on your situation, you might want to update the live container every 15 seconds (at 60, when first displayed, at 45, 30, and 15). Then maybe at 10 and 5. Then perhaps every second below 5.

To create a visually hidden container, see What is sr-only in Bootstrap 3?. (You don't need Bootstrap. You can just copy the CSS definition and use it directly.)

about 4 years ago · Juan Pablo Isaza Relatório

0

From your description in the comments, it sounds that you're building a popup banner or notification to inform a user when their session is about to expire. So, while it's definitely not ideal to have a screen reader announce the timer every second, you also can't only announce this once when it first appears. What if the user is typing when the notification appears and their keystrokes interrupt the notification? What if the user has momentarily stepped away from their computer and returned, but have missed the initial notification?

I agree with Graham's suggestion: use JavaScript to update the aria-live region every 5-10 seconds as the timer counts down. Alternatively, you could also use role="alert" to force the announcement, removing the role="alert" and adding it back every 5-10 seconds (WCAG recommends at least 20 seconds). Either way, the user must be informed that their session is going to expire and must be given the option to extend their session. This falls under WCAG 2.1 guideline 2.2.1: Timing Adjustable.

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