Pagina nu e încă în română, așa că o vezi în limba originală.

HTML 파일을 열었더니 한글이 깨져요. 이미지가 안 보일 때도 고치는 방법

짧은 답

HTML 파일의 한글이 깨지는 건 대부분 파일을 저장한 문자 인코딩(UTF-8이나 EUC-KR)과 브라우저가 읽는 인코딩이 다르거나, 파일 안에 인코딩 선언이 없어서예요. <head> 바로 뒤에 <meta charset=\"utf-8\">을 넣고 파일을 UTF-8로 다시 저장하면 고쳐져요. 이미지가 안 보이는 건 이미지가 HTML과 다른 파일이라서, HTML만 보내면 함께 가지 않기 때문이에요.

내 HTML 파일을 링크로 만들기

무료 요금제: 카드 없이 가입, 동시에 게시하는 페이지 1개

이 페이지의 내용

ChatGPT가 만들어 준 HTML 파일을 아이폰으로 열었더니 알아볼 수 없는 한글과 한자가 뒤섞여 나왔어요. 메모장에서 고친 페이지는 브라우저에서 물음표가 든 마름모(�)투성이가 됐어요. 이미지 자리에는 깨진 아이콘만 보여요.

대부분은 파일이 망가진 게 아니에요. 읽는 쪽이 저장할 때와 다른 문자 인코딩으로 읽었거나, 이미지 파일이 함께 오지 않았을 뿐이에요. 이 글은 깨진 모습으로 원인을 찾고 고치는 방법, 그리고 이미지가 안 보일 때 고치는 방법을 다뤄요. Chrome과 아이폰에서는 2026년 10월 25일에 같은 파일을 열어 확인했어요. 글자는 멀쩡한데 코드만 보이거나 버튼이 안 눌린다면 아이폰에서 HTML 파일 여는 방법이나 갤럭시에서 HTML 파일 여는 방법을 보세요.

내가 만든 파일을 다른 사람에게 보여 주려고 왔다면, 이 페이지 맨 위의 업로드 상자에 파일을 넣어 보세요. 가입 없이 미리보기 링크가 생겨요. 이 링크는 3분 동안만 열리고 스크립트와 폼이 꺼져 있어요. ‘이 페이지 보관하기’를 누르고 무료로 가입하면 페이지가 내 계정으로 옮겨지고, 그때부터 스크립트가 동작해요.

깨진 모습으로 원인 알기

글자가 깨지는 건 파일을 저장한 문자 인코딩과 읽을 때 쓴 인코딩이 서로 다를 때예요. 한국어 HTML 파일에서 자주 만나는 건 UTF-8과 EUC-KR 두 가지예요. HTML 표준을 만드는 WHATWG는 HTML 파일을 UTF-8로 쓰라고 정해 두었어요. 그래도 Windows 메모장의 ANSI처럼 UTF-8이 아닌 인코딩으로 저장된 파일이 있어요.

어느 쪽으로 어긋났는지는 깨진 모습으로 알 수 있어요. ‘안녕하세요.’가 이렇게 나왔다면 원인은 다음과 같아요.

보이는 모습예원인고치는 방법
엉뚱한 한글과 한자가 물음표 마름모(�)와 섞여요�덈뀞�섏꽭��.파일은 UTF-8인데 EUC-KR로 읽혔어요<meta charset="utf-8">을 넣어요. euc-kr이라고 쓴 줄은 지워요
글자 대부분이 물음표 마름모(�)예요�ȳ��ϼ���.파일은 EUC-KR인데 UTF-8로 읽혔어요UTF-8로 다시 저장하고 <meta charset="utf-8">을 넣어요

예는 아래 시험에서 Chrome에 실제로 나온 글자예요. 아이폰의 파일 앱 미리보기에서도 첫 번째 줄처럼 한글, 한자(源), 물음표 마름모가 섞여 나왔어요.

어느 앱에서 깨지나요

