자료찾기 귀찮아 내가 만든 블로그

프로그램을 사용하다가 궁금한 점이 있으면 보통 [F1] 키를 눌러 프로그램에 대한 온라인 기술 문서(또는 도움말)를 확인하게 된다. 이때 나타나는 도움말 형식에는 여러 가지가 있지만 대부분은 [그림 1]과 같은 HTML Help 형식의 도움말이 나타날 것이다. 여기에서는 이런 형식의 도움말 제작에 대해 평소 관심이 있었던 업체나 사람들에게 하나의 길잡이가 될 수 있도록 HTML Help를 만드는 과정을 5회에 거쳐 진행될 예정이다.

하지만 HTML Help란 말을 처음 듣거나 또는 이에 대해 자세히 알지 못했던 사람이라면 먼저 이런 질문이 떠오를 것이다. 'HTML Help란 무엇이고 어떻게 작동하는 것인가?' 따라서 본격적인 작업에 앞서 HTML Help에 대해 간단하게 살펴보기로 한다.

HTML Help의 개요와 구성
HTML Help는 MS에서 32비트 윈도우 애플리케이션용으로 1997년에 개발되었으며, HTML 형식에 기반을 둔 온라인 도움말의 표준이다. HTML Help의 파일 형식은 '*.chm'이며, 이 파일을 더블 클릭하여 직접 실행하거나 프로그램과 연동되어 있는 경우 관련 메뉴를 선택하거나 F1키를 눌러 실행할 수 있다. 오늘날 다수의 소프트웨어에서 HTML Help를 기본 도움말 형식으로 사용하고 있는데 그 이유를 몇 가지로 요약해 보면 다음과 같다.

• 사용자의 시스템 환경에 거의 영향을 받지 않는다.
  사용자의 시스템에 인터넷 익스플로러 3.01 이상만 설치되어 있으면 인터넷 익스플로러가 기본 브라우저가 아니더라도 HTML Help 형식의 도움말을 사용할 수 있다.
  
• 문서를 동적으로 작성할 수 있다.
  HTML Help가 개발되기 이전에 많이 사용했던 WinHelp와 달리 HTML Help는 HTML 파일(*.htm)로 구성되기 때문에 HTML 파일 자체에서 사용할 수 있는 CSS, DHTML, 스크립트 등의 모든 요소를 활용할 수 있다. 또한 문서 작성 방법이 HTML 파일과 동일하기 때문에 별도로 문서 작성 방법을 학습할 필요가 없다.
  
• 파일 관리가 용이하다.
  여러 개의 HTML 파일과 부속 파일들을 하나의 파일(*.chm)로 컴파일하여 사용할 수 있으며, 필요한 경우 디컴파일하여 쉽게 원래의 상태로 되돌릴 수도 있다. 또한 HTML Help로 컴파일한 파일(*.chm)은 실제 원본보다 훨씬 작은 용량으로 저장할 수 있다. 예를 들어 '나모 웹에디터 FX 도움말'에서 사용한 전체 파일 용량은 약 21MB이지만 HTML Help 형식의 파일(webeditor.chm)로 만들면 약 1/3인 8MB가 된다.

위 와 같은 특성 때문에 HTML Help는 단순히 소프트웨어 도움말로서의 용도뿐 아니라 웹 사이트를 백업하거나 여러 곳에 흩어져 있는 자료를 일목요연하게 정리하는 용도 등으로도 활용된다. 이처럼 여러 용도로 사용할 수 있는 HTML Help는 그 목적이나 작업자의 취향에 따라 여러 형태로 제작할 수 있지만 우리가 흔히 볼 수 있는 HTML Help는 아래와 같은 형태이며, 각 부분의 역할은 다음과 같다.

[그림 1] HTML Help 형식의 도움말 구성

• 도구 모음: 내비게이션 창을 숨기거나 보이게 하는 버튼, 토픽 창에 나타난 내용을 인쇄할 수 있는 버튼 등으로 구성되어 있다. HTML Help를 만들 때 도구 모음에 대한 설정을 별도로 하지 않으면 기본적으로 숨기기, 뒤로, 옵션, 인쇄 단추가 나타나며, 필요에 따라 도구 모음의 구성을 변경할 수 있다.
  
