HTML 엔티티란 — 부등호·앰퍼샌드 안전하게 쓰기

HTML 문서 안에 부등호나 앰퍼샌드를 그대로 적으면, 브라우저가 그것을 태그의 일부나 특수 기호로 오해해 글자가 사라지거나 깨집니다. 이런 충돌을 막으려고 약속된 코드로 바꿔 적는 것이 HTML 엔티티입니다. 개념과 대표 코드, 그리고 언제 바꿔야 하는지를 정리했습니다.

엔티티가 무엇인가

HTML에서 어떤 문자들은 평범한 글자가 아니라 문법 기호로 쓰입니다. 여는 부등호는 태그의 시작을, 닫는 부등호는 태그의 끝을 뜻하고, 앰퍼샌드는 엔티티의 시작을 알립니다. 그래서 이 기호들을 화면에 글자 그대로 보여주고 싶다면, 문법 기호와 구분되도록 정해진 코드로 바꿔 적어야 합니다.

엔티티는 모두 앰퍼샌드로 시작해 세미콜론으로 끝납니다. 이 형태를 만나면 브라우저는 그 사이의 이름이나 번호를 보고 해당 글자 하나로 바꿔 화면에 그립니다. 이렇게 특수문자를 안전한 코드로 바꾸는 일을 이스케이프(escape)라고 부릅니다.

대표 엔티티 표

가장 자주 만나는 다섯 가지입니다. 왼쪽이 실제 보이는 글자, 가운데가 이름 엔티티 코드입니다.

이 표를 한 줄 텍스트로 빠르게 바꾸거나 되돌리고 싶다면 HTML 엔티티 변환기에 붙여넣으면 됩니다.

이름 엔티티 vs 숫자 엔티티

같은 글자를 적는 방법은 두 가지입니다. 하나는 사람이 외우기 쉬운 이름 엔티티이고, 다른 하나는 문자의 코드 포인트 번호를 그대로 쓰는 숫자 엔티티입니다. 예를 들어 여는 부등호는 이름으로는 lt, 숫자로는 60번이며, 숫자 엔티티는 샵 기호 뒤에 그 번호를 붙여 적습니다(60번 → 숫자 엔티티 표기).

언제 이스케이프할까

• 본문에 코드를 보여줄 때 — 태그나 부등호를 글자 그대로 노출하려면 반드시 엔티티로 바꿔야 화면에서 사라지지 않습니다.
• 사용자 입력을 화면에 다시 표시할 때 — 입력값을 이스케이프 없이 그대로 페이지에 넣으면, 입력에 섞인 태그가 실행될 수 있습니다(XSS). 출력 시 이스케이프가 기본 방어선입니다.
• 속성값 안에 따옴표가 들어갈 때 — 속성을 감싼 따옴표와 충돌하지 않도록 안쪽 따옴표를 엔티티로 바꿉니다.
• 되돌릴 때 — 누가 인코딩해 보낸 텍스트는 같은 변환으로 원래 글자로 풀 수 있습니다.