이미지 캡션 지원 - 대체 텍스트와 함께

기여 기능
1

Continuing the discussion from How to add a description for uploaded images?:

I came looking for a way to add a caption—visible to all—to an image. (<figcaption>)

alt vs. caption

I love that Discourse supports alt text for sight-impaired readers, but they’re effectively unavailable to sighted readers. Sighted readers don’t neccessarily need the same full image description, but would often be served by a bit of context, e.g. What movie is that screenshot from? What’s the title of that artwork?

The search was complicated a bit by the fact that “caption” is often used here when discussing image alt text. Even the Discourse AI feature is called “Caption with AI.” This point is made in a discussion of the manual “captioning” (alt text) method.

syntax

The parent thread ends in 2019 with:

I found some old relevant topics at CommonMark noting that:

But https://talk.commonmark.org/ is currently bannered with “Please note the CommonMark spec is currently frozen with respect to features” and the image spec doesn’t appear to address the use of captions.

next

Would it be so bad to diverge from CommonMark in this case and implement something in Discourse to support the common <figcaption> tag for images?

Test our new composer!
Encourage/enforce adding image descriptions
2

I’m not an expert on accessibility, but I don’t understand this feature request. What is the difference, effectively, between alt and figcaption and why are you advocating that we diverge from CommonMark? What am I missing?

When I upload a photo, say of my cat, it is given a caption which is associated with the photo. I can then edit the caption to share context.

A gray tabby cat is sitting on a wooden railing outdoors, looking alert and curious with a green, leafy background. (Captioned by AI)
A gray tabby cat is sitting on a wooden railing outdoors, looking alert and curious with a green, leafy background. (Captioned by AI)3024×4032 1.19 MB

The caption is shown on mouseover (desktop) and at the bottom of the photo, when you select it to view it bigger:

Screenshot 2025-06-09 at 7.58.47 AM

1개의 좋아요
3

Hi Tobias – on review, I overstated this part:

Alt text is available to sighted readers – but it requires mouse actions that I don’t typically take when scrolling through topics. Without an “alt” icon present, I’d not even thought to mouse over images to check for the presence of alt text. This actually makes some sense, as alt text isn’t meant to impart additional information, and should be superfluous to sighted users…

I’m not an accesibility expert either, but I see these features serving quite different purposes for both sighted and sight-impaired users.

alt text:

  • encouraged to provide a detailed description of the image for sight-impaired users, as an equivalent to the visuals
  • hidden by default from sighted users – because they can see the image
  • (presumably handled by default by screen readers and other accessibility tools)

figcaption:

  • can provide a title, aside, quote, or other context clue to all users – not neccesarily a full description of what the image depicts
  • is displayed in the flow of the document/post for all users, sighted or otherwise
  • requires no action to view, aside from normal browsing & scrolling

Essentially, alt text replaces the image – tells you exactly what it is. A figcaption can tell you why the author put it there.

Alt text for your image is accurate: “A gray tabby cat is sitting on a wooden railing outdoors, looking alert and curious with a green, leafy background.” (Accessibility folks might suggest even more detail and less subjectivity: “A gray tabby cat sits primly on a wooden bench outdoors, filling the frame and looking at something off-camera. The sunlit, leafy background is blurred while the cat is in the shade with its face in sharp focus.”)

A figcaption, though, might read “Cat with alt text example” – or “Ravenpaw is unconcerned with your pedantry.”

I can’t speak to broader implications of diverging from CommonMark – I just thought that if Commonmark has no plans to implement new features, divergence could be justified for something widely useful.

2개의 좋아요
4

토비아스님, 안녕하세요. 초보입니다. 제 phpBB 보드를 Discourse로 이전하려고 합니다. 이미지를 마우스로 올리면 캡션이 표시되는 기능이 정말 마음에 듭니다. 하지만 업로드할 때 캡션을 어떻게 추가하는지 명확하지 않네요. 혹시 설명해 주실 수 있을까요? 테스트 사이트에 업로드를 시도해 보았지만 성공하지 못했습니다.

물론 이와 관련된 질문도 있습니다. import_phpbb3.sh를 해킹하여 phpBB의 “파일 주석”(첨부 파일에 대한)을 변환된 업로드에 할당함으로써, 마우스를 올리면 캡션이 표시되도록 하는 것이 얼마나 어려운지 궁금합니다. 또한: phpBB에서는 .mp3나 .mp4와 같은 다른 MIME 타입에도 파일 주석을 할당할 수 있습니다. Discourse에서도 이런 기능이 가능한가요?

감사합니다.
Dan

1개의 좋아요
5

내 고양이 사진이 정말 귀엽다는 걸 떠올리게 해줘서 고마워! 내가 예시로 든 것에서는 캡션이 인공지능을 이용해 자동으로 생성되었어. 메타에서도 그런 식으로 처리되는 거라고 생각해. 또한 discourse 기반 사이트에서도 기본적으로 그렇게 할 수 있지. 만약 자가 호스팅 사이트에서 그렇게 하려면, AI를 설정해서 구현해야 해.