같은 파일이라도 여는 앱에 따라 깨지기도 하고 멀쩡하기도 해요. 인코딩 선언이 없으면 앱이 짐작해서 읽기 때문이에요. WHATWG의 HTML 표준에서는 선언이 없을 때 브라우저가 내용을 보고 인코딩을 짐작해도 되고, 짐작하지 않을 때의 기본값은 브라우저가 정하는데 보통 사용자의 지역에 따라 달라요. 표준의 표가 권하는 한국어 기본값은 EUC-KR이에요.

다섯 가지 파일을 만들어 2026년 10월 25일에 열어 본 결과예요. ‘한자 섞임’은 위 표의 첫 번째 모습, ‘� 대부분’은 두 번째 모습이에요. Chrome은 macOS 26.5.2에서 한국어로 설정해 열었어요. 아이폰은 Apple의 iPhone 시뮬레이터(iOS 26.5, iPhone 17 Pro, 언어 한국어)에서 파일 앱에 저장하고 눌러서 연 훑어보기 미리보기예요.

파일 내용Chrome 155(Mac)아이폰 파일 앱(iOS 26.5)Convika HTML 뷰어
UTF-8, <meta charset="utf-8"> 있음잘 보여요잘 보여요잘 보여요
UTF-8, 선언 없음잘 보여요깨져요(한자 섞임)잘 보여요
EUC-KR, 선언 없음잘 보여요잘 보여요깨져요(� 대부분)
EUC-KR, <meta charset="utf-8"> 있음깨져요(� 대부분)확인하지 않았어요깨져요(� 대부분)
UTF-8, <meta charset="euc-kr"> 있음깨져요(한자 섞임)깨져요(한자 섞임)깨져요(한자 섞임)

헷갈리기 쉬운 건 두 번째 줄이에요. 코드 일부만 복사하거나 <head>를 지우면 UTF-8 파일에서 선언이 사라져요. 그러면 Chrome은 내용을 보고 UTF-8이라고 판단해 잘 보여 줬지만, 아이폰 미리보기에서는 깨졌어요. 만든 사람의 Chrome에서는 멀쩡한데 받은 사람의 아이폰에서는 깨지는 일이 이렇게 생겨요.

첫 번째 줄처럼 선언과 내용이 맞으면 시험한 모든 앱에서 잘 보였어요. 고칠 때는 이 모양으로 맞추면 돼요. 한국어로 설정한 Mac의 Safari와 실제 갤럭시는 확인하지 않았어요.

한글 깨짐을 고치는 4단계

1. 깨진 모습 보기

위의 첫 번째 표에서 어느 쪽인지 확인하세요. 엉뚱한 한글과 한자가 섞이면 파일은 UTF-8이라서 선언만 고치면 돼요. 글자 대부분이 물음표 마름모라면 파일이 UTF-8이 아니라서 다시 저장해야 해요.

2. HTML 뷰어로 열어 보기

헷갈리면 무료 HTML 뷰어에서 ‘HTML 파일 선택’으로 파일을 열어 보세요. 뷰어는 파일 맨 앞의 BOM이나 <meta charset>에 적힌 인코딩으로 읽고, 둘 다 없으면 UTF-8로 읽어요. 선언 없는 파일이 여기서 잘 보이면 내용은 UTF-8이에요. 물음표 마름모가 나오면 EUC-KR 같은 다른 인코딩이에요. 열기만 하면 파일은 Convika 서버로 가지 않아요. 모르는 사람이 보낸 파일이라면 보낸 사람에게 먼저 확인하고, 뷰어의 ‘스크립트 실행’을 끈 다음 여세요.

3. <head> 바로 뒤에 <meta charset="utf-8"> 넣기

텍스트 편집기로 파일을 열고 <head> 바로 다음 줄에 아래 한 줄을 넣으세요. charset을 쓴 다른 줄이 있으면 지우세요.

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8">

WHATWG 표준에서 이 선언은 파일 맨 앞에서 1024바이트 안에 있어야 해요. W3C도 <head> 시작 태그 바로 뒤에 두라고 권해요.

4. UTF-8로 다시 저장하고 다시 열기

선언을 넣어도 파일 자체가 EUC-KR이면 깨져요(두 번째 표의 네 번째 줄). W3C는 UTF-8로 선언했다면 파일도 UTF-8로 저장해야 한다고 적어 두었어요. 메모장과 텍스트 편집기에서 저장하는 방법은 다음 절에 있어요. 저장한 뒤 브라우저나 뷰어에서 다시 열어 확인하세요.