• 내비게이션 창: HTML Help의 왼쪽에 나타나며, 목차 탭, 색인 탭, 검색 탭, 즐겨찾기 탭 등으로 구성된다. 각 탭은 HTML Help의 내용을 쉽고 편리하게 찾을 수 있도록 도와주는 역할을 하며, 작업자가 내비게이션 창에 나타날 탭 종류를 선택할 수 있다.
  
• 토픽 창: HTML Help의 내용을 표시하는 부분으로 앞서 언급한 것처럼 HTML Help는 HTML 파일을 기반으로 하기 때문에 텍스트 뿐만 아니라 그림이나 멀티미디어적 요소, 스크립트 효과 등도 표현할 수 있다. 필요한 경우 내비게이션 창 없이 토픽 창만 나타나도록 HTML Help를 만들 수도 있다.

HTML Help가 어떤 것인지에 대해 대략적으로 이해했다면, 이제부터는 HTML Help 형식의 도움말을 만드는 방법을 살펴보겠다. 다음의 과정으로 소개할 내용을 차근히 따라가다 보면 간단한 도움말 하나를 함께 완성할 수 있을 것이다. HTML Help를 만드는 목적에 따라 도움말 구성이나 작업 과정이 다르기 때문에, 여기에서는 범위를 제한하여 일반적인 도움말 형태를 지닌 '나모 GIF 애니메이터 도움말'을 예로 들어 설명한다.

1. HTML Help 시스템 설계하기
   
2. 프로젝트와 목차 만들기
   
3. 색인 만들기
   
4. 검색 및 즐겨찾기 기능 구현하기
   
5. 컴파일 및 테스트하기
   
6. 기타 옵션 설정하기
   
7. 디컴파일하기

HTML Help 시스템 설계하기
집을 지을 때 정확한 설계도가 있어야 작업에 필요한 인력과 시간, 비용을 미리 예상하여 경제적이고 튼튼한 집을 지을 수 있는 것처럼 HTML Help를 만들 때에도 HTML Help 시스템에 대한 계획을 세워야 시행착오 없이 작업자가 원하는 결과를 도출할 수 있다. 따라서 다음 항목에 대해 살펴보고 계획을 세우는 것은 매우 중요한 일이다.

• HTML Help 대상 정하기
  누구를 대상으로 할 HTML Help를 만들 것인지를 생각한다. 초보 사용자를 대상으로 한다면 기본적인 내용에 대한 설명과 내용을 이해하기 쉽도록 그래픽적 요소를 많이 사용해야겠지만 고급 사용자를 대상으로 한다면 기본적인 내용에 대해서는 간략히 설명하고 대신 고급 기능에 대한 설명을 넣어야 할 것이다.
  
• 내용 기술 방법 정하기
  문서를 어떤 방식으로 기술할 것인지를 정한다. 보통 사용자가 직접 따라하면서 기능을 익힐 수 있는 '따라하기' 식과 각 기능에 대해 풀어서 설명하는 '참고서' 식으로 나눌 수 있다.
  
• 내비게이션 창 구성하기
  내비게이션 창을 구성할 탭의 종류를 정한다. 내비게이션 창을 구성할 탭의 종류에 따라 작업 순서나 시간이 달라질 수 있다. 예를 들어 색인 탭을 추가하는 경우 키워드를 추가하여 색인 파일을 만드는 작업 시간을 더 추가해야 한다.
  
• HTML Help 저작 도구 정하기
  어떤 프로그램을 이용하여 HTML Help를 만드느냐에 따라 문서 작성 방식이 달라질 수도 있다. 예를 들어 HTML 파일에 자바 스크립트를 삽입하여 구현할 수 있는 효과를 프로그램 자체에서 메뉴로 제공하는 경우도 있다.
  
• 폴더 구조 및 파일 이름 정하기
  HTML Help 프로젝트가 큰 경우에는 관련 파일의 개수도 많아지게 된다. 따라서 관련 파일을 쉽게 관리할 수 있도록 폴더 구조를 잘 설정하고 파일 이름만으로도 문서 내용을 파악할 수 있도록 파일 이름을 붙이는 규칙을 미리 만들어 두는 것이 좋다. 여러 명이 프로젝트를 진행하는 경우에는 HTML Help를 구성할 문서의 개수와 파일 이름, 위치 등을 한번에 확인할 수 있도록 아래와 같은 목차 파일을 이용하는 것도 좋은 방법 중의 하나이다.
  
  

  [그림 2] 도움말에 대한 목차 파일

  
  
