이미지 설명 추가를 장려하거나 강제하기

스크린리더를 사용하는 사람들이 Discourse를 사용할 수 있도록, 항상 이미지 설명을 추가하는 관행을 갖고 있습니다. 이미지 설명을 추가하는 데 도움이 되는 최선의 방법은 무엇일까요?

예를 들어, 이미지 설명을 추가하도록 안내하는 도움말 텍스트를 표시할 수 있을까요?

“이미지를 추가했습니다! 주제를 생성하기 전에 이미지 설명을 추가해 주세요.”

그리고, 대체 텍스트(alt-text)는 어떻게 추가하나요?

이미지 설명에 대해 더 알아보기
https://uxdesign.cc/how-to-write-an-image-description-2f30d3bf5546
https://livingwithdisability.tumblr.com/post/124066767358/all-about-image-descriptions

3개의 좋아요

좋은 질문입니다. 저도 이 부분에 대해 궁금해했습니다. 파일명이 이미지 설명을 생성하는 데 사용되는 것 같습니다. 업로드 후에는 마크다운에서 이를 조정할 수 있습니다. 이미지와 함께 게시물을 볼 때 마우스를 올리거나 클릭하면 이미지를 크게 볼 수 있으며, 하단에 설명이 표시됩니다. 하지만 이 설명이 스크린 리더에서 어떻게 작동하는지는 알지 못합니다.

이것이 가능해지면, 특히 이것이 중요한 커뮤니티에서는 이러한 설명을 개선하는 문화를 만들 수 있고, 관리자는 게시물을 수정하여 설명을 개선하거나 사용자를 교육하기 위해 개인 메시지를 보낼 수도 있습니다.

