Textile 각주와 약어

자주 사용되거나 중요하다고 생각되는 Textile 태그들에 대해서는 거의 정리가 끝났네요^^ 그래서 자주 사용하지는 않지만 알아두면 편리한 몇 가지 기능들을 살펴보고 Textile 사용법을 마무리하려 합니다.

먼저 각주(footnote)를 글에 쉽게 넣을 수 있도록 해주는 태그를 알아보지요. 다른 태그들이 그렇듯이 문법은 간단합니다.

이 단어[1]에 대한 설명이 필요합니다.[2]
fn1. 단어의 의미
fn2. 상세한 설명
<p>이 단어<sup class="footnote"><a href="#fn30013461cba499ffc2">1</a></sup>
에 대한 설명이 필요합니다.
<sup class="footnote"><a href="#fn12594461cba49a0004">2</a></sup></p>
<p id="fn30013461cba499ffc2" class="footnote"><sup>1</sup> 단어의 의미</p>
<p id="fn12594461cba49a0004" class="footnote"><sup>2</sup> 상세한 설명</p>

소스가 복잡하네요^^; 우선 화면에 어떻게 표시되는지 볼까요? 시각 효과를 위해 적당히 CSS를 적용했습니다.

이 단어1에 대한 설명이 필요합니다.2


1 단어의 의미

2 상세한 설명

대괄호로 둘러싼 숫자에 링크를 걸고 설명이 있는 단락에 책갈피(anchor)를 만드는 방식으로, 각각의 책갈피에는 중복을 방지하기 위해 임의로 생성된 id가 부여됩니다.

그런데 설명이 있는 단락에는 용어 정의가 있는 곳으로 돌아가는 링크가 없답니다. Textile 포럼에 이에 대한 논의가 있는데 간단히 요약하면 용어 정의가 두 번 이상 반복해서 사용될 경우에 문제가 발생할 수 있기 때문에 기능을 제한했다는 얘기더군요. 물론 이렇게 사용되는 경우는 극히 드물겠지만요.

Textile의 각주 기능을 잘 사용하기 위해서는 몇 가지 주의할 점이 있는데 첫 번째가 fnn. 태그가 각각 하나의 단락(paragraph)으로 이루어진다는 사실입니다. Textile 사용법에 관한 첫 글에서 설명했듯이 각각의 단락을 구분짓는 것이 빈 줄이기 때문에 위의 예처럼 각각의 태그 사이에 빈 줄을 넣어주셔야 합니다.

두 번째는 대괄호 안에 띄어쓰기 없이 숫자를 넣으면 fnn. 태그가 없어도 무조건 각주로 인식한다는 점입니다. 이해를 돕기 위해 몇 가지 Textile 입력과 화면 출력의 예를 들어보겠습니다.

이[1] 단어[2]에 대한 [3]설명이 필요합니다.[4]
1 단어2에 대한 [3]설명이 필요합니다.4

즉, 대괄호와 숫자를 그냥 표시하려면 반드시 앞에 띄어쓰기가 있어야 된다는 얘기입니다. 하지만 ‘반드시’라는 조건이 자유로운 표현을 막아서는 안되겠지요. 그래서 대안이 있는데 바로 == 태그입니다. 사실 이 태그를 지금껏 소개하지 않았던 이유는 단 한 가지입니다. 제가 명확하게 이해를 못했기 때문이지요^^;

일단 이 태그는 기본적으로 notextile. 태그처럼 글의 특정 부분을 Textile이 해석하지 않도록 하기 위해 사용됩니다. 차이가 있다면 notextile. 태그처럼 블록을 만들지 않고 인라인 스타일처럼 적용된다는 것이지요. 일단 몇 가지 예를 들어보겠습니다.

*강조* ==*강조*== [*강조*] [==*강조*==]
==h1. Textile _적용_ 금지==
이[1] 단어에==[2]== 관한 설명이[==3==] 필요합니다.
이[1] 단어에 ==[2]== 관한 설명이[==3==] 필요합니다.
강조 *강조* 강조 [*강조*]
h1. Textile _적용_ 금지
이1 단어에==2== 관한 설명이[3] 필요합니다.
이1 단어에 [2] 관한 설명이[3] 필요합니다.

첫 번째 예는 == 태그의 적용 방식을 보여줍니다. * 태그나 _ 태그가 대괄호를 이용해서 태그의 시작과 끝을 표시할 수 있는데 반해 == 태그는 대괄호를 무시한다는 점에 주의해야 합니다. 앞선 글에서 설명했듯이 이 대괄호는 한글을 사용할 때 발생하는 문제점을 해결하는데 사용됩니다. 따라서 == 태그 앞에 띄어쓰기가 없을 경우에는 의도했던 것과는 다른 결과가 발생할 수 있습니다.

