메모장이나 TextEdit을 사용하자.
웹 페이지는 전문 HTML 편집기를 사용하여 만들고 수정할 수 있다. 하지만 HTML 학습에는 메모장(PC)이나 TextEdit(Mac)과 같은 간단한 텍스트 편집기를 사용하는 것이 좋다. 간단한 텍스트 편집기를 사용하는 것이 HTML을 배우는 좋은 방법임. 아래 단계를 따라 메모장이나 TextEdit으로 첫 번째 웹 페이지를 만들어보자.
1단계: 메모장(PC)
Windows 8 이상:
시작 화면 (화면 왼쪽 하단의 창 모양 아이콘). 메모장 입력
Windows 7 또는 이전 버전:
시작 > 프로그램 > 보조 프로그램 > 메모장
1단계: TextEdit(Mac용)
Finder를 열고 응용 프로그램 > TextEdit을 선택
또한, 애플리케이션이 파일을 올바르게 저장하도록 몇 가지 설정을 변경. 환경 설정 > 형식 > "일반 텍스트"를 선택.
그런 다음 "열기 및 저장"에서 "HTML 파일을 서식이 지정된 텍스트 대신 HTML 코드로 표시"라는 확인란을 선택.
그런 다음 새 문서를 열어 코드를 삽입.
2단계: HTML 작성
다음 HTML 코드를 메모장에 입력하거나 복사
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
3단계: HTML 페이지 저장
파일을 컴퓨터에 저장. 메모장 메뉴에서 파일 > 다른 이름으로 저장을 선택
파일 이름을 "index.htm" 으로 지정 하고 인코딩을 UTF-8 (HTML 파일에 권장되는 인코딩)로 설정
팁: 파일 확장자는 .htm 또는 .html 중 어느 것을 사용해도 됨. 둘 사이에 차이는 없으니 원하는 대로 선택.
4단계: 브라우저에서 HTML 페이지를 확인.
저장된 HTML 파일을 원하는 브라우저에서 연다. (파일을 두 번 클릭하거나 마우스 오른쪽 버튼을 클릭하고 "연결 프로그램"을 선택) 결과는 대략 다음과 같음.
'HTML' 카테고리의 다른 글
| html 6. 제목 (0) | 2026.05.25 |
|---|---|
| html 5. 속성 (0) | 2026.05.25 |
| html 4. 요소 (0) | 2026.05.25 |
| html 3. 기본 예제 실습 (0) | 2026.05.25 |
| html 1. 개요(요소, 구조) 및 기초 실습 (0) | 2026.05.25 |