HTML이 뭔가요?
HTML은 웹페이지를 만드는데 가장 기본이되는 기술로 태그라고 불리우는 열고 닫는 괄호쌍을 통해서 문서를 표현하는 기술입니다.
인터넷의 모든페이지는 기본적으로 HTML을 통해서 구성되며 그HTML인터넷을 통해 받아와 브라우져로 우리가 이를 볼수 있는것입니다. HTML은 바로 브라우져에서 마우스 오른쪽버튼이나 상단메뉴에서 "소스보기"를 선택하면 볼수 있습니다,
웹의 기본은HTML로 멋진 웹페이지를 만들고 싶다면 HTML부터 배워야 하는데 보통 나모나 드림위버같은 위지익프로그램을 쓰면 직접적으로 HTML을 만지지 않고 HTML을 손쉽게 만들수 있다는 장점이 있습니다,
그러나 사용하는것은 편하지만 태그에 대한 이해가 느려지고 약간은 쓸데없는 코드를 생성하기도 하고(점점 줄고는 있지만...) 세부적인 작성이 어렵다는 단점이있습니다.
그러므로 처음은 약간 어렵다 하더라고 html을 완전히 익히는것이 멋진 웹페이지를 만드는데 든든한 밑천이 되니 약간 어렵더라도 잘 익혀봅시다. 세상모든것이 그렇듯이 처음엔 어려워 보여도 알고나면 쉬워질겁니다.
그럼 만들어 볼까요?
HTML은 태그라고 불리는 괄호쌍으로 표현되며 태그는 <태그></태그> 식으로 이루어집니다.
태그와 태그 사이에는 관련 내용이 <태그>내용</태그> 들어가거나 관련 속성 <태그 속성="속성값"></태그>이 들어갈수 있으며 물론 속성과 내용이 같이 들어 갈수도 있고 <태그 속성="속성값">내용</태그>
속성을 여러개 줄수도 있으며 태그와 태그 사이어 다른 태그가 올수도 있습니다,
단 태그안에 태그가 있을때는 나중에 연 태그를 먼저 닫아줘야 합니다.
바른 예
<태그 1>
<태그 2>
</태그 2>
</태그 1>
잘못된 예
<태그 1>
<태그 2>
</태그 1>
</태그 2>
또한 태그안에 아무런 내용이 없을때는 <태그></태그> 대신에 간단히 <태그 />로 쓸수 있습니다.
<태그></태그> = <태그 />
또한 태그는 대문자로 써도 되지만 원칙은 소문자이며 속성값의 따옴표도 작은 따옴표도 써도 되지만 원칙적으로 쌍따옴표로 해줘야 합니다. 원칙대로 하는게 가장 좋겠지요??
어느 사이트던지 소스보기를 하면 이런식으로 구성되어 있다는것을 볼수 있습니다.
그럼 우리도 직접 HTML을 만들어 봅시다
우선 제일먼저 HTML태그를 써야 합니다.
모든 HTML문서는 HTML태그가 열리며 시작되며 HTML닫기로 끝난다는것을 명심하고 메모장으로 다음과 같이 적고 HTML파일로 저장합니다.
가장 간단한 HTML문서
<html>
</html>
그리고 브라우져로 실행하여 봅니다.
물론 아무것도 나오지 않겠지만 이렇게 우리는 HTML문서를 만들었습니다.
기본적으로 쓰는 태그가 또 2개가 있는데 바로 HEAD와 BODY입니다..
머리(HEAD)와 몸통(BODY)이 있어야 제대로 된 HTML문서가 되겠지요?
근데 인터넷 세상에는 머리가 없는 HTML과 몸통이 없는 HTML문서도 떠돌거 있는게 현실입니다. ^^ 우리는 그러지 맙시다~
그러므로 다음과 같이 작성합니다
이제좀 제대로된 HTML문서
<html>
<head>
</head>
<body>
</body>
</html>
하지만 역시 내용이 없으니 아무것도 나오지 않겠지요.... 그럼 body사이에 아무런 글씨라도 넣어봅니다. 글씨가 출력 될겁니다. 이제 가장 기본인 html,head,body를 익혔습니다.
다음은 문서 제목을 넣는 title입니다. title도 반드시 들어야할 요소임에도 title없는 문서들이 많이 있지요. 무제의 문서들~ -.-;;
제목(title) 이 넣어진 제대로된 HTML문서
<html>
<head>
<head>제목<head>
<head>
<body>
내용 들어갈 자리
</body>
</html>
드디어 제목도 들어간 제대로된 html을 만들었습니다,
찹 쉽죠잉??~~
앞으로 모든 문서는 제런식으로 구성되겠지요?
그럼 다음 기본 태그들을 익혀보아요~~