ChainSmoker’s Block

[WEB - HTML CSS JAVASCRIPT][시맨틱 웹을 위한 태그] 2_2-4. 시맨틱 웹에서의 현재 진행 중인 상태 표현_3 본문

개인공부(WEB, Python, DB)

[WEB - HTML CSS JAVASCRIPT][시맨틱 웹을 위한 태그] 2_2-4. 시맨틱 웹에서의 현재 진행 중인 상태 표현_3

ChainSmokers 2023. 2. 24. 23:40

[시맨틱 웹을 위한 태그] 2_2-4. 시맨틱 웹에서의 현재 진행 중인 상태 표현_2에 이어 설명.

[02. 표현을 위한 요소]


:

  • 콘텐츠 타입별 요소 분류 : HTML5에서 각 요소(엘리먼트/태그)가 가지고 있는 의미는 더 중요해져가고 있다. 이에 따라 WHATWG(www.whatwg.org)에선 각 요소(엘리먼트/태그)를 일곱가지 타입별로 분류하고 있다.
  1. Metadata 콘텐츠 : 콘텐츠의 모양, 동작을 설정하고 다른 문서와의 관계를 나타낼 때 사용한다.
    )EX( -> base, command, link, meta, noscript, script, style, title
  2. Flow 콘텐츠 : {body} 요소 아래에서 사용되는 대부분의 요소들이 포함됨.
    )EX( -> a, abbr, address, area, article, aside, audio, b, bdi, bdo, blockquote, br, button, canvas, cite, code, command, datalist, del, details, dfn, div, dl, em, embed, fieldset, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, i, iframe, img, input, ins, kbd, keygen, label, map, mark, math, menu, meter, nav, noscript, object, ol, output, p, pre, progress, q, ruby, s, samp, script, section, select, small, span, string, style, sub, sup, svg, table, textarea, time, ul, var, video, wbr, text
  3. Sectioning 콘텐츠 : 헤더와 푸터의 범위를 정의할 때 사용한다.
    )EX( -> article, aside, nav, section
  4. Heading 콘텐츠 : 섹션의 헤더를 정의할 때 사용한다.
    )EX( -> h1, h2, h3, h4, h5, h6, hgroup
  5. Phrasing 콘텐츠 : 문서의 텍스트를 정의할 때 사용한다.
    )EX( -> a, abbr, area, audio, b, bdi, bdo, br, button, canvas, cite, code, command, datalist, del, dfn, em, embed, i, iframe, img, input, ins, kbd, keygen, label, map, mark, math, meter, noscript, object, output, progress, q, ruby, s, samp, script, select, small, span, strong, sub, sup, svg, textarea, time, var, video, wbr, text
  6. Embedded 콘텐츠 : 문서에 외부의 영상, 사진 등을 포함할 때 사용한다.
    )EX( -> audio, canvas, embed, iframe, img, math, object, svg, video
  7. Interactive 콘텐츠 : 사용자와의 상호작용을 위해 사용한다.
    )EX( -> a, audio, button, details, embed, iframe, img, input, keygen, label, menu, object, select, textarea, video
반응형