• HTML 파일 스타일 정하기
  HTML 문서를 작성할 때 공통된 스타일을 유지하려면 스타일 시트(*.css)를 사용하는 것이 좋다. 특히 규모가 큰 프로젝트를 여러 명이 나누어 진행하는 경우에는 아래와 같이 각 요소에 대한 글꼴, 크기, 줄 간격 등에 대한 스타일 시트를 정의하여 공유하는 것이 바람직하다. 마찬가지로 여러 문서에서 공통적으로 사용할 스크립트 효과가 있다면 스크립트 파일(*.js)도 만들어 공유한다.
  
  

  [그림 3] 스타일 시트의 예

  
  

  [그림 4] 스타일 시트가 적용된 HTML Help

위 항목 외에도 문서에 사용할 그림의 크기는 어느 정도로 할 것인지, 내용을 서술할 때 '~합니다'와 같은 '-합쇼'체로 할 것인지 아니면 '~한다'와 같은 '-해라'체로 할 것인지, 'Windows'나 'Microsoft'와 같이 자주 사용하는 외국어 표기는 어떤 식으로 할 것인지 등에 대한 소소한 사항들까지 미리 계획을 세워야 시행착오 없이 일정 안에 작업을 끝낼 수 있다.

지금까지 HTML Help의 개요와 HTML Help 시스템을 설계할 때 고려해야 할 사항들에 대해서 살펴보았다. 다음 시간에는 HTML Help 저작 도구를 선택하여 프로젝트를 만들고 목차를 생성하는 방법에 대해 자세히 살펴보겠다.

출처 : 김유진 ( (주)세중 나모 인터랙티브 개발본부 )

요즘 컴퓨터 관련 잡지나 웹 사이트를 보다 보면 글의 저자를 소개할 때 ‘테크니컬 라이터 아무개’라고 소개하는 것을 볼 수 있다. 불과 몇 년 전만 해도 들어보지 못했던 용어인데 언제부터인가 간간이 이 용어가 눈에 띄기 시작했다. ‘테크니컬’이라는 말이 들어가다 보니 어쩐지 어려워 보이고 생소하게 느껴지기도 하는데, 과연 ‘테크니컬 라이터’는 무엇을 하는 사람들일까? 이 글을 조금만 읽다 보면 곧 그 해답을 찾을 수 있을 것이다.

여기에서는 ‘테크니컬 라이팅’이 무엇이고 ‘테크니컬 문서’에는 어떤 것이 있는지 알아보고 대표적인 온라인 기술 문서인 HTML Help를 중심으로 기술 문서를 만드는 방법에 대해 자세히 알아보기로 한다. 그 첫 번째 시간으로 먼저 ‘테크니컬 라이팅’과 ‘테크니컬 라이터’에 대해 소개하고 본격적인 온라인 기술 문서 작성에 들어가기에 앞서 준비 작업을 해 보기로 한다.

테크니컬 라이팅과 테크니컬 라이터
“테크니컬 라이팅(Technical Writing)은 특정 사람을 대상으로 특정 목적을 가지고 기술적인 주제에 관해 특정 정보를 전달하는 것을 말한다. 테크니컬 라이팅에서 사용하는 문장이나 그림 등은 추상적이지 않아야 한다. 즉, 어떤 작업을 수행하거나 어떤 주제를 이해하기 쉽도록 정확한 정보만을 전달해야 한다.”

위의 정의에서도 알 수 있듯이 테크니컬 라이팅은 일반적인 창작 라이팅과는 달리 특정한 작업을 하려고 하는 사람들이나 특정한 주제에 대해 알고 싶어하는 사람들에게 정확한 사실을 보다 쉽게 전달하는 모든 작업을 포함한다. 따라서 일반적인 창작 라이팅과는 다르게 정보 제공이 그 목적이고 어떻게 하면 그 정보를 좀 더 효율적이고 알기 쉽게 전달할 수 있는가 하는 것이 중점이 된다.