메모장과 텍스트 편집기에서 UTF-8로 다시 저장하기

Windows 메모장

Microsoft는 2018년 12월 10일 Windows Insider 블로그(Windows 10 Insider Preview 빌드 18298)에서, 메모장이 새 파일을 BOM 없는 UTF-8로 저장하는 것을 기본값으로 바꾸고 아래쪽 상태 표시줄에 문서의 인코딩을 보여 주게 했다고 발표했어요. 상태 표시줄에 UTF-8이 아닌 인코딩이 보이면 다시 저장하세요.

  1. 메모장에서 파일을 열어요.
  2. ‘파일’ 메뉴에서 ‘다른 이름으로 저장’을 클릭해요.
  3. 대화 상자 아래쪽의 인코딩을 고르는 칸에서 UTF-8을 고르고 저장해요.

이 칸에서 인코딩을 바꿔 저장하는 흐름은 Microsoft의 개발자 문서 「INF 파일의 일반 유니코드 요구 사항」에 메모장을 예로 나와 있어요. 이 칸에 ANSI라고 보이면 UTF-8이 아니에요. Microsoft 설명에서 ANSI는 Windows의 코드 페이지를 가리켜요. 코드 페이지 표에서 한국어는 949번 ‘ANSI/OEM 한국어(통합 한글 코드)’이고, 이름은 ks_c_5601-1987이에요. WHATWG 인코딩 표준에서 ks_c_5601-1987과 windows-949는 EUC-KR을 가리키는 이름이라서, 브라우저는 이 인코딩을 EUC-KR로 다뤄요. 같은 표에는 코드 페이지가 컴퓨터마다 다를 수 있으니 UTF-8 같은 유니코드를 쓰라는 메모도 있어요. Windows 11 메모장 화면은 확인하지 않았어요.

Mac 텍스트 편집기

Apple의 텍스트 편집기 사용 설명서에 따르면, 텍스트 편집기는 HTML 파일을 브라우저처럼 서식이 있는 텍스트로 보여 줘요. 그대로 고치면 곧은 따옴표가 둥근 따옴표로 바뀌어요. 코드로 고치려면 이렇게 여세요.

  1. ‘텍스트 편집기’ > ‘설정’ > ‘열기 및 저장하기’에서 ‘HTML 파일을 서식있는 텍스트가 아닌 HTML 코드로 표시’를 선택해요.
  2. 글자가 깨져 보이면 ‘파일’ > ‘열기’에서 파일을 선택하고(아직 열지 말고), 윈도우 왼쪽 아래의 ‘옵션 보기’를 클릭해요. ‘일반 텍스트 인코딩’ 팝업 메뉴에서 인코딩을 고른 다음 ‘열기’를 클릭해요.
  3. 저장할 때의 기본 인코딩도 같은 ‘열기 및 저장하기’에서 골라요. Apple 설명에서 ‘일반 텍스트 파일 인코딩’은 일반 텍스트 파일을 열고 저장할 때의 기본값이고, ‘HTML 저장 옵션’의 ‘인코딩’은 HTML 파일을 저장할 때의 기본값이에요.

텍스트 편집기에서 인코딩을 바꿔 다시 저장하는 과정은 이 글에서 직접 해 보지 않았어요. 저장한 뒤 4단계처럼 다시 열어 확인하세요.

카카오톡으로 받은 파일이 깨질 때

카카오톡으로 오는 건 파일 그 자체라서, 어떻게 읽을지는 받은 사람의 앱이 정해요. 보낸 사람의 Chrome에서는 멀쩡한데 받은 사람의 아이폰에서는 깨지는 일이 생겨요(두 번째 표의 두 번째 줄). 이 글에서는 카카오톡 안에서 파일을 열어 보지는 않았어요.

  • 받은 사람은 보낸 사람에게 <meta charset="utf-8">을 넣어 다시 보내 달라고 하거나, 링크로 보내 달라고 하세요.
  • 받은 파일을 바로 보고 싶다면 HTML 뷰어에서 여세요. 선언 없는 UTF-8 파일도 잘 보여요. 모르는 사람이 보낸 파일은 열기 전에 보낸 사람에게 확인하고 ‘스크립트 실행’을 끄세요.

