웹 개발을 위한 HTML 가이드 번외 3편 - 탈출문자 사용하기

텍스트 관련 태그

• 굵기와 기울기 태그(b, strong, i, em)
• 개행과 가로줄 태그(br, hr)
• 윗첨자와 아랫첨자 태그(sup, sub)
• 텍스트의 추가, 제외 태그(ins, del)
• 취소선(s)과 밑줄 표현
• 인용 태그(q, blockquote)
• 하이라이트 태그(mark)
• small 태그
• code, pre 태그
• 번외 - 탈출문자 사용하기현재 글
• 그 외의 텍스트 태그들

개요

저번 글 웹 개발을 위한 HTML 가이드 23편 - code, pre 태그에서 예고했던대로 이번 글에서는 HTML에서 사용할 수 있는 탈출 문자에 대해서 알아보려고 합니다.

HTML은 웹 페이지의 골격을 만들기 위해 존재합니다. 여기까지는 이제는 다들 아실 것 같아요. 그런데, 이 페이지에 사용되는 문자 중에는 태그 요소에 사용되는 꺽쇠가 쓰일 때가 있습니다. 이 문서처럼 HTML 문법에 관련된 컨텐츠일 경우엔 더더욱 그렇겠죠. 그럴 때 HTML 파일에 꺽쇠를 생각 없이 적으면 웹 페이지가 깨져버릴 수가 있습니다.

왜냐하면 HTML을 실행하면 브라우저가 검사하면서 렌더링을 해주는데 이 과정에서 꺽쇠를 만나면 태그 요소라고 인식을 해버리기 때문입니다. 웹 페이지가 깨져버리면 우리가 원하는 모양이 나오지 않기 때문에 일종의 버그라고 할 수 있겠죠. 이러한 현상을 방지 하기 위해 우리는 탈출 문자를 사용합니다.

탈출 문자

탈출 문자는 프로그래밍을 하면서 특수문자를 사용할 때 혹은 프로그램적인 제한에서 탈출하기 위해 사용하는 문자들입니다. 이러한 행위들을 Escape라고 합니다. 다른 프로그래밍 언어들에도 탈출 문자는 존재합니다. 아무튼 이 글에서는 HTML에 한정된 것들을 다루려고 합니다. 전부를 다루는 것은 어려우니까 자주 다루는 것만 추려서 보여드리도록 하겠습니다.

자주 사용하는 특수문자

이 아래는 자주 사용하는 특수문자들을 HTML 문법과 충돌하지 않게 사용하는 방법들입니다.

<

<(여는 꺽쇠)를 나타냅니다.

&gt;

>(닫는 꺽쇠)를 나타냅니다.

&nbsp;

공백을 나타냅니다.

&amp;

&를 나타냅니다.

&quot;

"(큰따옴표)를 나타냅니다.

<p>태그는 보통 &lt;이름&gt;과 &lt;/이름&gt;으로 감쌉니다.</p>

크게 보기 (새 창)

이런 느낌으로 사용하시면 되겠습니다.

그 외의 문자들

위의 내용들은 알아두면 좋은 내용들이지만 사실 반드시 알아야 하지는 않습니다. 어차피 필요하면 찾아보면 되니까요. 그럴 때 이 사이트에서 찾아보시면 되겠습니다. 되게 상당한 개수의 특수문자들이 존재합니다.

이번 글에서는 HTML 상에서 특수문자를 제한없이 사용하는 방법인 탈출(Escape)에 대해서 알아봤습니다. 사실 탈출문자는 다른 프로그래밍 언어들에서 더 많이 찾게 될 겁니다. 그 때가 언젠가는 오시기 바라면서 이번 글 마치도록 하겠습니다. 다음 글에서는 나머지 텍스트 관련 태그들에 대해서 다뤄보도록 하겠습니다. 다음 글에서 봅시다.