HTML 파일 만드는 법: 텍스트 문서를 .html 파일로 바꾸는 가장 쉬운 방법
윈도우에서 HTML 파일을 만드는 가장 쉬운 방법을 초보자 기준으로 정리했습니다. 텍스트 문서를 만들고 index.html로 확장자를 변경하는 방법, index.html.txt 문제 해결법, 메모장에서 HTML 파일로 저장하는 방법까지 쉽게 설명합니다.
서론: HTML 파일은 어떻게 만들까?
HTML을 처음 다룰 때 가장 헷갈리는 부분 중 하나가 바로 파일을 어떻게 만드는가입니다. 특히 윈도우에서 마우스 오른쪽 버튼을 눌러 새로 만들기 메뉴를 열어보면, 바로 “HTML 문서”라는 항목이 보이지 않는 경우가 많습니다.
이럴 때는 어렵게 생각할 필요가 없습니다. 가장 쉬운 방법은 텍스트 문서를 먼저 만든 뒤, 파일 이름의 확장자를 .html로 바꾸는 것입니다. 예를 들어 GitHub Pages에 올릴 웹페이지를 만들고 싶다면 파일 이름을 다음과 같이 만들면 됩니다.
index.html이번 글에서는 윈도우에서 HTML 파일을 만드는 방법을 초보자도 따라 할 수 있도록 단계별로 정리해보겠습니다.
본론 1. 가장 쉬운 방법: 텍스트 문서 만들고 확장자 바꾸기
1단계. 새 텍스트 문서 만들기
먼저 HTML 파일을 만들고 싶은 폴더나 바탕화면에서 마우스 오른쪽 버튼을 클릭합니다. 그다음 아래 순서로 이동합니다.
새로 만들기 → 텍스트 문서그러면 보통 이런 이름의 파일이 생성됩니다.
새 텍스트 문서.txt여기까지는 일반적인 메모장 파일입니다. 하지만 이 파일의 이름과 확장자를 바꾸면 HTML 파일로 사용할 수 있습니다.
2단계. 파일 이름을 index.html로 변경하기
생성된 텍스트 문서를 선택한 뒤 이름을 바꿉니다. GitHub Pages에 올릴 메인 페이지라면 파일 이름은 아래처럼 하는 것이 좋습니다.
index.html여기서 중요한 점은 파일 이름 전체가 index.html이어야 한다는 것입니다. index는 파일 이름이고, .html은 파일 확장자입니다. 즉, 이 파일은 “HTML 형식의 웹페이지 파일”이라는 의미입니다.
3단계. 확장자 변경 경고가 나오면 “예” 클릭
파일 이름을 바꾸면 윈도우에서 아래와 비슷한 경고가 나올 수 있습니다.
파일의 확장명을 변경하면 사용할 수 없게 될 수도 있습니다.
변경하시겠습니까?이 경우에는 예를 누르면 됩니다. 지금은 텍스트 파일을 HTML 파일로 바꾸려는 것이므로 정상적인 과정입니다. 변경이 완료되면 파일 아이콘이 브라우저 아이콘처럼 바뀌거나, 파일 형식이 HTML 문서로 표시될 수 있습니다.
본론 2. index.html.txt로 만들어지는 문제 해결하기
초보자들이 가장 많이 겪는 문제가 있습니다. 분명히 파일 이름을 index.html로 바꿨는데, 실제로는 아래처럼 저장되는 경우입니다.
index.html.txt이렇게 되면 겉으로는 index.html처럼 보여도 실제 파일 형식은 여전히 텍스트 문서입니다. GitHub Pages에 올렸을 때도 HTML 파일로 제대로 인식되지 않을 수 있습니다. 이 문제는 보통 윈도우에서 파일 확장명 표시가 꺼져 있기 때문입니다.
파일 확장명 표시 켜는 방법
윈도우 11 기준으로 파일 탐색기 상단 메뉴에서 아래 순서로 이동합니다.
보기 → 표시 → 파일 확장명
여기서 파일 확장명을 체크합니다. 그러면 파일 이름 뒤의 .txt, .html, .css, .js 같은 확장자가 실제로 보이게 됩니다. 이제 파일 이름이 아래처럼 되어 있는지 확인합니다.
index.html.txt
만약 이렇게 되어 있다면 마지막의 .txt를 지우고 아래처럼 바꿔야 합니다.
index.html
이때 다시 확장자 변경 경고가 나오면 예를 누르면 됩니다.
본론 3. 메모장에서 바로 HTML 파일로 저장하는 방법
텍스트 문서를 만든 뒤 이름을 바꾸는 방식도 좋지만, 메모장에서 바로 HTML 파일로 저장할 수도 있습니다.
먼저 메모장을 열고 아래와 같은 간단한 HTML 코드를 입력합니다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>테스트 페이지</title>
</head>
<body>
<h1>HTML 파일 테스트</h1>
<p>GitHub Pages에 올릴 index.html 파일입니다.</p>
</body>
</html>그다음 메모장에서 아래 메뉴를 선택합니다.
파일 → 다른 이름으로 저장저장할 때 설정은 다음과 같이 합니다.
| 항목 | 설정 |
|---|---|
| 파일 이름 | index.html |
| 파일 형식 | 모든 파일 (*.*) |
| 인코딩 | UTF-8 |
여기서 가장 중요한 부분은 파일 형식입니다. 반드시 텍스트 문서 (*.txt)가 아니라 모든 파일 (*.*)을 선택해야 합니다. 그래야 파일이 아래처럼 저장됩니다.
index.html만약 파일 형식을 텍스트 문서로 둔 채 저장하면, 실제 파일 이름이 아래처럼 될 수 있습니다.
index.html.txt따라서 메모장에서 저장할 때는 반드시 모든 파일을 선택하는 것이 중요합니다.
본론 4. HTML 파일이 제대로 만들어졌는지 확인하는 방법
HTML 파일이 제대로 만들어졌다면 더블클릭했을 때 크롬, 엣지, 웨일 같은 브라우저에서 열립니다. 브라우저 주소창에는 보통 아래와 비슷한 주소가 표시됩니다.
file:///C:/Users/사용자명/Desktop/index.html이렇게 열리면 로컬 컴퓨터에서 HTML 파일이 정상적으로 실행되고 있는 것입니다. 만약 브라우저가 아니라 메모장으로 열린다면, 파일 연결 프로그램이 메모장으로 되어 있을 수 있습니다. 이 경우에는 파일을 마우스 오른쪽 버튼으로 클릭한 뒤 아래처럼 선택하면 됩니다.
연결 프로그램 → Chrome 또는 Microsoft Edge
결론: HTML 파일은 텍스트 문서에서 시작하면 된다
윈도우에서 HTML 파일을 만드는 방법은 생각보다 간단합니다. 핵심은 아래 순서입니다.
새로 만들기 → 텍스트 문서
→ 파일 이름을 index.html로 변경
→ 확장자 변경 경고에서 예 클릭
→ 브라우저로 열어서 확인만약 index.html.txt처럼 저장된다면 파일 확장명 표시를 켠 뒤 .txt를 지우면 됩니다. GitHub Pages에 올릴 목적이라면 메인 파일 이름은 반드시 아래처럼 두는 것이 좋습니다.
index.html처음에는 HTML 파일 하나만 만들어도 충분합니다. 그다음 웹페이지나 게임이 조금 복잡해지면 style.css, game.js 파일을 추가해서 구조를 나누면 됩니다. 정리하면, HTML 파일 만들기는 코딩의 첫 단계입니다. 텍스트 문서를 만들고 확장자를 바꾸는 것만 익혀도, 로컬 실행은 물론 GitHub Pages를 활용한 웹 배포까지 시작할 수 있습니다.