Forum Discussion

marvie_ctr's avatar
marvie_ctr
Staff
22 hours ago

Hi Sonl!

Tabbing is intended to move focus between interactive elements. If your custom block contains only headings, paragraph, images or shape, these are static content and are not expected to receive keyboard focus.

When using a screen reader, non-interactive content is typically accessed through the browse or reading mode. Depending on what screen reader you are using, you’d typically use the up/down arrow keys to move through the content instead of tabbing. For example, using NVDA with Firefox, you can use up/down keys to navigate through the content, while VoiceOver with Safari, you use CTR + OPT + Left/Right arrows.

That said, you mentioned that a paragraph in your Custom Block is receiving keyboard focus. I suspect this may be because the paragraph is scrollable, so the scroll is receiving the keyboard focus. It may be subtle, but you can verify this by editing the paragraph in the custom block, expanding the text container to comfortably fit the text, and try again.

I'd be happy to take a closer look too, to be certain, if you can share a link to sample.


Cheers!
Marvie

 

  • sonl's avatar
    sonl
    Community Member
    12 hours ago

    Hi marvie_ctr​ !

    It all makes sense now, in this case you are correct - The interactive elements in the text field was scrollable hence why I was able to tab towards it.

    In saying this - is there any possible workaround or is this simply just a limitation as of present?

    Kind Regards,

    • marvie_ctr's avatar
      marvie_ctr
      Staff
      2 hours ago

      Hey sonl​ !

      Glad to hear that was it! This is actually intentional for fixed-layout. The scroll mechanism is in place to ensure that text remains visible and accessible even if it becomes larger than the available space. For example, if you change to a font that takes up slightly more space than the original, or for when the content is translated and the text becomes longer. I'll check that the fixed-layout template where you encountered this is adjusted. 

      The better solution is start authoring in responsive layout, and using the responsive templates, to avoid the text scrolling altogether 😀. 

      Cheers!
      Marvie