상세 컨텐츠

본문 제목

HTML5 기본용어 익히기 (코드, 태그, 속성, 요소란 무엇인가?)

IT테크 프로그램 어플/HTML & CSS

by ˚。 2020. 3. 5. 16:05

본문

html 기본용어

오늘은 HTML5를 공부하기에 앞서 HTML5의 기본적인 용어를 알아보도록 하겠습니다. 책에서는 보통 한글로 용어들을 표현하고 있지만, 실무에서는 보통 영어로 이야기한다고 합니다. 그래서 저도 익숙해질 수 있도록 영어와 한글을 동시에 사용하도록 하겠습니다.

입문자 기준으로 의미만 전달할 수 있게 통틀어 설명하였으므로 약간 비약된 해석이 있을 수 있으니 고수분들은 패스해주세요ㅎㅎ

 

 

Code (코드)

우리가 입력하는 모든것을 코드라고 합니다. 웹이나 프로그램에서 사용하는 텍스트의 통칭이라고 할 수 있죠. 그래서 코드를 입력하는 행위를 코딩이라고 하고, 그 행위를 하는 사람을 코더라고 부릅니다. 

 

 

Tag (태그) 

<body> <h1> <img ~ > <td> <tr> <a> <hr> 이런 것들을 혹시 보신 적 있나요? 태그는 바로 이런 것들(?)입니다.

 웹 브라우저가 인식할 수 있도록 미리 정해진 명령어라고 생각하면 됩니다. 태그는 만들어서 사용할 수 있는 게 아니고, W3C에서 정해놓은 태그 문서(지금 배우고 있는 HTML5가 바로 그 문서)를 이용해서 우리는 웹 상에서 여러 가지 들을 표현하는 것입니다. 그리고 이런 태그를 이용해서 표현된 어떠한 모든 것들을 Object(객체)라고 말합니다.

 

Attribute (속성) 어트리븉

 위에서 설명한 태그들 중에 혼자 쓰이는 [단독 태그]들이 있지만, Attribute(속성)와 함께 사용하는 태그들이 있습니다. <img>라는 이미지를 표현하라는 태그가 있는데, 이 이미지에 무엇을 어떻게 표현할 것인지 Attribute(속성)을 부여해줘야 합니다. 무엇을 표현할것인지 정하는 것을 Attribute Name(속성 이름)이라 하고, 그 속성을 어떻게 적용할 것인지 값을 정해주는 것을 Atrribute Value(속성 값)이라고 합니다.

 이 Atrribute Name(속성 이름)은 약속에 의해 정해져 있지만, Attribute Value(속성값)은 정해져있지 않고 우리가 정해주어야 합니다.

 

Element (요소) 엘레멘트

단독태그(끝 태그가 없는 태그)는 혼자 있으면 태그이자 Element(요소)가 됩니다. 그리고 우리가 태그에 Attribute(속성)을 이용해서 속성값을 주었다면 이것도 하나의 Element(요소)가 되는 것입니다. 그 요소들이 합쳐져서 또 하나의 요소가 됩니다. 이 Element(요소)는 HTML보다는 나중에 공부할 Javascript에서 중점적으로 다뤄진다고 합니다. 우리같은 입문자는 슬며시 넘어가도록 해요.

 

이 세 가지 용어를 아래와 같이 예를 들어 설명하도록 하겠습니다.

HTML5 기본 용어의 예

<h1>는 태그, class는 속성이름, primary는 속성값 입니다. 이것들이 합쳐져서 Element(요소)가 되는 것입니다.

 

 

간단하지만 HTML5의 세계를 처음 입문하는 분들에게는, 기초 개념이라서 어렵게 느껴집니다. 물론 제가 그렇습니다. 처음 보는 글자들이 어떤 특성으로 어떻게 만들어지는지 하나씩 알아가는 게 쉽지 않네요. 하지만 미지의 세계를 알아가는 성취감도 있습니다. 의외로 이과형 인간인 건가...

아무쪼록 앞으로도, 간단하면서도 저와 같은 입문자들이 쉽게 이해할 수 있게 정리해보도록 하겠습니다.

 

 

반응형

관련글 더보기

댓글 영역