테크니컬 라이팅과 창작 라이팅의 차이

테크니컬 라이팅 창작 라이팅 내용 사실적, 직설적 창의적, 상상, 상징적 대상 특정인 일반인 형식 형식적, 표준, 학문적 자유로운 형식 구성 순차적 원하는 대로 자유롭게

테크니컬 라이팅의 예로는 ‘프리젠테이션 문서’, ‘소프트웨어 문서’, ‘이력서’, ‘작업 가이드’, ‘기사’, ‘회사 소개’ 등을 들 수 있다. 지금 여러분이 보고 있는 이 글도 역시 테크니컬 라이팅에 속한다. 이러한 테크니컬 라이팅의 가장 큰 특징을 요약해 보면 다음과 같다.

• 먼저 표현이 ‘명확’해야 한다. 모호한 설명은 피하고 쉽게 이해할 수 있도록 명확하게 기술해야 한다.
  
• 그리고 ‘사실’만을 전달해야 한다. 저자의 주관적인 생각이나 추측을 기술하는 것이 아니라 정확한 사실만을 기술해야 한다.
  
• 용어나 문법 등이 ‘올바른’ 것이어야 한다. 표준에 맞지 않은 표현이나 용어 등을 사용해서는 안 된다.
  
• 정보 검색이 ‘쉬워야’ 한다. 정보는 많이 제공하면서 원하는 정보를 쉽게 찾을 수 없도록 해 놓으면 정보를 찾기 위한 시간이 너무 많이 소모된다. 따라서 제목과 부제목을 잘 활용하고 목차와 색인을 잘 구성해야 한다.
  
• 주제를 쉽게 이해할 수 있도록 ‘다양하고 풍부한’ 정보를 제공해야 한다.

그렇다면 ‘테크니컬 라이터(Technical Writer)’의 뜻은 이제 쉽게 유추할 수 있을 것이다. ‘테크니컬 라이터’는 위에서 설명한 ‘테크니컬 라이팅’을 하는 사람들을 일컫는 말이다. 테크니컬 라이터는 문서를 작성할 뿐만 아니라 기획, 검수, 애플리케이션 테스트, 도움말 제작 등 다양한 업무를 하기도 한다. 그리고 이렇게 해서 만들어진 작업 결과물을 ‘테크니컬 문서(또는 기술 문서)’라고 부른다.

이제 앞에서 예시한 여러 가지 테크니컬 라이팅 중에 ‘소프트웨어 기술 문서’를 뽑아 이를 보다 자세히 알아보도록 하겠다. 여기에서는 ‘나모 웹에디터 FX suite’의 기술 문서를 예로 하여 소프트웨어 기술 문서의 종류에 대해서 자세히 알아보기로 한다.

소프트웨어 기술 문서
어떤 제품을 처음 접했을 때, 아무런 도움 없이도 제품을 계속 사용하면서 시행착오를 겪다 보면 사용법을 익힐 수 있다. 하지만 보다 빠르고 쉽게, 그리고 최대한 제품을 활용하려면 ‘도움’이 필요하다. 이러한 ‘도움’에는 콜센터와 같은 전화 상담이 있을 수 있고 이미 기능을 알고 있는 주위 사람들의 설명이 있을 수 있고, 책이 될 수도 있고, 멀티미디어 자료가 될 수도 있다.

여러 가지 ‘도움’ 중에 가장 기본적이고 대표적인 방법이 예전에는 ‘매뉴얼’을 제공하는 것이었다. 물론 요즘에도 매뉴얼을 제공하는 업체가 굉장히 많다. 카메라, TV, 휴대폰을 사도 매뉴얼이 있고 소프트웨어를 사도 매뉴얼이 있다. 하지만 최근에는 종이로 된 매뉴얼보다는 온라인 기술 문서를 선호하는 경향이 점점 증가하고 있다.

