[3장_] HTML 태그들에 대해 알아봅시다

HTML의 Tag에 대해 배워봅시다

HTML 태그란 무엇인가?

'HTML(HyperText Markup Language)'은 '웹 페이지(Webpage)'를 구성하는데 사용되는 언어로써,
'HTML 태그(Tag)'로 이루어진 언어를 말합니다.

그렇다면 HTML Tag란 무엇일까요? 설명보다는 직접 보는 게 더 좋겠죠?

복잡하지만 어디선가 한번 본 적 있는 이미지인가요? ㅎㅎ

위 사진처럼 꺾쇠괄호'<'와 '>'로 구성된 형식을 우린 앞으로 HTML 태그, 줄여서 '태그'라고 부를 겁니다.
자, 이제 이 태그가 어떻게 쓰이는지 알아보고 직접 코딩을 해볼 건데요.

HTML 태그 맛보기

저번 시간에는 html 문서를 통해 원하는 문장을 웹브라우저에 출력해보는 예제를 배웠는데요.
무난하고 밋밋한 글씨체로만 되어있어서 심심하지 않았나요? ㅎㅎ

다음의 간단한 예제를 보시죠.

HTML 태그 예제 (웹페이지)






어제 배운 내용과 차이점이 느껴지시나요?
이처럼 태그를 사용하면 글자에 변형을 주는 것이 가능해집니다.

HTML 태그 예제 (코드)

안녕하세요. <strong>kwiskey입니다.</strong> HTML 공부 <u>어렵지 않아요~</u> 같이 힘내 봅시다!




html 코드의 내용을 보면 다음과 같이 적혀있다는 걸 볼 수가 있는데요.
태그의 사용법과 역할이 무엇인지 어느 정도 감이 오시죠?

네, 태그는 일반적으로 시작 태그(opening tag)와 종료 태그(closing tag)의 한쌍으로 "< >", "</ >"의 형식을 취합니다.
(몇몇 태그는 종료 태그가 없는 경우도 있습니다. 이런 경우는 따로 언급을 하도록 하겠습니다.ㅎㅎ)

정리해 보겠습니다.
HTML 태그는 1. 태그 사이에 오는 문자열의 디자인이나 기능에 변화를 주는 역할을 하구요.
HTML 태그는 2. 웹페이지가 특정한 기능을 사용할 수 있게 도와주는 역할을 합니다.

HTML 태그의 개수

한 가지 생각해 보겠습니다.

HTML에는 약 150개 이상의 태그가 존재한다고 하는데요.
웹을 만들기 위해서 저 150개가 넘는 태그들을 다 공부해야 할까요?

실제로 꼭 그렇지만은 않습니다.

실제 웹사이트를 만드는데 필요한 태그, 즉 자주 사용되는 태그는 정해져 있다고 할 수 있는데요.

빈도수가 높은 태그의 기능은 필수적이고 알아두면 유용할 것입니다.
하지만 빈도수가 낮다면, 특수한 상황에서 사용될 가능성이 높겠죠?

위의 생각을 바탕으로 우리는 앞으로의 공부 방향을 설정해 볼 수 있을 겁니다.
"자주 사용되는 태그를 먼저 공부하고, 빈도가 낮은 태그는 사용할 일이 있을 때 찾아서 공부한다!"
준비되셨나요? ㅎㅎ

마지막으로, 각종 태그의 기능에 대해서 참조할 수 있는 2개의 사이트의 링크를 남겨두겠습니다.

HTML 태그 레퍼런스 사이트

• 한국어 링크: http://tcpschool.com/html-tags/intro
• 영어 링크: https://www.w3schools.com/tags/

앞으로 HTML 태그를 공부하다 막히는 부분이 생길 때 도움이 되셨으면 좋겠네요. ㅎㅎ
다음 장에서는 높은 빈도로 사용되는 태그가 무엇인지, 또 역할은 어떻게 되는지에 대해 알아보겠습니다.

피드백은 언제나 환영합니다.
감사합니다.

kwiskey