시험에 필요한 HTML5의 기본 문법 및 개념

이번에 다룰 내용은 '시험에 필요한 HTML5의 기본 문법과 개념'에 대해서 다루어 보려고 합니다. 시험에 나오는 프로그래밍 내용 중 개념적인 내용이지만, 최대한 풀어서 이해하기 쉽게 작성하도록 노력해보겠습니다. 혹시나 틀린 부분이나 추가적으로 필요한 내용이 있다면 댓글 달아 주시면 수정 및 보완토록 하겠습니다.

HTML의 개념

HTML(HyperText Markup Language)는 웹 표준을 주관하는 W3C에서 발표한 프로그래밍 언어로 웹 문서를 제작하는데 사용합니다. 예전의 HTML은 호환성이 부족하고 지원하는 기능이 적어서 사용하기도 까다롭고 모바일에서도 사용하기 어려웠지만 최신 버전인 5.2는 모바일에서도 이상없이 구현되며 동영상, 음악 등 다양한 기능을 엑티브 엑스 설치 없이 사용가능합니다.

HTML의 구성

HTML은 다음과 같은 기본 규칙을 갖고있습니다. '시작 태그'와 '종료 태그'로 각 요소 별 영역을 지정하며, 일부 요소들은 '종료 태그'없이 사용이 가능합니다. 태그들은 대소문자를 구별하지 않습니다.

위에서는 '시작 태그'와 '종료 태그'로 설명하였지만 일부 요소들은 '종료 태그' 없이 사용이 가능합니다.

주석

주석은 선택사항이지만, 필수적으로 하는것이 좋습니다. 주석을 사용하면 화면에 출력되지는 않지만, 각 영역에 대한 설명문을 추가함으로써, 오랜 시간이 지나고 난 뒤 다시 봤을때 각 영역에 대한 기능들을 쉽게 알 수 있으며, 제3자가 봤을 때에도 도움이 될 수 있습니다.

<!-- 주석내용 -->

한 줄 주석 처리는 다음과 같습니다. 시작 태그에 해당하는 '<!--'와 종료 태그에 해당하는 '-->'를 사용하여 내용이 들어갑니다. 다음과 같이 작성하면 실행하였을 때 아무런 출력값을 나타내지 않습니다.

<!-- 주석내용

주석 내용-->

여러 줄 주석 처리는 다음과 같습니다. 결론적으로 한 줄 주석처리와 다른 점은 맨 마지막 문장에 종료 태그(-->)가 붙는 다는 점입니다. 마찬가지로 작성하면 아무런 출력값을 나타내지 않습니다.

주석 처리 후 결과값입니다. 좌측 코드에서는 '<!-- 주석처리 -->'와 같이 문구가 있지만 우측에서는 아무런 결과를 나타내지 않고 있습니다. 주석은 결과값에는 아무런 영향을 주지 않지만, 내용 이해에 도움을 줄 수 있습니다.

반면에 주석 처리를 하지 않고 문장을 입력하였을 때 결과값입니다. 주석처리 결과값과 다르게 우측에서는 정상적으로 결과값을 출력하고 있습니다. 만약 많은 내용이 포함된 영역이라면 유지보수 시 어려움을 겪을 수 있습니다.