스크린 리더로 Discourse 사용

이러한 동작이 내 Windows 기기에서 매우 일관되게 나타나기 때문에 이상합니다.
Chrome Canary (Google Chrome 버전 111.0.5536.0)에서 테스트해 보았습니다.
다음과 같이 시도해 보세요.
다음 주소로 이동하세요:
https://meta.discourse.org/
토픽 목록에서 다음 토픽을 찾으세요:
Does Discourse offer anything similar to WordPress custom taxonomy?

해당 행의 마지막 열로 이동하세요. 텍스트가 있는 곳입니다:
현재 내 덴마크어 설정에서는 '3t’로 표시됩니다.
Enter 키를 누르면 해당 토픽의 마지막 답변으로 포커스가 이동해야 하지만, 실제로는 그렇지 않습니다.
Enter 키를 눌러도 아무 일이 일어나지 않습니다. 보통 페이지가 업데이트되지 않기 때문에 화면 낭독기가 아무 동작도 하지 않습니다.
그러나 행을 읽으면 여전히 페이지의 첫 번째 줄에 있으며, 스레드에 마지막으로 게시된 토픽의 예상 헤딩이 아닙니다.

NVDA는 포커스를 약간 이동시키지만, 토픽 자체 안으로조차 이동하지 않습니다. 이 문제를 게시한 시점까지 두 화면 낭독기 모두 예상대로 작동했습니다.
Firefox Nightly 버전 110.0a1로 변경했을 때
위 예시에서 '3t’를 누르면 해당 토픽의 최신 게시글로 이동하며, 포커스가 예상대로 배치됩니다.

4개의 좋아요

이 문제는 회귀(regression)된 것으로 보입니다.

구체적으로 말씀드리면, 제가 사용하던 자체 호스팅 인스턴스 여러 곳에서 한동안 잘 작동하다가, 현재 고용주가 사용하는 사이트들에서 실패하고 있습니다. 특히 https://community.fly.io 와, 위에서 언급한 내용으로 쉽게 추측할 수 있는 내부 호스팅 포럼인 특정 discourse.team 사이트에서 문제가 발생합니다. :slight_smile: 두 사이트 모두 동일한 버전의 Discourse를 사용하는 것으로 보입니다.

저희는 Discourse에서 많은 작업을 수행하고 있기 때문에 이는 큰 불편을 초래하고 있습니다. 시각 장애를 가진 직원으로서 내부 토론과 커뮤니티 멤버들과의 지원 대화에서 제 위치를 자주 잃어버리게 됩니다. 이전에 읽었던 게시물로 돌아가기 위해 원래 있던 위치를 찾기까지 20~30초가 소요됩니다.

옛날 14400 baud 모뎀을 쓰던 시절을 떠올리게 합니다. :slight_smile:

도움 주시면 감사하겠습니다.

2개의 좋아요

소음을 일으켜서 죄송합니다. 조금 더 알아본 결과, 이 문제는 Firefox에서는 동작하지만 Chrome에서는 동작하지 않습니다. 회사에서는 업무용으로 Chrome 사용을 의무화하고 있어서, Firefox를 사용하는 다른 환경에서는 문제가 없었지만 Chrome에서는 문제가 발생한 것입니다.

생각했던 것만큼 큰 회귀 문제가 아니라서 다행이지만, Chrome에서도 이 기능이 정상적으로 동작하면 좋겠습니다. NVDA를 사용 중이며, Chrome에는 확장 프로그램이 설치되어 있지 않은 상태입니다.

4개의 좋아요

노란! :wave:

크롬에서 작동하지 않는다는 소식에 죄송합니다. 이 주제가 꽤 길어서, 회귀(regression)의 구체적인 사항을 좀 더 자세히 설명해 주실 수 있을까요? 주제를 불러올 때 원래 위치로 돌아가지 않는 것 같지만, 문제를 정확히 파악하고 해결하고 싶어서요.

알려 주세요. :slight_smile:

3개의 좋아요

네, 정확히 그겁니다. Firefox에서는 토픽을 클릭하면 마지막에 읽은 위치로 포커스가 깔끔하고 안정적으로 돌아옵니다. 하지만 Chrome에서는 그렇지 않아요.

감사합니다.

2개의 좋아요

안녕하세요,

