HTML - 주석 태그 <!-- -->

HTML 주석

HTML 주석 tag

주석은 <!-- 주석 내용 --> 와 같이 사용할 수 있습니다.

1
<!-- 주석 내용 -->

HTML 주석 사전적 정의

주석은 사전적 정의를 알고나면 쉽게 이해할 수 있습니다.

주석 Comment
정보·통신 프로그램의 본문 가운데 포함되어 있으나 그 프로그램의 실행에는 영향을 주지 않는 언어 구성 요소.
출처 : 우리말샘

위와 같이 프로그램을 사용하는데 있어서 실행에는 필요없지만 동료들이나 미래의 이 코드를 보는 사람들을 위해 꼭 필요합니다. (미래의 자신을 위해 사용할 수 있습니다. 나중에는 왜 이렇게 작성했는지 기억이 안나요…)

HTML 주석의 활용

다른 사람과 협업하여 사용할때 아주 빛을 발하는데 이 코드는 무엇인지, 어디가 <div>의 시작과 끝인지 쉽게 구분할 수 있습니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<!-- 아래는 구분하기 어려운 div 늪 -->
<div class="main-article">
<div>
<div>
<div>
<div>
<div>
</div>
</div>
</div>
</div>
</div>
<div>
<div>
<div>
<div>
<div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 들여쓰기마저 없었다면 더욱 구분하기 어렵다 -->

아래의 처럼 사용하면 쉽게 구분하고 이해할 수 있습니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<!-- 주석을 활용하여 구분지을 수 있다 -->
<!-- 본문 시작 -->
<div class="main-article">
<!-- 첫번째 div 시작 -->
<div>
<div>
<div>
<div>
<div>
<!-- 제리 현재 작업 중 -->
</div>
</div>
</div>
</div>
</div>
<!-- 첫번째 div 끝 -->
<!-- 두번째 div 시작 -->
<div>
<div>
<div>
<div>
<div>
<!-- 톰 현재 작업 중 -->
</div>
</div>
</div>
<!-- 이 부분 수정 필요 -->
</div>
</div>
<!-- 두번째 div 끝 -->
</div>
<!-- 본문 끝 -->

각 회사나 팀마다 주석을 어떻게 사용할지 협의를 통해 사용할 수 있습니다.
모두 주석을 사용하여 이해하기 쉽고 수정하기 쉬운 날들이 이어지기를 바랍니다.

Reference

  • Naver 국어사전
Share