HTML 태그와 HTML 요소의 차이점을 명확하게 이해하고, 혼동하기 쉬운 두 개념을 확실히 구분해 보세요.
많은 개발자들이 'HTML 태그'와 'HTML 요소'라는 용어를 같은 의미로 섞어서 사용합니다. 하지만 과연 이 둘은 완전히 동일한 개념일까요?
정답은 아니요입니다.
HTML 태그란 무엇인가?
태그(Tag)는 HTML 요소를 정의하는 데 사용됩니다. 다루고자 하는 콘텐츠의 유형에 맞는 여는 태그와 닫는 태그로 내용을 감싸는 방식으로 요소를 만들 수 있습니다. 예를 들면 다음과 같습니다.
<p>콘텐츠</p>
HTML 요소란 무엇인가?
HTML 요소(Element)는 콘텐츠 + HTML 태그가 결합된 결과물입니다. 즉, 태그만으로는 요소가 될 수 없습니다.
다음은 문단(paragraph) 요소가 아닙니다.
지금 나는 그저 텍스트 콘텐츠 조각일 뿐입니다..
하지만 아래 코드는 문단 요소입니다.
<p>이제 나는 문단 요소예요! 만세!</p>
태그만 있는 경우는 왜 요소가 아닐까?
다음 역시 문단 요소가 아닙니다.
<p></p>
위 코드는 사실상 여는(시작) 문단 태그에 가깝습니다. 여기에는 두 가지 핵심 요소, 즉 콘텐츠와 닫는 태그(</p>)가 빠져 있기 때문에 기술적으로 요소라고 부르기 어렵습니다.
왜 차이점을 알아야 할까?
사실 일상적인 대화에서 HTML 요소를 태그라고 부르거나 그 반대로 부른다고 해서 큰 문제가 되지는 않습니다. 중요한 것은 두 개념의 차이를 정확히 이해하고 있는 것이며, 특히 면접에서 이런 질문이 나왔을 때 당황하지 않으려면 반드시 알아두는 것이 좋습니다.