HTML 엔티티 인코더 & 디코더
텍스트를 HTML 안에 안전하게 넣을 수 있도록 이스케이프하거나, &와 € 같은 엔티티를 읽을 수 있는 문자로 되돌립니다.
브라우저에서 실행가입 불필요업로드 없음
HTML 엔티티 인코더 / 디코더 사용 방법
- 텍스트를 이스케이프하려면 인코딩을, 엔티티를 문자로 되돌리려면 디코딩을 선택합니다.
- 인코딩할 때는 이스케이프할 문자를 고릅니다: HTML 특수 문자만, 모든 비 ASCII 문자까지, 또는 영문자와 숫자를 제외한 전부.
- 이름 엔티티(
é), 10진수(é), 16진수(é) 중에서 선택합니다. - 결과를 복사합니다. 디코딩할 때는 알 수 없는 엔티티가 목록으로 표시되어 오타를 찾을 수 있습니다.
HTML을 이스케이프하는 이유
HTML에서 특별한 의미를 갖는 문자는 다섯 개입니다. &는 엔티티를 시작하고, <와 >는 태그를 구분하며, "와 '는 속성 값을 닫습니다. 이 문자가 포함된 사용자 입력을 이스케이프 없이 페이지에 넣으면 레이아웃이 깨지거나, 더 나쁘게는 스크립트가 주입될 수 있습니다(크로스 사이트 스크립팅, XSS). 이스케이프하면 이 문자들이 &, <, >, ", '로 바뀌어 브라우저가 텍스트로 표시합니다.
이름, 10진수, 16진수 엔티티
모든 유니코드 문자는 숫자 참조로 쓸 수 있습니다. €라면 10진수 € 또는 16진수 €입니다. 자주 쓰는 문자는 €, ©, 처럼 읽기 쉬운 이름도 있습니다. 숫자 참조는 이름 엔티티를 다섯 개만 정의하는 XML을 포함해 어디서나 동작하고, 이름 엔티티는 소스 코드에서 읽기 쉽습니다.
비 ASCII 문자도 인코딩해야 하나요?
페이지가 UTF-8로 제공된다면 필요 없습니다. 거의 모든 최신 사이트가 그렇습니다(<meta charset="utf-8">). é, ü, 日本 같은 문자는 그대로 써도 됩니다. 레거시 시스템, 이메일 템플릿, 또는 파이프라인이 비 ASCII 텍스트를 망가뜨리는 경우에는 인코딩이 유용합니다.
이스케이프는 문맥에 따라 다릅니다
HTML 엔티티 이스케이프는 요소 내용과 따옴표로 감싼 속성에 들어가는 텍스트를 보호합니다. <script> 블록 안의 값, 인라인 이벤트 핸들러, CSS, URL에는 충분하지 않으며 각각 고유한 인코딩이 필요합니다. 문자열을 직접 조립하기보다 프레임워크의 자동 이스케이프(React, Vue, Jinja, Blade)를 사용하세요.
자주 묻는 질문
HTML에서 어떤 문자를 이스케이프해야 하나요?
&와 <가 필수입니다. 속성 값에서는 사용한 따옴표 문자도 이스케이프하세요. 다섯 개(& < > " ')를 모두 이스케이프하는 것이 안전한 기본값입니다.&nbsp;는 무엇인가요?
&copy2024가 ©2024로 디코딩되는 이유는 무엇인가요?
©, &, < 같은 몇몇 레거시 엔티티를 끝의 세미콜론 없이도 디코딩합니다. 이 디코더도 같은 규칙을 따릅니다. 직접 작성하는 HTML에는 항상 세미콜론을 붙이세요.아포스트로피는 &apos;인가요, &#39;인가요?
'는 HTML5와 XML에서는 유효하지만 HTML 4에서는 아닙니다. 따라서 숫자 참조 '나 '가 가장 호환성이 높으며, 이 인코더도 그렇게 출력합니다.