HTML5에서 예약 문자(reserved characters)란?
HTML5에는 마크업을 해석하는 데 특별한 의미를 지니기 때문에 일반 텍스트처럼 자유롭게 사용할 수 없는 예약 문자가 있습니다.
대표적인 예가 부등호 기호(<와 >)입니다. 본문 중간에 꺾쇠 괄호를 그대로 입력하면 브라우저는 이를 일반 문자가 아니라 HTML 태그의 시작이나 끝으로 잘못 인식할 수 있습니다. 이러한 충돌을 피하려면 해당 문자를 반드시 문자 엔티티(character entity)로 변환해 작성해야 합니다.
문자 엔티티는 크게 두 가지 형태로 작성할 수 있습니다. 첫 번째는 &quot;처럼 알파벳으로 된 엔티티 이름이고, 두 번째는 &#34;처럼 숫자를 사용하는 숫자 코드입니다. 두 방식은 화면에 동일한 문자를 출력합니다.
HTML5가 반드시 지원해야 하는 5가지 특수 문자
HTML5 명세에 따르면, HTML5 처리기(processor)는 아래 표에 정리된 5가지 특수 문자를 반드시 지원해야 합니다.
| 기호 | 설명 | 엔티티 이름 | 숫자 코드 |
|---|---|---|---|
| " | 큰따옴표(quotation mark) | &quot; | &#34; |
| ' | 작은따옴표(apostrophe) | &apos; | &#39; |
| & | 앰퍼샌드(ampersand) | &amp; | &#38; |
| < | 보다 작음(less-than) | &lt; | &#60; |
| > | 보다 큼(greater-than) | &gt; | &#62; |
문자 엔티티 활용 예시
예를 들어 독자에게 <p> 태그의 용도를 설명하는 글을 쓴다고 가정해 봅시다. 화면에는 '<p> 태그는 단락(paragraph)을 정의합니다'라는 문장이 그대로 보여야 하지만, 소스 코드에는 다음과 같이 입력해야 브라우저가 이를 실제 태그로 해석하지 않습니다.
<p> 태그는 단락(paragraph)을 정의합니다
엔티티 이름 방식은 어떤 문자를 의미하는지 한눈에 파악할 수 있어 가독성이 뛰어나고, 숫자 코드 방식은 엔티티 이름이 정해져 있지 않은 다양한 유니코드 문자까지 표현할 수 있다는 장점이 있습니다. 상황에 맞게 선택해 사용하면 됩니다.