토픽에서 1단계 마크다운 헤딩(#)을 사용하면 HTML 출력에서 h1로 생성되나요, 아니면 h2로 생성되나요?
<h1>를 출력합니다 ![]()
그렇다면 Discourse가 페이지에 여러 개의 <h1> 태그가 있는 것을 권장한다는 뜻인가요? 토픽 제목이 h1이라면, 해당 토픽 내부의 1단계 제목은 기본적으로 h2여야 하지 않나요?
Discourse는 아무것도 가정하지 않으며, 요청한 내용을 그대로 출력합니다.
게시물 내에서 최상위 제목으로 ###을 사용하는 것이 더 나은 관행임이 확실합니다 ![]()
수정: Use of H1 vs. H2 headings in composer - #16 by Canapin 참고
#을 1단계 헤딩으로 설정하지 않으면 우리가 스스로 할 수 있는 "사용자 교육"을 생략할 수 있을 것 같다는 생각이 드네요… ![]()
이를 변경할 방법이 있는지 아시나요? 아니면 최소한 툴바에서 1단계 헤딩을 숨길 수는 없나요? (Markdown을 직접 작성하는 사람들이 현실적인 교육 대상이 될 것이라고 추측하고 있습니다…)
네, 꽤 간단합니다. 리스트 요소에는 data-name="heading-1"이라는 속성이 있어 CSS로 이를 표적 지정할 수 있습니다. ![]()
히히 - 나도 방금 확인하고 있었어. 간단한 테스트 결과, 이 코드가 마크다운과 리치 텍스트 에디터 모두에서 H1 옵션을 숨긴다:
button[data-name="heading-1"] {
display: none;
}
(이걸 그대로 유지할지도! 에디터에서 H1을 제공할 이유가 별로 없는 것 같아서.)
그 점은 이해합니다. 하지만 이는 Discourse가 특정 방향으로 굳이 결정했다는 것은 아닙니다. Discourse는 CommonMark라는 마크다운 규약을 따르며, 이 규약은 #가 H1로 변환되어야 한다고 규정하고 있습니다. 마크다운 제목이 HTML 태그로 변환되는 방식에 대한 이 규정은 주요 마크다운 사양 전반에서 꽤 표준적인 것이라 생각합니다.
솔직히 <h1> 헤딩이 두 개라는 건 그렇게 큰 문제가 아닙니다. 이미 오래된 SEO 미신에 가까워서, 꽤 오래전부터 더 이상 이슈가 되지 않고 있거든요. Google 등은 첫 번째 헤딩이나, 가장 적합하다고 판단되는 것을 사용합니다.
콘텐츠 관점에서 두 개의 메인 헤딩이 최선의 선택인지에 대해서는 논의해 볼 수 있지만, 플랫폼이 주제 이름과 게시글 내 헤딩에 서로 다른 스타일을 적용한다면 실제로는 큰 의미가 없습니다.
그래도 게시글에서는 ##/<h2>를 사용하는 것이 더 적합합니다. 하지만 실제로 아무 역할도 하지 않기 때문에, 제 생각에는 “잘못된” 헤딩을 사용할까 봐 두려워하는 사용자들을 위해 그런 헤딩을 피할 수 있는 다른 헤딩을 사용하는 것이 더 낫다고 봅니다. ![]()
그래서 그게 문제인 거예요. 제 입장에서는 1단계 헤더를 먼저 사용하는 게 자연스러운데, 테마가 같은 전제 하에 스타일이 적용되지 않으면 엉망이 되죠. 여기 어딘가에서 뭔가 어긋나는 부분이 있는 것 같아요.
(참고: 제가 개입하지 않았는데도 문서가 영어로 표시되고 있는 건가요?!?)
맞아요, 자연스럽고 웹 페이지를 처음부터 만드는 경우에는 그럴 수 있습니다. 하지만 CMS나 게시 시스템은 거의 항상 페이지의 H1을 제목 필드에서 가져오기 때문에, 콘텐츠 섹션에는 보통 H2를 사용하게 됩니다.
(그리고 저는 웹 브라우저의 번역 도구를 사용해 영어를 확인했습니다.)
동의합니다. 하지만 제 생각에는 커뮤니티 멤버들이 그걸 알아야 한다는 기대를 해서는 안 됩니다.
네 – 그리고 H1 옵션을 단순히 숨기는 것에는 단점이 없다고 봅니다.
다만 대부분의 사용자들이 일반적인 게시글을 작성할 때 헤딩을 많이 사용하지는 않는 것 같습니다. 더 긴 문서형 토픽을 작성하는 분들은 아마 ##와 그 “TT” 아이콘에 대해 조금 더 익숙하거나, 곧 익숙해질 것입니다.
그리고: 제목은 주제(topic)에서만 사용되고, 답변에서는 사용해서는 안 된다는 제기가 담긴 흥미로운 오래된 토론을 방금 발견했습니다: Disable headers in replies like h1 and h2
혹시 관심 있으신 분을 위해, 이 작은 스니펫은 답변을 작성할 때에만 작성기에서 “TT” 제목 아이콘을 완전히 숨깁니다:
.composer-action-reply button.heading {
display: none;
}
제목(Heading)은 SEO만을 위한 것이 아니라 접근성(Accessibility)에도 중요합니다.
스크린 리더는 제목에서 제목으로 이동할 수 있으며, 키보드 단축키를 통해 제목의 위계(깊이)를 지정할 수 있습니다.
토픽에는 각각 <h1> 제목이 있지만, 모든 답변에는 스크린 리더에서 보이는 숨겨진 <h2>가 앞에 붙습니다:
<h2 aria-hidden="false" class="sr-only" id="post-heading-9">
post by Jagster 4 hours ago
</h2>
따라서 어떤 경우든 콘텐츠에 <h1> 또는 <h2> 제목을 게시하더라도, 항상 이미 존재하는 <h2>의 자식 요소(descendant)가 됩니다 ![]()
따라서 게시물에서 <h3>보다 상위 제목을 사용하면 스크린 리더 내비게이션이 다소 어색해질 수 있다고 생각합니다.
기존 토픽들 사이에서 일관성은 없지만, #customization:플러그인 의 게시물 템플릿은 최상위 제목으로 <h3>을 사용합니다:
| | | |
| - | - | - |
| :information_source: | **요약** | 이 플러그인이 무엇을 하는지 몇 마디로 설명해 주세요. |
| :hammer_and_wrench: | **리포지토리 링크** | <> |
| :open_book: | **설치 가이드** | [Discourse에서 플러그인 설치 방법](https://meta.discourse.org/t/install-plugins-in-discourse/19157) |
<br>
### 기능
플러그인의 주요 기능을 설명해 주세요
### 설정
플러그인을 설정하는 방법에 대한 자세한 단계를 포함해 주세요 (필요한 경우 스크린샷 포함)
### 설정 항목
설정 항목과 설명을 담은 표를 포함해 주세요
| 이름 | 설명
|-|-|
|
흥미롭게도, #customization:테마 와 #customization:테마-컴포넌트 템플릿의 경우 그렇지 않습니다. 하지만 해당 템플릿에는 제목이 포함되어 있지 않습니다. 아마도 이 부분을 변경해야 할 것 같습니다.
동의합니다. 저도 좀 더디기라 할 수 있고, 제목 위계를 깔끔하게 유지하는 걸 좋아합니다.
사실 게시글에서는 제대로 하려면 h3, h4, h5만 사용해야 합니다. 이 문제를 ‘수정’해 주는 테마 컴포넌트가 있으면 흥미로울 것 같은데, 그러면 버튼에서 상위 제목 레벨을 제거하고, 주제에서 h3 이하의 스타일링을 ‘변환’해서 우리가 사용할 때 제대로 보이도록 해야 할 텐데요…?


