WebAIM - Web Accessibility In Mind

E-mail List Archives

A question about screen reader only css.

for

From: 김형섭
Date: Jan 3, 2016 5:53AM

Hello, I'm Hyongsop Kim in Korean and have a question about screen reader only css.

As you know, If I have to hide some text for the screen reader users, I have to use css property such as overflow hidden, position absolute and etc.
By the way, in case of using this css, there are some problems.
1. In mobile page, if I use this css, screen reader users can read hidden text with their finger swipe gesture.
But if they use explore by touch, they can't read hidden text because this text is not positioned in real screen.
2. if I have to give additional information in a tag, I have to use one more tag such as span in order to give hidden text property.
For example, <a href=www.google.com target="_blank">google <span class="sr-only">opens in new tab</span</a>
This span tag is useless tag.
So is there another way to give additional information to screen reader users with hidden method without using this kind of css by using aria?
I think aria-label, but aria-label is used just label and can't use it as additional information or long paragraph.
Please help me about this issue.

Thank you.

김 형 섭 / Hyongsop Kim
(주)엔비전스 / 대리

서울시 종로구 가회동 1-29
1-29 Gahoe-dong, Jongno-gu, Seoul, Korea
T. +82 70 4900 0895 F. +82 2 313 3645 M. +82 10 5359 5996

http://dialogueinthedark.co.kr
http://cafe.naver.com/dialogueinthedark