온라인 기술 문서는 말 그대로 책으로 보는 것이 아니라 컴퓨터(단말기) 화면상에서 볼 수 있는 기술 문서를 말한다. 대표적인 온라인 기술 문서 형식으로는 PDF 문서, HTML Help, 웹 사이트에서 제공하는 기술 문서를 들 수 있다. PDF 문서는 검색, 인쇄 등이 가능하고 프린트로 출력된 문서의 모든 요소를 갖추고 있는 파일 형식이다. Adobe사의 Acrobat과 같은 소프트웨어를 이용하여 만들 수 있으며 PDF 문서를 보려면 Acrobat Reader(아크로뱃 리더)가 설치되어 있어야 한다. HTML Help(*.chm)는 Microsoft사에서 개발한 온라인 도움말 형식으로 현재 대부분의 소프트웨어에서 사용하고 있는 도움말 형식이다.

다음 그림은 전 세계 테크니컬 라이터를 대상으로 가장 많이 사용하는 기술 문서 형식에 대한 설문 조사 결과이다.


<그림 1> 소프트웨어 기술 문서로 가장 많이 사용하고 있는 형식 (출처:http://www.winwriters.com)
여기에서도 볼 수 있듯이 매뉴얼 보다는 PDF 문서나 HTML Help(Browser-based Help), 웹 기술 문서가 점점 대표적인 기술 문서 형식으로 자리잡아가고 있음을 볼 수 있다. 물론 여전히 매뉴얼이 중요하게 여겨지기는 하지만 해가 거듭될수록 매뉴얼의 비율이 낮아지고 있다.

그럼 매뉴얼과 같은 오프라인 문서가 아닌 온라인 기술 문서를 제공할 때 얻을 수 있는 장점은 무엇일까? 여러 가지가 있겠지만 우선 업데이트가 쉽고, 책으로 만드는데 드는 비용이 절감되고, 보다 쉽게 정보를 검색할 수 있고, 다이내믹하게 구성할 수 있다는 점등을 들 수 있다.

온라인 기술 문서의 장점을 정리해 보면 다음과 같다.

• 온라인 기술 문서에서는 원하는 정보를 쉽게 검색할 수 있다.
  책에서 원하는 정보를 찾기 위해서는 목차나 색인을 참조한다 해도 시간이 걸리기 마련이다. 하지만 온라인 도움말에서는 검색 기능을 사용하면 원하는 정보를 보다 쉽고 빠르게 찾을 수 있다. 또한 정보를 찾기 위해 하던 일을 멈추고 책을 찾아 보던 것과는 달리 화면에서 바로 정보를 찾아 적용해 볼 수 있다.
  
• 관련된 정보를 찾아보기 쉽다.
  하나의 정보를 찾고 나서 그와 관련된 또 다른 정보를 보기 위해 다시 목차나 색인을 참고할 필요 없이 다음 그림과 같이 작성자가 제공하는 관련 항목 링크를 클릭하는 것만으로도 관련 정보를 쉽게 찾아 볼 수 있다.

<그림 2> 일반적인 하이퍼링크 형식의 관련 항목 링크

<그림 3> HTML Help 저작 툴을 활용하여 만든 관련 항목 링크

• 판매자 입장에서는 비용을 절감할 수 있다.
  온라인 도움말을 제공하게 되면 책을 만드는데 들어가는 종이, 인쇄, 생산, 배포 등에 소요되는 비용을 줄일 수 있다.
  
• 제공 방법이 쉽다.
  따로 인쇄하는 과정을 거치지 않고 온라인으로 바로 출판하여 제공할 수 있어 복잡한 과정 없이 쉽게 제공할 수 있다.
  
• 업데이트가 쉽다.
  인쇄해서 제공하는 경우에는 문서가 업데이트되면 다시 인쇄해서 책으로 만들어야 하는 번거로움이 따른다. 하지만 온라인 기술 문서는 수시로 업데이트하여 편리하게 제공할 수 있다.

자, 지금까지 '테크니컬 라이팅'의 기본 개념과 '온라인 소프트웨어 기술 문서'에 대해서 살펴보았다. 그럼 다음 번에는 대표적인 온라인 기술 문서 형식인 HTML Help가 무엇인지 알아보고 이를 구성하는 파일에는 무엇이 있는지 살펴보도록 하겠다.

출처 : 김유진 ( (주)세중 나모 인터랙티브 개발본부)