HTML Encoder

HTML Encoder / Decoder

`& < > " '` 를 안전한 HTML 엔티티로 이스케이프하거나, 엔티티로 이스케이프된 텍스트를 다시 일반 텍스트로 디코딩합니다. 4가지 인코딩 단계 — Minimal, Named, Numeric, All non-ASCII. UTF-8 + 이모지 + CJK 안전, 모두 브라우저에서.

기본값으로 Minimal을 사용하세요 — HTML 본문 / 속성 컨텍스트를 망가뜨리는 다섯 문자 & < > " '만 이스케이프합니다. 모든 최신 템플릿 엔진이 그렇게 동작합니다. 저작권 / nbsp / 화살표 등을 가독성 있는 코드(&#169; 대신 &copy;)로 표시하고 싶다면 Named entities를 사용하세요. 명명 엔티티를 이해하지 못할 수 있는 파이프라인으로 HTML을 보낼 때는 Numeric을 사용하세요. 엄격하게 ASCII만 허용하는 시스템(레거시 메일 서버, 망가진 API)을 대상으로 할 때는 All non-ASCII를 사용하세요.

&apos;는 XML과 HTML5에서는 유효하지만 HTML 4.01에서는 유효하지 않습니다 — 오래된 브라우저는 이를 그대로 ' 문자열로 렌더링합니다. 숫자 참조 &#39;는 어디서나 동작합니다. 디코더는 호환성을 위해 &apos;도 입력으로 받아들입니다.

입력
출력

안전한 HTML 출력을 위해 만들어진 도구

사용자 콘텐츠를 템플릿용으로 이스케이프하고, 엔티티로 인코딩된 데이터를 디코딩합니다 — 사용하면서 즐거움을 느낄 수 있는 작은 디테일까지 함께.

4가지 인코딩 모드