갤럭시에서 카카오톡으로 받은 파일을 찾는 곳은 갤럭시에서 HTML 파일 여는 방법에 적어 두었어요.

이미지가 안 나올 때

HTML 파일 안의 <img src="cat.jpg">나 <link rel="stylesheet" href="style.css">는 같은 폴더에 있는 다른 파일을 가리켜요. HTML 파일만 보내면 그 파일들은 함께 가지 않아요. 2026년 10월 25일에 Chrome 155에서 해 보니, 이미지와 CSS를 같은 폴더에 둔 페이지는 둘 다 불러왔어요. HTML 파일만 다른 폴더로 옮기자 이미지는 깨진 아이콘이 됐고, 제목 색을 정하던 CSS도 빠졌어요. C:\Users\…\Pictures\cat.jpg처럼 내 컴퓨터 안의 위치를 쓴 경우도 마찬가지예요. HTML 뷰어로 열면 불러오지 못한 파일 이름이 페이지 아래에 나와요. CSS와 JavaScript를 HTML 파일 안에 쓰고, 이미지는 https://로 시작하는 주소로 바꾸면 돼요. 아이폰 파일 앱의 미리보기는 https://로 시작하는 이미지도 불러오지 않아요(Convika가 iOS 26.3 시뮬레이터에서 확인, 아이폰에서 HTML 파일 여는 방법). 휴대폰으로 보는 사람에게는 페이지를 게시해서 링크로 보내세요.

파일을 만든 AI에게는 이렇게 부탁하면 돼요.

CSS와 JavaScript를 HTML 파일 하나에 넣어 주세요. 이미지는 https://로 시작하는 주소로 바꿔 주세요. 문자 인코딩은 UTF-8로 하고 <meta charset="utf-8">을 넣어 주세요.

링크로 보내기: 받는 사람의 설정과 상관없이

Convika의 업로드 상자에 파일을 넣으면 뷰어와 같은 규칙(BOM, <meta charset>, 둘 다 없으면 UTF-8)으로 글자를 읽고 UTF-8로 저장해요. 게시한 페이지는 인코딩이 UTF-8이라고 알려 주면서 보내요. WHATWG 표준에서 브라우저는 이 알림을 파일 안의 선언이나 지역별 기본값보다 먼저 봐요.

2026년 10월 25일에 일본어로 설정한 Mac의 Safari 26.5.2에서 선언 없는 UTF-8 파일을 파일로 열면 깨졌지만, ‘UTF-8’이라는 알림과 함께 보내면 한글이 잘 보였어요. 뷰어에서 잘 보인 파일이라면 링크로 만들어도 같은 글자로 열려요.

  1. 이 페이지 맨 위의 업로드 상자에 파일을 넣거나, ‘코드 붙여 넣기’로 바꿔 코드를 붙여 넣고 ‘미리보기 링크 받기’를 눌러요. 가입하지 않아도 돼요.
  2. ‘미리보기 열기’로 한글이 깨지지 않았는지 확인해요. 이 링크는 3분 동안만 열리고 스크립트와 폼이 꺼져 있어서, 다른 사람에게 보내는 링크가 아니에요.
  3. ‘이 페이지 보관하기’를 누르고 무료로 가입하면 페이지가 내 계정으로 옮겨지고 스크립트가 동작해요.
  4. 대시보드에서 ‘페이지 게시하기’를 누르세요. ‘누가 이 페이지를 열 수 있나요?’에서 ‘전체 공개’를 고르고 ‘다음’을 누르세요. 처음 게시할 때는 ‘무료로 게시하기’ 버튼이 크게 나오고, 그 아래에 Pro의 ‘Convika 배너 없이 게시하기’가 있어요. 무료로 쓰려면 ‘무료로 게시하기’를 누르세요. 무료 요금제 페이지에는 맨 아래에 작은 Convika 배너가 붙어요.
  5. 게시한 페이지의 링크를 카카오톡이나 메일에 붙여 넣어 보내요.

