HTML(Hypertext Markup Language)은 웹 문서를 만들기 위하여 사용하는 가장 기본적인 웹 언어의 종류 중 하나다. 하이퍼 텍스트를 작성하기 위해서 만들어진 언어다.
지금 이렇게 인터넷으로 검색해서 보는 자료들 모두가 html 문서를 바탕으로 되어 있으며, 웹사이트 제작, 블로그 만들기 등 웹으로 무엇 인가를 만드려면 html 작성과 파일을 생성해서 온라인으로 올려야 된다.
이런 작업을 하기 전에 우선 html 파일을 만들 수 있는 여러가지 방법들 중 가장 편하고 기본적 인 것을 정리해보도록 하겠다.
HTML 파일 생성하기
1) 윈도우 메모장으로 만들기(notepad)
키보드에서 윈도우키 눌림 -> notepad 입력 -> 메모장 앱이 나타나면 클릭.
좌측 하단 윈도우 아이콘 메뉴를 클릭해서 notepad 입력을 해도 상관없다.
리눅스 사용자의 경우 gedit, nedit, vim, pico, vi 같은 문서 편집기 메모장을 이용하면 된다.
맥 사용자는 파인더(Finder) -> 응용 프로그램 -> 텍스트 편집기를 이용하면 된다.
메모장이 생성되었다면 html 코드를 입력해준다. 가장 기본이 되는 코드이기 때문에 메모장에 그대로 작성하도록 한다.
<!DOCTYPE html><html lang="ko-KR"><head><meta charset="UTF-8"><title>테스트 html 페이지</title></head><body>
<p>테스트 html 페이지</p>
</body></html>
html은 웹프로그래밍 언어라서 컴퓨터가 알아들을 수 있도록 만들어줘야 된다. <!DOCTYPE html> 문서가 html라는 뜻이고, <html lang=”ko-KR”> 한국어로 되어 있는 문서라는 뜻이다.
<head> 부분은 문서를 알려주는 시작점이라고 생각하면 되고, <meta charset=”UTF-8″> 현재 문서의 포맷방식은 utf-8로 되어 있다는 뜻이다.
<title>테스트 html 페이지</title> 우리가 웹사이트 접속시 상단 가로부분에 나타나는 현재 페이지의 이름을 말해준다.
<body>는 html 문서가 실질적으로 사용자에게 보여주는 시작점이다. <p>테스트 html 페이지</p> 한 줄 글을 작성하고 다음줄바꿈을 한다는 뜻이다.
기본적으로 html 문서는 시작점과 종료점이 있는데, </body>, </html> 같이 닫아줘야 된다.
문서를 저장하도록 한다. Ctrl + S 단축키를 눌러도 되고, 상단 파일 -> 저장 버튼을 클릭해도 된다.
파일 이름은 .html 형태로 작성한다. index.html, test.html 형태로 작성되었다면 저장 버튼을 클릭한다.
크롬브라우저, IE 브라우저, 엣지 브라우저를 이용해서 페이지를 열어보면 정상적으로 html 문서를 열어볼 수 있게 된다.
2) 윈도우 워드패드로 만들기(wordpad)
윈도우 워드패드를 이용해서 html 파일을 만들 수 있다.
윈도우 시작 버튼 -> 워드패드 입력하면 프로그램이 실행된다.
html 코드를 작성하고 저장을 하는데, 확장자를 .html 형태로 저장한다.
언어 셋 오류로 인해서 한글이 깨지기는 하지만 영문은 문제 없이 출력 된다. 한글 깨지는 현상은 html 문서를 만들면서 별도로 지정하면 된다.
3) 에디트플러스(EditPlus) 프로그램으로 만들기
텍스트(text)편집기가 가능한 프로그램을 이용하면 되는데, 웹프로그래밍 언어 문서를 손쉽게 만들 수 있는 에디트플러스를 사용해도 된다.
새로운 문서를 만들때 html 문서를 선택하면 기본적인 문서작성방식에 대해서 자세히 나타난다.
DOCTYPE, head, body 같은 수식을 작성할 필요 없이 문서를 만들 수 있게 된다.
html 문서를 작성하고 .html 형태로 파일을 생성 후 크롬브라우저, 인터넷익스플로러 브라우저로 html 파일을 열어보면 정상적으로 html 파일 생성이 된 것을 확인할 수 있다.
HTML 문서 만드는 프로그램 종류
그밖에 html 문서를 만들 수 있는 프로그램이 여러가지가 존재한다. Text Editor, 스마트워드, 심플워드, notepad++, 폴라리스 오피스, 울트라에디트, desyedit, 이지패드, notepad3 등 여러가지 text 문서 편집 툴이 있기 때문에 마음을 드는것을 이용해야 된다.
기본적으로 윈도우 메모장을 통해서 html 문서, css 파일, php 파일 등 기본적인 웹프로그래밍 언어를 만들어서 배포할 수 있다. 조금 더 html 문서를 효율적으로 만든다면 위에 설명한 프로그램을 이용하면 작업을 조금 더 편하게 할 수 있다는 장점이 있다.