제가 이 문제를 게시했을 때 재현되지 않았는데, 다른 분들도 같은 현상을 겪고 계시다니 다행입니다. 저는 다른 이유로 Firefox 사용을 중단했고, 이 동작에 익숙해져서 살아가고 있지만, 기대하는 동작으로 변경되어 정말 좋았을 것 같습니다.

클라우스 드림

1개의 좋아요

확인해 주셔서 감사합니다, @nolan, @thoeg. :+1:

팀에서 이 문제를 확인 중입니다. 과거에는 문제를 재현하는 데 어려움이 있었는데, 이제는 Chrome에 초점을 맞춰 조사를 진행할 수 있게 되었습니다.

여기서 업데이트를 공유해 드리겠습니다. :slight_smile:

2개의 좋아요

와. 디스코스에서 핵심 개발자 커뮤니티의 반응 속도에 완전히 감탄했어요!

일부 사람들에게는 사소한 일처럼 보일 수 있지만 — 정말로 — 모든 분들이 함께 즐기실 수 있도록, 여러분이 보여준 인간적인 면모를 꼭 칭찬하고 싶어요!!!

이게 바로 오픈소스와 협업 정신이 얼마나 좋은지, 제가 정말 사랑하는 부분이에요!!!

4개의 좋아요

확인해 보았더니, 포커스 문제가 가끔 스레드 내 특정 주제로 이동하는 것 같고, 지금은 작동하는 듯하지만 항상 그런 것은 아닙니다. 그러다 보니 어딘가에서 회귀(regression)로 보이는 문제가 떠올랐습니다.

토픽의 각 게시물 아래에는 여러 버튼이 있습니다.
예를 들어, ‘좋아요’ 버튼인데, 단순히 '좋아요’를 누를 수 있는 옵션이 아니라 "이 게시물을 좋아합니다"라고 표시됩니다.
그리고 "게시물 번호 XX에 답장하기"라는 텍스트가 있는데, 이 텍스트가 번역되지 않았습니다. 즉, 답장 부분의 문자열이 덴마크어 번역에서 'reply’로 남아 있습니다. 그래서 여기에는 관련이 있는 두 가지 문제가 있습니다.

클라우스

늦어서 죄송합니다, Nolan. 방금 NVDA(Assistiv Labs라는 온라인 서비스를 통해)로 테스트해 봤는데, 제 환경에서는 Firefox와 Chrome 모두에서 잘 동작하는 것 같습니다. 뒤로 이동하는 단축키를 사용할 때, 이전에 열었던 게시물에 포커스가 맞춰져 있음을 확인할 수 있었습니다.

테스트 환경은 Chrome 115, NVDA 2023.1입니다.

이 문제를 일관되게 재현할 수 있는 특정 단계가 있나요?

다음과 같은 단계를 시도해 보겠습니다. Chrome과 Edge에서는 매번 문제가 발생합니다:

열기:
https://meta.discourse.org/tag/accessibility

첫 번째 주제가 있는 테이블로 이동합니다.
“3D”라고 표시된 마지막 열로 포커스를 이동합니다.
활성화되면 해당 스레드의 마지막 주제로 포커스가 이동해야 합니다.
문제는 Chrome과 Edge에서는 그렇지 않지만 Firefox에서는 이동한다는 점입니다.

1개의 좋아요

@thoeg 버튼 텍스트는 다음을 통해 사용자 지정할 수 있다고 생각합니다.

안녕하세요,

하지만 사용자로서는 해당 텍스트가 오해의 소지가 있으며 여러 사이트에 표시되고 있어, 이는 또 다른 접근성 문제입니다.

하지만, 현재 겪고 계신 문제를 해결하려면, 사용자가 계신 Discourse 포럼의 관리자가 해당 포럼의 버튼 텍스트를 변경할 수 있습니다. 관리자에게 연락해 보실 수 있습니다.

따라서 이는 Discourse 소프트웨어의 문제는 아닙니다.

다만, 버튼 텍스트가 모두 동일하여 다소 혼란스럽다는 여러분의 의견에 동의합니다 — 구체적인 개선 사항이나 해결책을 제안할 수 있다면, 이 문제를 새로운 주제로 시작해 보시는 것도 고려해 보실 수 있습니다?

안녕하세요!