Minimal은 HTML에서 안전하지 않은 다섯 개의 문자(& < > " ')만 이스케이프합니다 — 일반적인 사용자 생성 콘텐츠에 가장 적합한 기본값입니다. Named는 &copy; / &nbsp; / &hearts; 처럼 가독성 좋은 HTML5 엔티티가 존재할 경우 이를 사용합니다. Numeric은 모든 비-ASCII 코드포인트를 &#NN; 형태로 인코딩합니다. All non-ASCII는 출력 가능한 ASCII 범위 밖의 모든 코드포인트를 인코딩하여 레거시 / ASCII 전용 파이프라인에 적합합니다.

어떤 엔티티든 디코딩

디코더는 명명 엔티티(&copy;), 10진 숫자(&#169;), 16진 숫자(&#xA9;)를 모두 처리합니다. 서러게이트 페어 코드포인트(이모지, 고대 문자)도 UTF-16을 통해 정확히 왕복 변환됩니다.

실시간 미리보기

키 입력마다 출력이 갱신됩니다 — 인코딩 / 디코딩 버튼을 누를 필요가 없습니다. 한 번의 클릭으로 방향을 전환할 수 있고, Swap 버튼은 출력을 다시 입력으로 옮겨 변환을 연이어 적용할 수 있게 해줍니다.

UTF-8 + 이모지 + CJK 안전

모든 유니코드 코드포인트가 왕복 변환됩니다: 中文, العربية, русский, हिंदी, 🎉, Þorgeir. 인코더는 코드포인트 단위로 순회하므로(charAt이 아닌) 서러게이트 페어가 그대로 유지됩니다.

설계 단계부터 프라이버시 우선

텍스트는 기기를 떠나지 않습니다. 인코더, 디코더, 명명 엔티티 테이블 모두 로컬에서 JavaScript로 실행됩니다. DevTools → Network 를 열어 외부 요청이 0건임을 직접 확인할 수 있습니다.

작고 빠릅니다

순수 JavaScript, 프레임워크 런타임 없음. 콜드 로드 크기는 gzipped 25 KB 미만. 100 KB HTML 문서를 5 ms 미만에 인코딩합니다.

HTML 엔티티 인코딩 / 디코딩 방법

원본 텍스트에서 엔티티-안전 출력까지, 단 4단계.

  1. 1

    텍스트 붙여넣기

    일반 텍스트나 HTML을 Input 창에 넣으세요. 무엇이든 좋습니다 — 사용자 댓글, 블로그 게시물, 이모지, CJK, RTL 스크립트. 인코더는 코드포인트 단위로 순회하므로 멀티바이트 시퀀스가 그대로 보존됩니다.

  2. 2

    방향과 모드 선택

    Direction을 Encode (텍스트 → 엔티티) 또는 Decode (엔티티 → 텍스트)로 설정합니다. Encode일 때는 모드를 선택하세요: 템플릿용 Minimal, 가독성 있는 엔티티용 Named, 비-ASCII를 &#NN;으로 표현하는 Numeric, ASCII 전용 출력을 위한 All non-ASCII.

  3. 3

    실시간 미리보기 확인

    출력은 키 입력마다 갱신됩니다. 드롭다운을 바꿔가며 모드를 실시간 비교할 수 있습니다. Swap으로 출력을 다시 입력으로 옮기면 — 왕복 검증(인코드 후 디코드 = 원본)에 유용합니다.

  4. 4

    복사 또는 다운로드

    복사 아이콘으로 결과를 클립보드로 보내거나, 다운로드 아이콘으로 output.encode.html / output.decode.txt로 저장하세요. 크기 차이(입력 → 출력의 문자 / 바이트 수)가 인코딩으로 텍스트가 얼마나 늘었는지 줄었는지 정확히 보여줍니다.

일상적인 웹 개발 작업을 위해 만들어진 도구

프라이버시 우선 브라우저 도구가 임의의 온라인 인코더에 코드를 붙여넣는 것보다 나은 4가지 일반적인 시나리오.

사용자 콘텐츠를 템플릿에 안전하게 삽입

사용자 댓글, 폼 응답, 검색어 — <p>, <li> 또는 속성 안에 들어가는 외부 입력. HTML로 문자열 결합하기 전에 Minimal 모드 인코딩을 거치면, 마크업이 깨지거나 가장 단순한 XSS 페이로드에 당하는 일을 막을 수 있습니다.

API에서 엔티티로 이스케이프된 데이터 읽기

일부 API는 이미 엔티티로 이스케이프된 문자열을 반환합니다 (RSS 피드, 일부 CMS export, 스크래핑한 HTML). 붙여넣고 Decode를 누르면 원본 유니코드를 그대로 돌려받습니다. 디코더는 명명, 10진, 16진 엔티티는 물론 서러게이트 페어까지 처리합니다.

이메일 제목과 메타 태그

<title>, <meta name="description">, <meta property="og:title"> — 모두 특수 문자를 위한 엔티티 이스케이프가 필요합니다. 헤드라인을 한 번 인코딩해 세 곳에 붙여넣으세요.

외부 서비스로 보낼 수 없는 민감한 콘텐츠

내부 CMS 콘텐츠, 고객 데이터, NDA로 보호되는 템플릿 — 클라우드 인코더에 붙여넣을 수 없는 모든 것. 브라우저 전용 도구는 모든 바이트를 사용자의 노트북에 그대로 둡니다. DevTools → Network를 열어 아무것도 빠져나가지 않음을 확인하세요.

100% 비공개 — 브라우저에서 실행

텍스트는 기기를 절대 떠나지 않습니다. DevTools → Network 를 열면 인코딩이나 디코딩 중 외부 요청이 0건임을 확인할 수 있습니다.

  • 인코더, 디코더, 명명 엔티티 조회 테이블 모두 사용자 기기에서 JavaScript로 실행됩니다 — 서버 측 변환도, 외부 API도 없습니다.
  • 서러게이트 페어 코드포인트(이모지, 고대 문자)는 바이트 단위 매핑이 아닌 코드포인트 순회로 처리됩니다 — 따라서 🎉를 붙여넣으면 왕복 후에도 그대로 🎉로 남습니다.
  • 로그인 없음, 텍스트 콘텐츠에 대한 텔레메트리 없음. 쿠키 동의 상태와 언어 설정을 위한 쿠키 단 두 개만 사용합니다.

관련 가이드

HTML 이스케이프, 엔티티 표, 안전한 템플릿팅에 대한 엄선된 글들.

자주 묻는 질문

어떤 모드를 선택해야 하나요?

기본값으로 Minimal을 사용하세요 — HTML 본문 / 속성 컨텍스트를 망가뜨리는 다섯 문자 & < > " '만 이스케이프합니다. 모든 최신 템플릿 엔진이 그렇게 동작합니다. 저작권 / nbsp / 화살표 등을 가독성 있는 코드(&#169; 대신 &copy;)로 표시하고 싶다면 Named entities를 사용하세요. 명명 엔티티를 이해하지 못할 수 있는 파이프라인으로 HTML을 보낼 때는 Numeric을 사용하세요. 엄격하게 ASCII만 허용하는 시스템(레거시 메일 서버, 망가진 API)을 대상으로 할 때는 All non-ASCII를 사용하세요.

왜 `'`를 `&apos;`가 아닌 `&#39;`로 이스케이프하나요?

&apos;는 XML과 HTML5에서는 유효하지만 HTML 4.01에서는 유효하지 않습니다 — 오래된 브라우저는 이를 그대로 ' 문자열로 렌더링합니다. 숫자 참조 &#39;는 어디서나 동작합니다. 디코더는 호환성을 위해 &apos;도 입력으로 받아들입니다.

이모지와 CJK 문자도 잘 보존되나요?

네. 인코더는 코드포인트(UTF-16 코드 단위가 아닌)를 순회하므로 🎉 (U+1F389) 같은 이모지는 인코딩 시 &#127881;이 되고, 디코딩 시 정확히 원래대로 돌아옵니다. CJK도 마찬가지입니다(numeric 모드에서 中文 → &#20013;&#25991;).

인코딩 후 사용자 입력을 HTML에 그대로 삽입해도 안전한가요?

HTML 본문과 속성에 한해서는 — 네, Minimal 모드면 안전합니다. URL 컨텍스트(href="...")에서는 URL 인코딩도 함께 필요합니다. 인라인 JavaScript나 CSS의 경우에는 HTML 인코딩이나 URL 인코딩만으로는 충분하지 않습니다 — 해당 컨텍스트를 이해하는 적절한 템플릿 엔진을 사용하세요. 절대 이스케이프되지 않은 사용자 입력을 <script> 블록 안에 붙여넣지 마세요.

서버로 전송되는 데이터가 있나요?

아니요. 인코더, 디코더, 명명 엔티티 조회 테이블 모두 사용자 기기에서 JavaScript로 실행됩니다. DevTools → Network 를 열어 보면 인코딩이나 디코딩 중 외부 요청이 0건임을 확인할 수 있습니다. 비밀 정보, 고객 데이터, 내부 템플릿 — 어느 것도 노트북을 떠나지 않습니다.