특수문자 / 이모지 사용 가이드
특수문자와 이모지의 차이, Unicode 코드와 웹에서 사용하는 방법을 알아봅니다.
특수문자, 이모지, 이모티콘은 어떻게 다른가요?
특수문자
★, →, ✓, ①처럼 일반 문자 외에 기호나 표기를 위해 사용하는 문자입니다.
이모지
😀, ❤️, 🍕처럼 Unicode 표준에 포함된 그림 문자입니다. 기기와 운영체제에 따라 디자인이 달라질 수 있습니다.
텍스트 이모티콘
¯\_(ツ)_/¯, ( •‿• )처럼 여러 문자와 기호를 조합해 표정이나 동작을 표현합니다.
Unicode
전 세계 문자를 하나의 문자 체계에서 다루기 위한 표준이며 각 문자에는 고유한 코드 포인트가 있습니다.
Unicode 코드 포인트
예를 들어 검은 별 ★의 Unicode 코드 포인트는 U+2605입니다. 같은 문자를 환경에 따라 HTML, CSS 또는 JavaScript 코드로 표현할 수도 있습니다.
| 표현 | 예시 |
|---|---|
| 문자 | ★ |
| Unicode | U+2605 |
| HTML | ★ |
| CSS | \2605 |
| JavaScript | \u2605 |
| UTF-8 | E2 98 85 |
웹페이지에서 사용할 때
<p>★ 추천 상품</p>
.badge::before {
content: "\2605";
}
const star = "\u2605";
HTML 문서의 문자 인코딩은 UTF-8로 설정하는 것이 좋습니다. <meta charset="utf-8">을 사용하면 대부분의 특수문자와 이모지를 직접 입력할 수 있습니다.
이모지 표시가 기기마다 다른 이유
Unicode는 어떤 문자인지를 정의하지만 실제 그림 디자인은 각 플랫폼이 구현합니다. 따라서 같은 이모지도 색상, 표정과 세부 모양이 조금씩 다르게 표시될 수 있습니다.
사용할 때 주의할 점
폰트 지원
오래된 운영체제나 일부 폰트에서는 최신 특수문자가 네모 상자로 표시될 수 있습니다.
접근성
화면읽기 프로그램이 기호 이름을 읽을 수 있으므로 장식 문자를 너무 많이 사용하지 않는 것이 좋습니다.
검색과 제목
과도한 특수문자 사용은 제목의 가독성을 떨어뜨릴 수 있습니다. 의미 전달을 우선하세요.
복합 이모지
일부 이모지는 여러 Unicode 문자가 결합된 형태이므로 코드 포인트가 하나가 아닐 수 있습니다.
특수문자와 이모지 찾기
검색, 최근 사용, 즐겨찾기와 조합 복사 기능을 이용할 수 있습니다.
특수문자 / 이모지 열기