6

AI 자동 자막 기능은 7월에 제거되었습니다.


자막을 추가하는 방법은 사용하는 에디터에 따라 다릅니다. 리치 텍스트 에디터에서는 이미지를 클릭한 후, 이미지 아래에 있는 텍스트를 클릭하여 편집하면 됩니다.


마크다운 모드에서는 미리보기의 작은 연필 아이콘을 통해 편집하거나, 에디터에 직접 입력할 수 있습니다.

1개의 좋아요
7

Dan 님, 반갑습니다!

엄밀히 말해, 그것은 캡션이 아니라 이미지 대체 텍스트(alt text)입니다. 시각 장애 사용자를 위해 이미지를 설명하는 용도로 사용됩니다. (저도 Dan 님을 위해 편집 화면 캡처를 준비하고 있었는데, Moin 님이 먼저 하셨습니다.)

phpBB 가져오기 시 파일 주석 처리에 대한 질문은 이 스레드에서 놓칠 수 있으므로, 관련 지원 토픽으로 별도의 질문을 하는 것이 더 적절합니다.

1개의 좋아요
8

안녕하세요, 정말 감사합니다! 멋진 기능이에요. Todd님, 말씀하신 대로 맞습니다. phpBB 가져오기에 대해 문의할 적절한 장소를 찾아보겠습니다.

gif에 텍스트를 추가할 수는 있지만, 마우스를 올리면 표시되지 않는다는 점을 참고해 주세요. 다만 제 보드에서는 gif를 자주 사용하지는 않습니다. phpBB에서는 .mp3와 .mp4에 댓글을 추가할 수 있지만, Discourse에는 텍스트를 추가할 수 있는 그런 옵션이 없는 것 같습니다. 댓글이 달린 첨부 파일들을 .sql 백업 파일에서 찾아내어 어떻게 처리할지 결정해야겠어요.

Discourse에 기대가 크고, 제 보드를 21세기로 이끌어갈 준비가 되어 있습니다! :zany_face:

-Dan

9

CommonMark에 대한 언급, Todd 님 감사합니다. 저는 이전까지 이 표준에 대해 몰랐는데, 이제 이 스레드가 훨씬 더 이해가 됩니다.

저는 22년째 phpBB 보드를 운영해 왔으며, 그동안 제 필요에 맞게 갤러리 표시, 인라인 PDF 지원, Litebox, 캡션( Litebox 사용/미사용) 등을 위해 코드를 상당히 개조(hack)해 왔습니다. figcaption에 대해 언급하시자마자 기억이 났습니다. 제가 직접 개조한 attachment.html 템플릿의 일부 코드 조각을 공유합니다:

  `<figure><a data-fancybox="gallery1" href="{_file.U_DOWNLOAD_LINK}" data-caption="{_file.COMMENT}"><img src="{_file.THUMB_IMAGE}" class="postimage" alt="{_file.DOWNLOAD_NAME}"  title="{_file.DOWNLOAD_NAME} ({_file.FILESIZE} {_file.SIZE_LANG}) {_file.L_DOWNLOAD_COUNT}" /></a>
  <!-- ENDIF -->
  <!-- IF _file.COMMENT --><figcaption>{_file.COMMENT}</figcaption><!-- ENDIF -->
  </figure>`

우리의 친구 figcaption입니다.

이제 저는 phpBB를 떠나야 할 때인 것 같습니다. 이 플랫폼은 더 이상 제 용도에 맞지 않게 되었고, Discourse가 훨씬 더 견고한 플랫폼입니다. 하지만 - CommonMark에 대해나 왜 이를 따르는 것이 좋은지에 대해 권위 있는 의견을 내지는 못하지만 - Discourse에서 이미지, PDF, 동영상, 오디오 등에 캡션을 달 수 없다는 점은 저에게는 심각한 결함입니다. 어떻게 처리하든, 이에 대한 어떤 방식의 지원은 있어야 합니다.

제 소견입니다.
-Dan

3개의 좋아요
10

죽은 말과 채찍질에 대하여:

caption
caption1145×659 213 KB

제 phpBB 보드의 ‘Garage’ 카테고리 내 ‘How To’ 하위 카테고리에서 가져온 스크립트입니다. 썸네일을 클릭하면 Fancybox에서 이미지와 함께 댓글이 팝업으로 표시됩니다. 텍스트는 게시글과/또는 댓글에 표시될 수 있으며, 이를 통해 깔끔하고 정돈된 구성을 만들 수 있습니다.

Discourse에서 이러한 기능이 누락되어 있어 제 작업이 완전히 멈춰 버렸습니다. 이 문제를 우회할 수 있는 방법이 떠오르는 분이 계신다면, 기꺼이 듣고 싶습니다.

-Dan