프로그래밍 ) HTML5의 간단한 소개 및 태그 사용방법 및 설명





인터넷 IT 강국인 대한민국에서 컴퓨터를 접하기란 쉬운 일입니다. 어릴때부터 컴퓨터만큼은 부모님께서 지원해주신 덕분에 컴퓨터를 쉽게 접할 수 있었습니다. 게임도 좋아해서 많이 혼다곤 했지만, 어릴 때부터 나모웹에디터를 비롯한 인터넷 홈페이지를 만들어주는 프로그램에 대한 관심도 많았었죠.

학년이 올라가다보면서 프로그램에 대한 교육도 받고, 코딩수업도 진행되었었는데요. 그때 처음 접한 프로그래밍 언어가 HTML이었습니다. 어디서 많이 들어 본 영어였습니다. 프로그래밍언어를 배운다고 했을 때 머리부터 아팠지만, HTML은 달랐습니다. 비교적 쉬운 태그에 규칙만 지켜지면, 작성한 코딩대로 결과물이 나왔었죠. 이에 대한 매력과 HTML의 빠른 발전에 이어 많은 기능을 경험할 수 있었던 계기가 되었습니다.

몇 년이 지난 지금은 이 전에 열심히 했던 기억을 되살려 다시 공부하고자 이렇게 포스팅을 하게되었습니다. 처음 프로그래밍 언어를 접하시는 분들에게 쉽게 다가갈수 있는 프로그래밍 언어가 HTML인 것 같습니다. 개인 차가 있겠지만, 다른 프로그래밍 언어(JAVA,JSP 등등)에 비해 단순하고, 쉽다는 것을 알게 될 것 입니다.

먼저 배우기 전 HTML에 대해 간단하게 알아 보도록 하겠습니다.




1. HTML은 HyperText MarkupLanguage의 약자입니다.

2. 웹 문서를 만들기 위한 기본적 프로그래밍 언어의 한 종류입니다.

간략하게 말씀을 드리자면 HTML은 웹 문서를 만들기위한 언어의 한 종류이며, 하이퍼텍스트를 이용하여 페이지를 이동할 수 있는 언어입니다.









HTML의 기본적인 Tag에 대해 알아보겠습니다. TagHTML에서 쓰이는 요소라고 생각하시면 됩니다. 요소를 비유하여 말하면, 부품(?)이라고 볼 수도있겠네요. 각 부품이 가지고 있는 기능을 합쳐서 하나의 제품이 나오는 것처럼요.

Tag의 종류는 무수히 많은데, 기본적으로 태그를 쓰일 때는 "<>" (꺽쇠괄호)를 사용하며, 시작되는 태그가 있다면 끝나는 종료태그도 선언을 해주어야 합니다.




HTML 기본이자 기본인 HTML 태그입니다. HTML 프로그래밍을 시작할 때 사용해주며, 없으면 안되는 태그입니다. <HTML>로 시작하여 <HTML>로 끝이 나야하는데, <HTML>로 태그를 선언을 하였다면, 위에서 말했듯이 끝나는 태그를 선언을 해주어야하는데, <HTML>의 H 앞에 " / " (역슬레시)를 </HTML> 이렇게 선언을 해주시면 됩니다. 시작태그는 있는데, 종료태그가 없다면, 나중 결과물을 보았을 때 코딩된 내용과 다른내용이 적용되거나, 동작하지 않는 경우가 발생할 수도 있습니다. 이 점은 주의 하여 숙지해두시는게 좋습니다.

그리고, 시작태그가 있으면 반드시 종료태그도 있어야 한다고 말씀드렸는데, 종료태그 선언을 안해도 되는 이 외의 태그도 있습니다. 이런 태그들은 나중에 뒤에서 설명 드리도록 하겠습니다.

HTML 태그가 가장 밖에 선언된다고 보시면 됩니다. 음... 쉽게 설명드리자면 제일 크다고 말씀을 드려야 되나요?? 어렵네요... HTML의 시작은 HTML태그로 시작이됩니다. 그 안에 쓰이는 여러 태그를 코딩하여 사용하시면 됩니다.




HEAD 태그는 문서에 대한 정보를 표시하는 공간입니다. 또한 문서의 제목(타이틀)을 선정할 수 있는 태그이죠. HEAD 태그 안에서 사용할 수 있는 TITLE이란 태그가 문서의 제목을 선정할 수 있는 태그입니다. 쉽게 말씀드리면 사람의 머리부분이라고 생각하시면됩니다.

나중에 스타일 시트 연동 및 자바스크립트를 연동할 수 있지만, 이 부분은 차후에 설명드리도록 하겠습니다.




BODY태그는 문서의 몸이라고 생각하시면 됩니다. 여러가지 태그가 BODY태그안에서 가장 많이 쓰이곤 합니다. 간단하게 비유하자면 몸의 세포들(태그들)이 자리잡고 있다고 생각을 하시면 될 것 같습니다. 껍데기라고 생각하시면 될 것 같습니다. 

나중에 설명을 하겠지만, 코딩하는 개발자에 있어 같은 기능이더라도 짧은 코딩을 하는 개발자가 있고, 길게 코딩하는 개발자가 있다면, 관리자는 어떤 사람을 더 좋게 볼까요?

당연히 짧은 코딩을 하는 사람입니다. 같은 결과물을 내놓더라도, 짧게 코딩하는 사람이 중복되는 태그를 최소화하여 사용한다는 뜻이 되겠지요.



너무 말이 많았네요. 간단하게 HTML의 기본적인 태그에 대한 사용법과 설명을 드렸는데, 이해가 가셨을지 잘모르겠네요. 제가 더 혼란스럽게 드린게 아닌가 싶습니다.

간단한 이론에 대해 설명드렸는데, 이 점만 알고 계셔도 나중에 HTML의 포스팅 보시면 이해가 가실 것입니다. 처음 배우지만 태그의 속성을 알시게 되면, 나중에는 태그를 자기 자신이 원하는 대로 가지고 놀 수 있을 것입니다.









댓글

이 블로그의 인기 게시물

물고기 ) 금붕어 산란과 치어 키우는 과정 (금붕어 키우기)

물고기 ) 어항 백스크린(시트지) 붙여서 금붕어들이 놀라는 것을 방지해보아요~

컴퓨터 ) 노트북에 램 추가하는 방법 (NT550P5C-S61R)