게시 화면의 순서와 다른 보내는 방법과의 차이는 HTML 파일을 링크로 공유하는 방법에 정리했어요.

자주 묻는 질문

HTML 파일 한글이 깨지는 이유는?

파일을 저장한 문자 인코딩과 읽는 쪽이 쓴 인코딩이 달라서예요. 흔한 경우는 UTF-8 파일에 <meta charset="utf-8">이 없어서, 앱이 한국어 기본값인 EUC-KR로 읽는 거예요. 2026년 10월 25일 시험에서 이 파일은 iOS 26.5 파일 앱 미리보기(언어 한국어)에서 깨졌고, Chrome 155에서는 잘 보였어요.

HTML 한글 깨짐 해결 방법은?

<head> 바로 뒤에 <meta charset="utf-8">을 넣고 파일을 UTF-8로 다시 저장하세요. 선언은 파일 맨 앞에서 1024바이트 안에 있어야 해요(WHATWG). 선언만 고치고 파일이 EUC-KR 그대로면 물음표 마름모가 나오니, 메모장이라면 ‘다른 이름으로 저장’에서 인코딩을 UTF-8로 골라 다시 저장하세요.

아이폰에서 HTML 파일 한글이 깨져요

선언 없는 UTF-8 파일을 파일 앱 미리보기가 다른 인코딩으로 읽어서예요. iOS 26.5 시뮬레이터(언어 한국어)에서 선언 없는 파일은 한글, 한자, 물음표 마름모가 섞여 깨졌고, <meta charset="utf-8">을 넣은 파일은 잘 보였어요. 만든 사람에게 선언을 넣어 달라고 하거나, Safari에서 HTML 뷰어를 열어 파일을 고르세요.

메모장으로 저장한 HTML이 깨져요

파일의 인코딩과 파일 안의 선언이 맞지 않아서예요. EUC-KR로 저장한 파일에 <meta charset="utf-8">이 있으면, 시험한 Chrome과 Convika 뷰어 모두 물음표 마름모로 깨졌어요. 메모장 아래쪽 상태 표시줄에서 인코딩을 확인하고, ‘다른 이름으로 저장’에서 UTF-8로 다시 저장하세요.

크롬에서 인코딩을 바꿀 수 있나요?

아니요. Chromium은 2016년 8월에 인코딩을 직접 고르는 메뉴를 없애고, 내용을 보고 판단하는 방식으로 바꿨어요(변경 「Remove text encoding UI」). 2026년 10월 25일 Chrome 155에서 선언 없는 파일은 UTF-8도 EUC-KR도 잘 보였어요. 선언과 내용이 다른 파일은 깨졌으니 파일 쪽을 고치세요.

HTML 파일 이미지가 깨지는 이유는?

이미지가 HTML과 다른 파일이라 함께 오지 않아서예요. Mac의 Chrome 155에서 HTML 파일만 다른 폴더로 옮기자 이미지가 깨진 아이콘이 됐어요. 아이폰 파일 앱의 미리보기는 https://로 시작하는 이미지도 불러오지 않아요(Convika가 iOS 26.3 시뮬레이터에서 확인). 휴대폰으로 보는 사람에게는 페이지를 게시해서 링크로 보내세요.

HTML 뷰어로 열면 한글 깨짐이 고쳐지나요?

선언 없는 UTF-8 파일이라면 네, 잘 보여요. 뷰어는 BOM도 <meta charset>도 없는 파일을 UTF-8로 읽기 때문이에요. 선언 없는 EUC-KR 파일은 물음표 마름모로 깨지고, <meta charset="euc-kr">이 적혀 있으면 그 인코딩으로 읽어요.

출처

관련 글

한국어 가이드 더 보기

이 글 공유하기

파일 대신, 어느 기기에서나 같은 글자로 열리는 링크 보내기

HTML 파일이나 코드를 올려 게시하면, 받는 사람 기기의 언어 설정과 상관없이 UTF-8 페이지로 열려요.

내 HTML 파일을 링크로 만들기

무료 요금제: 카드 없이 가입, 동시에 게시하는 페이지 1개