HTML 주석은 <!-- ... --> 태그 사이에 작성합니다. 이 태그 안에 포함된 내용은 모두 주석으로 처리되며, 브라우저는 이를 완전히 무시하고 화면에 표시하지 않습니다. 주석은 코드에 설명을 덧붙이거나 특정 코드를 임시로 비활성화할 때 매우 유용하게 활용됩니다.
HTML에서 한 줄 주석 작성하기
예제
HTML에서 한 줄 주석을 사용하는 기본적인 예제를 살펴보겠습니다.
<!DOCTYPE html> <html> <head> <!-- 문서 헤더 시작 --> <title>This is document title</title> </head> <!-- 문서 헤더 끝 --> <body> <p>Document content goes here.....</p> </body> </html>
실행 결과
위 코드를 실행하면 다음과 같은 결과가 출력됩니다. 주석으로 처리된 텍스트는 브라우저 화면에 절대 표시되지 않습니다.
HTML에서 여러 줄 주석 작성하기
HTML에서는 한 줄뿐만 아니라 여러 줄에 걸친 주석도 작성할 수 있습니다. <!--로 시작하고 -->로 끝나기만 하면, 그 사이의 내용이 몇 줄이 되었든 모두 주석으로 인식됩니다.
예제
여러 줄 주석을 사용하는 예제를 확인해 보세요.
<!DOCTYPE html> <html> <head> <!-- 문서 헤더 시작 --> <title>This is document title</title> </head> <!-- 문서 헤더 끝 --> <body> <h2>Heading Two</h2> <!-- 이것은 여러 줄 주석입니다. 원하는 만큼 자유롭게 여러 줄에 걸쳐 작성할 수 있습니다. --> <p>Document content goes here.....</p> <p>문서에 주석을 작성했지만, 화면에는 표시되지 않습니다.</p> </body> </html>
실행 결과
위 코드를 실행하면 다음과 같은 결과가 출력됩니다. 여러 줄 주석 안의 텍스트 역시 브라우저에 표시되지 않습니다.
주석 활용 팁
주석을 효과적으로 사용하면 코드의 가독성과 유지보수성이 크게 향상됩니다. 복잡한 구조의 시작과 끝을 표시하거나, 협업 시 다른 개발자에게 의도를 전달하는 용도로 적극적으로 활용해 보세요. 단, 주석이 너무 많으면 오히려 코드를 읽기 어려워질 수 있으므로 꼭 필요한 부분에만 간결하게 작성하는 것이 좋습니다.