![발효槽에서 일주일간 발효된 아일랜드 스타우트, 병에 담을 준비 완료|375x500](upload://rW0hzxtwAluwFC6TAY07KT7J8IK.jpeg) 

4개의 좋아요

이 글을 다시 올려봅니다.

@codinghorror 기술적 개선 사항을 구체적으로 요청할 곳이 있을까요? 사용자가 파일 이름을 바꾸거나 마크업을 직접 입력하도록 요구하는 것은 애초에 불가능합니다. 이러한 기법은 발견하기가 전혀 어렵고, 설령 그렇지 않더라도 대부분의 사용자가 넘기 힘든 장벽입니다. 대체 텍스트(alt text) 추가는 이미지 업로드 시 명확하고, 간단하며, (가장 중요한 것은) 정상적인 작업 흐름의 일부여야 합니다. 이를 통해 보조 기술을 사용하는 사용자들도 참여할 수 있습니다. 제 생각에는 가장 좋은 해결책은 이미지 업로드 시 설명 텍스트를 입력하도록 묻는 팝업을 표시하는 것입니다. 그리고 최소한 저희 포럼의 경우, 비어 있지 않은 텍스트를 입력하는 것을 의무로 설정할 수 있는 옵션도 있으면 좋겠습니다.

7개의 좋아요

음, 그걸 위해서는 플러그인이 필요할 것 같아요. Marketplace 채널에서 시작해 보는 건 어떨까요?

@codinghorror 접근성이 나중에 덧붙이는 것이 아니라 Discourse에 처음부터 직접 통합되어야 하는 1급 관심사임을 전달하고 싶었습니다. (그 외에도 최근 비공식 플러그인과 실패한 업그레이드로 인해 매우 나쁜 경험을 한 이후로, 우리는 공식 플러그인만 설치합니다).

2개의 좋아요

팝업은 거의 사용성을 향상시키지 않기 때문에, 그 의견에 동의하기 어렵습니다.

현재 클립보드에서 붙여넣을 때 다음과 같이 처리합니다:

테마 컴포넌트를 구축할 수 있습니다(여기서는 플러그인이 필요하지 않습니다).

  • 큰 빨간색 팝업을 추가합니다.
  • 업로드 후 'image’라는 단어를 강조 표시합니다.
  • 인터스티셜 페이지를 도입합니다.

핵심 변경 사항을 고려하기 전에 먼저 테마 컴포넌트부터 시작하는 것을 제안합니다.

4개의 좋아요

이러한 요소가 포함된 테마 컴포넌트를 알려주실 수 있나요? 대체 텍스트/이미지 설명 테마 컴포넌트 워크플로우가 어떻게 될지 파악하기 위해 하나를 직접 다루어 보고 싶습니다.

다만, 이벤트가 작동하는 방식과 유사한 플러그인이 가장 좋다고 생각합니다. 이미지를 삽입하면 폼이 열리고, 여기에 대체 텍스트와 이미지 설명을 입력하는 방식입니다. 그런 다음 제출 버튼을 누르면 이미지가 자동으로 올바르게 포맷되도록 하는 것입니다.

핵심 변경 사항보다 먼저 테마 컴포넌트부터 시작하는 것을 제안합니다.

답변이 늦어 죄송합니다. 저는 항상 Discourse 개발이 신중하고 철저하다고 생각해 왔고, 다른 스레드들에서 느낀 점도 접근성이 우선시되고 있다는 인식을 주었습니다.

그래서 여기서 보이는 주저함이 솔직히 이해가 가지 않습니다. 현재 사용자들의 상황을 설명하자면, *“원하거나 기억하더라도 추가하기가 거의 불가능하다”*고 할 수 있고, 관리자 입장에선 *“알려 주거나 장려하는 것이 완전히 불가능하다”*고 할 수 있습니다. Alt 태그를 더 단순하고 쉽게 만드는 것은 모든 Discourse 인스턴스의 접근성에 도움이 되는, 쉽게 얻을 수 있는 이점처럼 보입니다. 모든 곳에 내장되어 있어야 합니다. $0.02

3개의 좋아요

게시물을 차단하는 블로킹 인터스티셜을 만들 수도 있겠네요. 기본 이미지 설명이 파일명과 동일하다는 걸 알고 있으므로, 감시 단어(watched words)를 통해 이걸 할 수 있을 것 같습니다.

![super_breakout_1680x1050|690x431](upload://kVEmM01Hth0lkki06JdIsR4do5P.jpeg)

1개의 좋아요

이것은 AI 자동 라벨러의 흥미로운 대상이 될 수 있습니다.

개인적으로는 이 설정들이 존재할 것 같습니다.

  • 이미지 업로드 시 설명 입력 프롬프트 표시 (기본값: 켬)
  • AI 서비스를 사용하여 이미지 설명 자동 입력 시도 (기본값: 꺼짐)

개인적으로 인간이 검토하지 않은 상태에서 자동화된 AU(대체 텍스트) 라벨이 제출되는 것은 원하지 않습니다.

그럼에도 불구하고, 이미 3년이 지났지만 Discourse가 이미지 업로드의 접근성 옵션을 간소화하는 기능을 내장할 가능성에 대해 다소 회의적입니다.

저희는 이미지 중심의 포럼은 아니지만, 방금 이미지를 업로드할 일이 생겼고, 어떻게 작동하는지 확실하게 확인하기 위해 Meta에 와서 대체 텍스트 기능을 찾아봐야 했습니다. 기능이 매우 직관적이지 않습니다.

요즘 웹 개발 전반에서 접근성에 대한 강조가 커지면서 저의 인식도 높아졌습니다. Discourse에서 업로드 시 대체 텍스트를 입력하도록 프롬프트를 표시하고, 이를 필수로 설정할 수 있는 옵션을 제공하면 좋겠습니다.

2개의 좋아요

조금 관련이 있는 내용이지만, Discourse AI는 이제 게시글에 대체 텍스트가 없는 이미지를 감지할 때 사용자가 AI 생성의 자동 이미지 캡션을 활성화하도록 한 번 프롬프트를 표시합니다.

그것도 의미 있는 시도이지만, AI 기능이 없는 포럼에서도 저자를 위한 프롬프트를 제공했으면 합니다.

(디스커스 AI를 탓하려는 것은 아니지만, 지금까지 AI 생성 대안 텍스트는 맥락을 무시하고 매우 평이하거나 부정확한 내용을 제시하는 경우가 많아 개인적으로 선호하지 않습니다. AI는 대량의 과거 콘텐츠에 대한 일괄 처리 같은 용도에는 적합할 수 있습니다. 하지만 글이나 대화에서는 단순한 시각적 설명이 아니라, 이미지가 전달하려는 서사적 의도를 저자가 직접 작성한 대안 텍스트를 선호합니다.)

1개의 좋아요

앞으로의 최선의 방법은 커뮤니티가 이를 수행하는 테마 컴포넌트를 개발하는 것입니다. 잘 받아들여진다면 결국 코어에 채택될 수 있습니다.

1개의 좋아요

왜일까요? 특히 접근성(Accessibility)은 Discourse가 선두에 서야 할 분야입니다.

1개의 좋아요

Discourse에는 이미지에 설명을 추가하는 방법이 제공됩니다. 구현 방식이 마음에 들지 않는다고 해서 우리가 앞서가지 못하고 있다는 뜻은 아니에요. :wink:

다른 구현 방식을 원하신다면, 테마 컴포넌트로 직접 구현하시거나 #marketplace에서 누군가에게 의뢰하실 수 있습니다. 현재보다 더 나은 방식으로 작동한다면 코어에 추가됩니다. 많은 개선 사항이 이렇게 코어에 포함됩니다.

그렇다고 해서, 새로운 작성기(composer) 작업의 일환으로 이 UI 영역을 다시 살펴볼 예정입니다. 목록에 올라가 있습니다.

1개의 좋아요

푸터를 추가하는 것을 말씀하시는 건가요, 아니면 ALT 텍스트 같은 것을 말씀하시는 건가요? 특히 시각 장애인을 위해 이미지에 설명을 추가하는 현재 권장 방법이 있는지 확인하려고 여기에 왔습니다.

1개의 좋아요

alt 속성은 이미지 설명으로, 이미지 마크다운 구문 안에 추가하거나 게시글 미리보기의 이미지 섬네일에서 직접 추가할 수 있습니다 :slight_smile:

마크다운 예시:

![이미지는 제품 매니저가 AI 자동 응답기를 논의하는 디스코드 AI 블로그 게시물입니다. 이 기능은 AI를 사용하여 지원 문의에 지능적으로 응답하며, 기능을 위해 디스코드 자동화 및 AI 플러그인이 필요합니다. (AI가 캡션을 생성함)|230x500](upload://6rMT7zREgcFUdeLKbbXXSqOUZLo.jpeg)

3개의 좋아요

저는 이 세부 사항에 대한 제 생각을 계속 다듬어 왔습니다. 시력 있는 사용자에게는 다소 은폐된 alt 텍스트에는 최소한 시각적 묘사가 포함되어야 하며, 서사적 맥락은 이상적으로 figcaption을 사용하여 인라인으로 표현해야 합니다. figcaption은 Discourse에서 아직(아마도?) 사용 가능한 기능이 아닙니다: Support image captions - in addition to alt text.

하지만 현재 우리가 가진 것은 실제로 alt 텍스트인 "이미지 설명"뿐이므로, 이 부분에 대한 프롬프트를 제공하는 것이 여전히 좋을 것입니다.

2개의 좋아요