세 번째와 네 번째 예에서 이 차이를 분명히 확인할 수 있습니다. 또한 대괄호 안의 숫자에 == 태그를 적용해서 해당하는 부분을 각주로 인식하지 않게 할 수 있다는 사실도 알 수 있지요. 즉, 띄어쓰기 대신 대괄호로 태그의 시작을 표시할 수 있지만 * 태그와는 달리 대괄호도 그대로 화면에 출력해준다는 얘기입니다.

물론 Textile로 문서를 작성할 때 의도하지 않았던 태그가 적용되는 경우는 많지 않습니다. 제가 드는 예는 이런 문제점을 일부러 부각시킨 경우가 대부분이지요. 하지만 일단 문제가 생기고, 해결되지 않는다면 Textile을 계속 사용하기 힘들겁니다. 그래서 == 태그나 notextile. 태그를 적절히 사용하는 것이 중요하지요.

만약 이 두 태그 사용에 어려움을 느낀다면 간단히 다음과 같은 방법을 따르면 됩니다.

“의도하지 않은 태그가 적용될 경우에는 해당 부분을 notextile. 태그로 시작하고 내용은 직접 html 태그를 사용해서 입력한다.”

다시 말씀드리지만 이런 경우는 극히 드뭅니다. 그러니 이런 이유로 Textile의 편리함을 포기해서는 안되겠지요? ^^;

마지막으로 머리글자를 이용한 약어 표기법(acronym)을 알아보겠습니다. 무척 간단하니 예만 봐도 아실겁니다.

CSS(Cascading Style Sheet), XML(eXtensible Markup Language)
<acronym title="Cascading Style Sheet"><span class="caps">CSS</span></acronym>,
<acronym title="eXtensible Markup Language"><span class="caps">XML</span></acronym>

브라우저 화면에 어떻게 표시되는지 한 번 볼까요?

CSS, XML

열심히 입력한 약어에 대한 설명이 안보이네요. 하지만 마우스를 머리글자 위에 올리면 사라졌던 설명이 표시되는 것을 볼 수 있습니다. 바로 html의 <acronym> 태그가 적용되었기 때문이지요. 브라우저에 따라서 이 태그를 보여주는 방식이 다른데 위 예에서는 시각 효과를 위해 다음과 같은 CSS 스타일을 적용시켰습니다.

acronym { border-bottom: 1px dotted #699; cursor: help; }

또한 CSS와 XML이라는 텍스트에는 caps라는 class가 적용되는데, Textile에서는 석 자 이상의 알파벳 대문자가 이어질 경우에 자동으로 이 클래스가 적용됩니다. 글자 간격 같은 스타일을 적용하기 위해서라고 하는데 한글을 사용하는 입장에서는 가뿐히 무시하셔도 좋습니다^^

그러면 이번에는 어떻게 해야 <acronym> 태그가 자동으로 적용되는 것을 방지할 수 있는지 알아볼 차례겠지요? 앞서 설명한 == 태그를 사용하면 간단히 해결됩니다. 알파벳 약어는 앞에 띄어쓰기가 항상 있으니까 특별히 문제될 것도 없지요.

==CSS(Cascading Style Sheet), XML(eXtensible Markup Language)==
CSS(Cascading Style Sheet), XML(eXtensible Markup Language)

이 기능은 알파벳 약어를 사용할 경우에만 적용되지만 약어 설명에는 한글도 쓸 수 있습니다. 아래 약어 위에 마우스를 올리면 확인할 수 있습니다.

CSS, XML

이렇게 해서 Textile 사용법에 관한 글을 모두 마칩니다. 빠진 부분도 있고 대충 넘어간 부분도 있지만 그래도 Textile에 관심을 갖고 찾아오신 분들께 도움이 되었으면 하는 바램입니다.

혹시라도 궁금한 점 있으면 언제든지 댓글이나 메일 주세요~

Textile 관련 글 안내

  1. 시작하기
  2. 링크와 한글 입력
  3. 이미지 태그
  4. 리스트와 표
  5. 코드 출력과 인용문
  6. 각주와 약어

댓글 2개가 달렸습니다. 태그: , , ,

  1. 연가시 | 2007-04-13 02:14

    abbr 은 적용할 방법이 없는걸까요?
    포럼을 뒤져봐도 없다는 식으로 이야기를 하는 듯 한데.

  2. wystan | 2007-04-13 11:26

    Textile 소스를 수정해서 acronym 태그 대신 abbr 태그를 사용하도록 할 수는 있습니다.

    찾아보니 이 두 태그에 관한 흥미로운 글들이 많더군요. 그래서 다음 포스팅 주제로 다뤄볼까 합니다. abbr 태그 적용 방법에 대해서도 그 때 말씀드리지요.

댓글이 닫혔습니다.