글 작성 팁 번역

지맘대로프로젝트인 "KLDP 접근성 향상 프로젝트"의 두 번째 작업으로 작성 팁 페이지를 번역해 봅니다. 양이 방대해서 아직 한글화가 안된 것 같은데, Druapl Korea에서 가져다 쓰신다면 쌍수로 환영합니다.

* 아래 내용 중 bbcode의 code 태그는 2006년 5월 중순 현재 다소 비정상적으로 동작합니다. 당분간은 코드를 입력하실 때 <code></code> 태그를 사용해 주시면 되겠습니다. 더불어 cinsk님의 "KLDP(drupal)에 글 쓸 때, 프로그램 소스 붙이기." 글타래에서 고난이도의 코드 올리기 기법을 보실 수 있습니다.

작성 팁

입력 형식:

• 간단한 HTML:
  • 사용 할 수 있는 HTML 태그: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <img>
  • 줄과 단락은 자동으로 인식됩니다. <br /> 줄바꿈, <p> 단락 및 </p> 단락 끝 태그가 자동으로 추가됩니다. 만약 단락이 자동으로 인식되지 않으면 두 개의 빈줄을 추가합니다.
  • 웹 주소와 이메일 주소는 자동으로 링크로 바뀝니다.
  • 코드를 올리려면 <code>...</code> 태그로 감싸 주십시오. PHP 코드의 경우 <?php ... ?>를 이용할 수 있으며 문법에 따라 색깔도 입혀집니다.

  • BBCode 길잡이

    소개

    BBCode를 이용하면 게시물에서 HTML을 사용하지 않고도 글의 형식을 지정해 줄 수 있습니다. BBCode는 PHPBB라는 포럼 소프트웨어에서 유래한 것이며, 이 사이트에서는 이를 나름대로 구현하고 있습니다.

    BBCode 용어로 하자면, "태그"를 이용해서 글에 형식을 지정해 줄 수 있습니다. 모든 태그는 [과 ] 꺽쇄로 둘러싸여 있습니다. 글의 어떤 일부에 표시를 해 주려면 열기 태그와 닫기 태그를 써주어야 합니다. 아래에서 보게 되겠지만, 닫기 태그는 [/으로 시작합니다. 태그를 잘못 입력하거나 닫아 주는 걸 깜빡하면 원했던 형식을 얻지 못하게 됩니다.

    간단한 글 형식 주기

    BBCode를 이용하면 [b](볼드)나 [i](이탤릭), [u](밑줄), [s](가로줄) 태그를 더해 줘서 글의 일부를 강조할 수 있습니다. [color]와 [size], [font] 태그를 이용하면 태그로 둘러싼 부분의 글씨 색깔, 크기, 폰트를 바꿀 수 있습니다. 셋 모두 태그의 이름에 걸맞는 매개변수(어떤 색깔로, 얼마나 크게, 어떤 폰트로)를 등호를 이용해 지정해 주어야 합니다 (예는 아래에). 닫는 태그에서 매개변수를 다시 입력해 주면 안 됩니다!

    [color] 태그의 매개변수로는 잘 알려진 색깔 이름(red, blue, green, white, 등등)을 지정해 줄 수도 있고 십육진수 색깔값(#CDCDCD, #FFFFFF, 등등)을 지정해 줄 수도 있습니다. [size] 태그로는 6에서 48 사이의 폰트 크기를 정해 줄 수 있으며, 6이 최소 크기입니다. 주의할 것은, 너무 큰 글씨는 여러 사람에게 짜증을 일으킬 수 있기에 이 방법을 이용해서 자기 글타래가 관심을 끌게 하는 건 별로 좋을 생각이 아니라는 점입니다. [font] 태그에는 Arial이나 Arial Black, Courier, Courier New, Helvetica, Impact, Times New Roman, Verdana 등과 같은 모든 유효한 폰트를 설정할 수 있습니다.

    사용법	표시 결과
    이 작업을 주말까지 [b]꼭 끝내야 돼요[/b].	이 작업을 주말까지 꼭 끝내야 돼요
    김 과장 얘기로는 그녀에게 확인을 [i]해 봐야 된다고[/i] 하네요.	김 과장 얘기로는 그녀에게 확인을 해 봐야 된다고 하네요.
    이런 얘기 [u]진짜로 안 하려고[/u] 했는데 말이죠.	이런 얘기 진짜로 안 하려고 했는데 말이죠.
    다 함께 이렇게 [s]오파[/s] 오타 난 글자를 고쳐 보아요.	다 함께 이렇게 오파 오타 난 글자를 고쳐 보아요.
    박실장은 [color=blue]바닷가[/color]에 놀러 갔다죠.	박실장은 바닷가에 놀러 갔다죠.
    김대리는 [color=#FF0000]수목원[/color]으로 휴가를 갔죠.	김대리는 수목원으로 휴가를 갔죠.
    그때 그랬지, [size=30]어이![/size]라고.	그때 그랬지, 어이!라고.
    심부장이 그러던데, [font=Courier]뭐시기?[/font]라고.	심부장이 그러던데, 뭐시기?라고.

    링크 만들기

    글에서 다른 곳으로 가는 링크를 지정하는 여러 가지 방법이 있습니다.

    (www.example.com 처럼) "www"나 "ftp"로 시작하는 URL(Uniform Resource Locator)은 자동으로 인식해서 링크로 바꿔 줍니다. 그리고 [url] 태그에 매개변수를 줘서 링크 주소 대신 의미 있는 문구를 표시할 수도 있습니다. 매개변수 없이 url 태그를 쓰면 둘러싼 부분을 URL이라고 가정하고 그 목적지로 가는 링크를 만듭니다.

    글에 포함된 이메일 주소 역시도 자동으로 이메일 링크로 바뀝니다. 일반적인 BBCode 구현 방식과의 호환성을 위해 [email] 태그도 지원합니다.

    사용법	표시 결과
    더 많은 사례를 보려면 www.example.com 에 들르세요.	더 많은 사례를 보려면 www.example.com 에 들르세요.
    더 많은 사례를 보려면 http://example.com 에 들르세요.	더 많은 사례를 보려면 http://example.com 에 들르세요.
    질문할 게 있으면 joe@example.com 으로 문의하세요.	질문할 게 있으면 joe@example.com 으로 문의하세요.
    질문할 게 있으면 [email]joe@example.com[/email]으로 문의하세요.	질문할 게 있으면 joe@example.com으로 문의하세요.
    이번 예제에서는 [url=http://example.com/]예제 사이트[/url]를 이용합니다.	이번 예제에서는 예제 사이트를 이용합니다.
    이번 예제에서는 [url]http://example.com/[/url]를 이용합니다.	이번 예제에서는 http://example.com를 이용합니다.

    이미지 표시하기

    [img] 태그를 이용하면 글에서 이미지를 표시할 수 있습니다. 이미지에 대한 URL을 지정해 주어야 하며, 따라서 그 이미지는 인터넷 상의 접속 가능한 어딘가에 있어야 합니다. 글 내에 굉장히 큰 이미지를 추가하는 건 비추입니다. 그러면 페이지가 무진장 느리게 뜹니다!

    [img] 태그로 URL을 감싸 주면 이미지를 표시하는 코드로 바뀌게 됩니다. 예를 들어, "괜찮은 스샷: [img]http://example.com/screenshot.png[/img]"이라고 하면 그 스크린샷을 보여주게 됩니다 (물론 스크린샷 파일이 존재한다면요).

    [img] 태그에 크기 매개변수를 추가해 주면 원하는 표시 크기를 지정할 수도 있습니다. "괜찮은 스샷: [img=640x480]http://example.com/screenshot.png[/img]"이라고 하면 이미지를 640x480 크기로 표시합니다 (단, 이 경우에도 전체 이미지를 내려받습니다). 이걸 이용해서 이미지의 썸네일을 표시하지는 마십시오!

    [img] 태그를 [url] 태그로 감싸서 이미지에 외부 목적지로 가는 링크를 걸어주는 것도 얼마든 가능합니다. "참고: [url=http://example.com][img]http://example.com/screenshot.png[/img][/url]"

    목록

    가장 단순한 목록 형태는 순서 없는 목록인데, 이는 항목에 번호를 붙이지 않는 걸 뜻합니다. 목록의 항목들을 [list] 열기 및 닫기 태그로 감싸 주면 그런 목록을 만들 수 있습니다. 각 항목의 시작은 [*] 목록 항목 표시로 시작해 주어야 하며, 이건 닫는 태그가 없습니다.

    순서 있는 목록을 만들려면 [list] 목록 태그에 매개변수를 추가해 줘서 원하는 목록의 종류를 지정해 주어야 합니다. 가능한 매개변수로는 "i", "I", "1", "a", "A", "c", "d", "s" 등이 있는데, 이 모두는 첫 번째 목록 항목의 표시와 일치하게 됩니다.

    사용법	표시 결과
    좋아하는 것들 [list] [*]오렌지 [*]사과 [*]바나나 [/list]	좋아하는 것들 오렌지 사과 바나나
    좋아하는 것들 [list=I] [*]오렌지 [*]사과 [*]바나나 [/list]	좋아하는 것들 오렌지 사과 바나나
    좋아하는 것들 [list=1] [*]오렌지 [*]사과 [*]바나나 [/list]	좋아하는 것들 오렌지 사과 바나나

    고정폭 글씨와 블럭 형식 주기

    [code] 태그를 이용해서 문장 중간의 고정폭 형식 부분을 추가하거나 (일반적으로 프로그램의) 코드 블럭을 추가해 줄 수 있습니다. 여는 태그와 닫는 태그 사이에 줄바꿈이 있으면 블럭으로 표시됩니다.

    마찬가지로 [php] 태그를 이용하면 PHP 코드를 올릴 수 있습니다. PHP 코드는 자동으로 읽기 좋게 문법 강조가 됩니다.

    사용법	표시 결과
    [code]robots.txt[/code] 파일을 편집해 주시면 됩니다.	robots.txt 파일을 편집해 주시면 됩니다.
    HTML 제목 다는 방법: [code] <head>  <title>페이지 제목</title> </head> [/code]	HTML 제목 다는 방법: <head>  <title>페이지 제목</title> </head>
    어떤 PHP 코드: [php] <?php function hello() {   echo "Hello World!"; } ?> [/php]	어떤 PHP 코드: <?php function hello() {   echo "Hello World!"; } ?>

    글과 블럭 정렬하기

    [left], [right], [center] 태그를 이용해서 글 정렬 방식을 지정할 수도 있습니다. [float] 태그를 이용하면 글 중간에 떠 있는 상자를 집어넣을 수 있습니다 (특히 이미지에 대해 쓸만함). [float=left] 및 [float=right]이라고 하면 떠 있는 방향을 지정해 줄 수 있습니다. [justify] 태그를 이용하면 페이지의 양쪽 모두에 맞게 글의 간격을 조절해 줍니다.

    기타 지원 태그

    이미 게시한 어떤 내용을 인용하는 것이 가능한데, 그 주위에 [quote][/quote] 태그를 둘러 주기만 하면 됩니다. 특정인을 인용하고 싶다면 [quote=철수] 같이 쓰면 됩니다. 인용 태그는 여러 단계로 사용할 수 있습니다.

    [sub] 및 [sup] 태그를 이용하면 아랫첨자 및 윗첨자 문구를 추가할 수 있습니다. 예를 들면 "H[sub]2[/sub]O"는 H₂O가 되고, "X[sup]3[/sup]"는 X³가 됩니다.

    [acronym] 태그를 이용해서 단어가 두문자어임을 알려주고, 사용자가 태그에 마우스를 올릴 때 보이는 설명을 지정할 수 있습니다. 예를 들어 "[acronym=Structured Query Language]SQL[/acronym]"이라고 하면 SQL이 나옵니다.

    [abbr] 태그를 이용해서 단어가 줄임말임을 알려주고, 사용자가 태그에 마우스를 올릴 때 보이는 설명을 지정할 수 있습니다. 예를 들어 "[abbr=World Wide Web]WWW[/abbr]"이라고 하면 WWW이 나옵니다.

    [notag] 태그는 태그 내의 글을 분석해서 처리하지 않도록 해줍니다. 이를 이용하면 BBcode의 예를 들 때 태그가 HTML로 바뀌지 않게 할 수 있습니다. 예를 들면 "[notag]이 [b]태그[/b]는 그대로 나타남[/notag]"이라고 하면 "이 [b]태그[/b]는 그대로 나타남"이 나옵니다.

    [hr] 태그는 페이지를 가로지르는 수평선을 긋습니다. 글의 뭉치들을 분리할 때 유용합니다.

    복수의 형식 태그 사용하기

    어떤 글의 일부에 하나 이상의 형식 지정이 가능합니다. "난 [b][i]해수욕장[/i][/b] 갔다왔지롱"이라고 하면 "난 해수욕장 갔다왔지롱"으로 표시됩니다.

    열고 닫는 태그들의 순서를 올바르게 맞춰 주는 데에 신경을 써 주십시오. 열었던 것과 반대의 순서로 태그를 닫아주어야 합니다. 그렇지 않으면 상당히 이상한 표시 결과가 나올 수 있습니다. 그리고 잘못된 BBCode 사용으로 인한 형식 지정 오류가 있을 수 있으니 글을 올리기 전에 꼭 미리보기 기능으로 확인을 해보시기 바랍니다.

• 전체 HTML:
  • 줄과 단락은 자동으로 인식됩니다. <br /> 줄바꿈, <p> 단락 및 </p> 단락 끝 태그가 자동으로 추가됩니다. 만약 단락이 자동으로 인식되지 않으면 두 개의 빈줄을 추가합니다.