내맘대로의 EPUB 제작 가이드

[목록]에 사용하는 태그 

<dl>...</dl>

<dt> ... </dt>

<dd> ... </dd>

<dl>태그 그룹은 사전처럼 용어를 설명할때 사용하는 태그이다. <dl>태그만 독립적으로 사용할 수 없고 용어(definition term)를 표현하는 <dt> 태그와 용어에 대한 설명(definition descriptxion)을 표현하는 <dd>가 한 쌍으로 사용된다. 

사전을 예로 들면 <dt>태그는 사전의 단어에 해당하는 부분이고, <dd>태그는 사전의 뜻풀이에 해당하는 부분이다.  <dd>태그는 <dl>태그보다 한 탭정도 들여쓰기가 된고  글머리 기호나 번호가 붙지 않는다.다.

◈ <dl>, <dt>, <dd> 태그 문법◈

dl_dt_dd_tag_sample.html

테이블/표에 사용하는 태그 

<table>...</table>

<tr> ... </tr>

<td> ... </td>

<table>태그 그룹은 표를 만들 때 사용한다. <table>태그는 단독으로 사용할 수 없고 <tr>과 <td>태그가 함께 사용한다. 하나의 <table></table>태그 사이에는 반드시 하나 이상의 <tr></tr>태그가 들어가야하며 <tr>태그 안에는 다시 <td></td>태그가 들어가야 한다. 

<tr></tr>은 행을 추가할 때 사용한다. 5행짜리 테이블을 만들기 위해서는 <table></table> 사이에<tr></tr>이 5개 있어야 한다.

<td>는 한 행을 몇개의 칸(열)으로 나눌지 결정한다.  열이 5개인 표를 만들고 싶으면 <tr></tr>안에 <td></td>가 5개 있어야 한다.

위의 예제처럼 2행, 2열, 총 4칸짜리 테이블을 만들기 위해서는 행을 그려주는 <tr>이 2번, 칸을 그려주는 <td>가 <tr>안에 각각 2번씩 4번 나와야 한다. 

테이블은 가로 2칸을 병합하거나 세로 2칸을 병합하는 등 좀 더 복잡한 구조를 가질 수 있다. 

테이블의 속성인 rowsapn과 colspan은  <td>태그에 사용하는 속성으로 행과 열을 병합할 때 쓴다. 행과 열을 병합할 때는 표의 정확한 구조를 파악하지 않으면 표가 제대로 그려지지 않을 수 있으니 주의해야 한다.

◈ <a href="URL"> </a> 태그 문법◈

table_tag_sample.html

□ 사용 가능한 속성

다른 문서나 위치에 링크를 걸때 사용하는 태그 

<a href="URL"> 외부 문서로 이동 </a>

<a href="(URL)#ID"> 문서의 특정 위치로 이동 </a>

링크는 다른 페이지로 이동이 필요할 때 사용한다. 책 내에서 이동을 하는 경우를 내부링크, 문서를 벗어나 새로운 문서나 웹사이트로 이동하는 경우를 외부링크라고 한다. ePub2.0에서는 링크를 주로 주석으로 연결하는데 많이 사용하고 있다. ePub 3.0에서는 aside 태그로 주석을 지원하지만, ePub 2.0에서는 주석을 표현하기 어려워 단어 옆에 괄호()로 주석을 넣거나, 주석이 긴 경우 주석 페이지를 따로 만들어 링크로 연결한다. 

외부링크는 책에서 다른 웹페이지로 이동할 때 사용한다. 외부링크를 사용하면 대부분의 뷰어에서 웹브라우저를 실행시켜 링크 주소로 이동을 한다. 일부 뷰어는 웹브라우저를 실행시키지 않고 뷰어 내에서 사이트를 보여주기도 하는데 이는 뷰어에 따라 다를 수 있다. 

내부링크는 책에 있는 특정 위치로 이동을 할 때 사용한다. 같은 문서가 아닌 다른 문서의 특정 위치로도 이동이 가능해서 주석이나 다른 페이지의 특정 내용을 참고해야 할 때 해당 위치로 이동이 가능하다. 

내부 링크로 주석처럼 특정 위치로 이동하기 위해서는 해당 위치를 알 수 있도록 ID를 태그에 포함시켜야 한다. <span id="LINK_TAG"></span>이나 <a id="LINK_TAG"></a>  처럼 본문에 아무 영향을 주지 않는 태그로 특정 위치에 ID를 넣을 수 있고 <p id="LINK_ID">처럼 문단 태그에 추가하는 것도 가능하다. 

하지만 링크를 사용할 때에는 이용하려는 뷰어에서 링크를 지원하는지 확인이 필요하다. 최근에는 링크를 허용하는 경우가 많지만, 태블릿이나 전자책 전용 디바이스처럼 항상 네트워크에 연결되어 있지 않은 디바이스가 많기 때문에 링크를 지원하지 않는 뷰어도 많이 있다. 또 뷰어에 따라 내부링크만 지원하고 외부링크를 지원하지 않는 경우도 있다. 

◈ <a href="URL"> </a> 태그 문법◈

a_tag_sample.html