[HTML] 기본용어 및 마크업 시 주의사항

 

📌 기본용어

• 태그(tag): 명령어의 형태가 괄호로 되어있는 것
• 요소(element): <p><p/>같이 태그의 시작과 끝
• 마크업(markup): 요소를 사용하여 웹문서를 작성하는 것
• 속성(attribute): <a> 요소에서 'href' 같은 것
• 빈 요소(empty element): 한 쌍의 태그가 아닌 하나의 태그로 되어있는 요소로 대표적으로 br, hr img input area meta link 등이 있다.

📌 마크업 작성 시 주의사항

• 인라인 요소는 블록 요소 안에 포함시키는 것이 좋다. DTD를 transitional(하위버전 호환)로 선언한 경우에는 통과되지만 strict(엄격한 표준 준수)로 선언한 경우 문법적 오류가 발생한다.
• 웹 표준 문서 작업 시 <h1>은 꼭 마크업 해주어야 한다. 보통 회사나 단체의 상호명(로고)으로 처리한다.
• <h1> ~ <h6>, <p>, <address>은 블록 요소이며, 텍스트나 인라인 요소를 포함할 수 있지만 블록 요소는 포함할 수 없다.
• <img> 태그에는 이미지맵을 사용하여 shape에 따라 링크를 올릴 수 있다.

  <img src="이미지주소" usemap="#book" />
  <map id="book" name="book">
  <area shape="rect" coords="21,49,38,162" alt="사각형 map" />​

• <table> 태그 사용 시 <tfoot>이 <tbody>보다 상단에 있도록 마크업한다. 이렇게 돼도 순서는 tbody > tfoot 순으로 출력된다. 이유는 웹페이지가 화면이 아닌 음성으로만 지원되는 환경에서는 테이블에 대한 정보를 마크업한 순서대로 읽어주기때문에 <tfoot>에서 전체적인 내용을 파악할 수 있게하고 그 다음에 본문인 <tbody>로 내려가도록 하는 것이 효율적인 방법이다. 

 

 

출처

김광수, 조혜경, 정인용, 실전프로젝트 반응형 웹 퍼블리싱 (아이콕스, 2020)

 

 

---

개인적으로 공부한 내용을 정리하는 블로그로
잘못된 개념을 게시하지않도록 주의하고 있으나 오류가 있을 수 있습니다.