어떤 스크린 리더를 사용하시나요? 이 기능은 사용해 본 적이 없어서 잘 모르지만, 조금 더 알아보고 이 문제를 살펴보고 싶습니다 :slight_smile:

Claus님, 감사합니다. 이 문제를 재현할 수 있습니다! 동작을 보여주는 영상이 있습니다(0:09에서 마지막 게시글에 파란색 점선 테두리가 표시되어야 하지만 작동하지 않습니다.)

또한 Firefox를 포함한 모든 브라우저에서 두 번째 문제를 발견했습니다. 동일한 단계를 수행하되 마지막 게시글이 작은 게시글(종료된 주제, 자동 알림, 할당 사항 등)인 주제에 도달하면, 포커스가 마지막 게시글에 올바르게 설정되지 않습니다.

조금만 있으면 이 문제를 조사하겠습니다.

3개의 좋아요

방금 위에서 논의한 두 항목에 대한 수정 사항을 병합했습니다. @nolan @thoeg 참고용으로 PR 링크를 공유합니다: A11Y: Fix selecting topic when navigation via keyboard - Pull Request #22996 - discourse/discourse - GitHub (이 PR은 약 1시간 후 메타 사이트에서, 그리고 이번 주 후반에 다른 사이트에서 적용될 예정입니다).

1개의 좋아요

말씀하신 대로 이 수정이 이미 일찍 배포되었다면, 제 문제는 해결되지 않았습니다. 오늘 Chrome과 Edge에서 JAWS와 NVDA를 모두 사용하여 설명하신 대로 테스트해 보았습니다. 화면 낭독기마다 포커스가 정확히 어디에 위치하는지가 다르지만, 주제 내의 최신 게시물에 포커스가 있어야 할 위치에 올바르게 위치하지 않습니다.
Claus

1개의 좋아요

저의 테스트 결과, Windows 환경에서 Chrome과 NVDA를 함께 사용할 경우 포커스가 토론의 마지막 답변에 떨어집니다. 포커스된 요소가 화면에 표시되지 않는 이유는 포커스를 전환하기 위해 숨겨진 요소를 사용하고 있기 때문인데, 토론으로 이동한 후 Tab 키를 누르면 항상 게시글 작성자의 요소에 포커스가 맞춰집니다.

답변이 늦어 죄송합니다. 여행 중이었고 이제야 일을 정리하고 있습니다.

이것이 자명한 내용이고 이미 그렇게 하고 계셨다면 죄송합니다. 하지만 시각에만 의존하기보다는 NVDA가 주제 항목을 클릭할 때 말하는 내용을 들어보시는 것을 제안합니다.

https://meta.discourse.org로 가서 Firefox에서 환영 게시물을 클릭하면, NVDA가 처음 말하는 것은 사용자 이름, 게시물 날짜 등을 포함하는 헤딩 레벨 1입니다.

Chrome에서 비슷한 작업을 하면 아무것도 말해지지 않습니다. 포커스가 시각적으로 올바르게 이동하는 것 같지만, 어떤 이유에서인지 음성 출력이 되지 않습니다.

이것은 Chrome과 Firefox의 접근성 구현 방식의 차이일 수 있습니다. 두 브라우저 모두에서 '뒤로’를 누르면 포커스가 활성 게시물에 올바르게 이동하며 그 내용이 음성으로 출력됩니다. 하지만 Chrome에서 게시물을 로드한 후 h 키를 몇 번 눌러 뒤쪽의 다른 주제로 이동하고, '뒤로’를 누른 다음 다시 해당 게시물을 클릭하면, h 키를 누를 때 마지막 읽은 위치가 아니라 첫 번째 보이는 게시물로 이동하는 것 같습니다. 이 현상은 여러 Discourse 호스팅 포럼에서도 동일하게 나타납니다.

이것은 타이밍 문제처럼 느껴집니다. 접근성 관련 코드가 포커스를 시도하는 요소가 DOM에 존재합니까? 포커스 설정 전에 약 50ms 정도의 짧은 setTimeout을 추가하는 것이 해결책이 될 수 있을까요? 일반적으로 저는 이런 유형의 문제에 이렇게 접근하지만, 제 추측이 틀렸을 수도 있습니다.

이 부분에 대한 모든 노력에 감사드립니다.

2개의 좋아요