HTML 엔티티 변환
HTML에서 꼭 이스케이프할 글자는 다섯 개입니다. &는 &, <는 <, >는 >, "는 ", '는 '로 바뀝니다. <b>를 디코딩하면 <b>가 됩니다.
사용 방법
- 글자를 엔티티로 바꾸려면 인코딩, 엔티티를 글자로 되돌리려면 디코딩을 고르고 텍스트를 붙여 넣습니다.
- 인코딩할 때는 범위를 고릅니다. 기본은 HTML에서 위험한 다섯 글자만 바꿉니다. 이름 우선은 ©처럼 이름이 있는 글자를 이름으로 씁니다. 10진수와 16진수는 ASCII가 아닌 모든 글자를 숫자 엔티티로 바꿉니다.
- 결과를 복사합니다. 디코딩할 때는 찾은 엔티티 개수도 알려 줍니다.
계산 방법
HTML 엔티티는 &로 시작해 세미콜론으로 끝나며 글자 하나를 나타냅니다. 이름(&), 10진수 코드 포인트(&), 16진수 코드 포인트(&) 세 가지로 쓸 수 있고 뜻은 모두 같습니다.
본문과 속성값에서 이스케이프해야 하는 글자는 & < > " ' 다섯 개입니다. &나 <를 그대로 두면 브라우저가 엔티티나 태그의 시작으로 읽을 수 있습니다. '는 HTML 4에 없어서 작은따옴표는 '로 씁니다.
이름이 있는 엔티티는 Latin-1 범위(악센트 문자, ©, ®, £ 등)와 —, …, € 같은 자주 쓰는 기호뿐입니다. 한글이나 이모지처럼 이름이 없는 글자는 항상 숫자 엔티티가 됩니다. 이모지는 코드 포인트 단위로 바꾸므로 이모지 하나가 엔티티 두 개가 아니라 하나가 됩니다.
디코딩할 때 모르는 표기는 그대로 둡니다. 0, U+10FFFF보다 큰 값, 서로게이트 반쪽을 가리키는 숫자 엔티티는 브라우저와 똑같이 대체 문자 U+FFFD로 바꿉니다.
자주 쓰는 HTML 엔티티
| 글자 | 이름 | 숫자 |
|---|---|---|
| & | & | & |
| < | < | < |
| > | > | > |
| " | " | " |
| ' | (HTML 4에는 없음) | ' |
| 줄바꿈 없는 공백 | |   |
| © | © | © |
| € | € | € |
| — | — | — |
| … | … | … |
자주 묻는 질문
인코딩하면 XSS가 막히나요?
믿을 수 없는 텍스트를 HTML 요소 안이나 따옴표로 감싼 속성값에 넣는다면 다섯 글자 이스케이프가 맞는 대책입니다. 하지만 script 블록 안, 따옴표 없는 속성, URL에는 저마다 다른 이스케이프가 필요해서 이것만으로는 부족합니다.
한글이나 이모지도 인코딩해야 하나요?
페이지를 UTF-8로 내보내면 그럴 필요가 없습니다. 요즘은 UTF-8이 기본입니다. 파일이나 시스템이 그 글자를 담지 못할 때만 숫자 엔티티를 쓰세요.
와 일반 공백은 뭐가 다른가요?
줄바꿈 없는 공백(non-breaking space)은 공백처럼 보이지만 양쪽 단어를 한 줄에 묶어 두고, 여러 개를 이어 써도 하나로 합쳐지지 않습니다. 레이아웃 용도로는 꼭 필요한 곳에만 쓰세요.
&foo; 같은 이름은 왜 그대로 남나요?
디코더는 Latin-1 이름과 아래 표에 있는 자주 쓰는 이름 등 약 130개를 압니다. 모르는 엔티티는 짐작하지 않고 입력한 그대로 둡니다.
텍스트가 서버로 전송되나요?
아니요. 인코딩과 디코딩 모두 브라우저 안에서 처리합니다.