HTML5는 HTML의 새로운 버전으로 Client Side Technology 기술의 중심이 되는 마크업 언어이다.
HTML5 의 등장으로 CSS3, 자바스크립트 API를 통한 기능의 확장과 결합을 통해 기존의 HTML 이상의 의미를 부여하게 되었고 기존의 Active-X 와 같은 플러그인인 외부 기술에 의존했던 것을 걷어냄으로서 웹표준, 웹접근성을 한층 높여놓고 있다.
HTML5 문서는 반드시 <!DOCTYPE html>으로 시작하여 문서 형식(document type)을 HTML5로 지정한다. (아래 링크 참고)
https://egas.tistory.com/86?category=498296
DOCTYPE은 무엇을 하나요?
DOCTYPE은 무엇을 하나요? DOCTYPE은 document type의 약어이다. DOCTYPE의 유일한 목적은 브라우저가 문서를 렌더링할 때, quirks mode(쿼크 모드)로 바뀌지 않도록 하는 것이 유일한 목적이다. 또한, HTML5에.
egas.tistory.com
HTML 속성에 대한건 아래 링크를 참고하자.
https://egas.tistory.com/84?category=497738
HTMLElement
문서 객체 모델(Document Object Model, DOM)은 자바스크립트 Node 객체의 계층화된 트리이다. HTMLElement 모든 요소들은 HTMLElement의 자식이다. HTMLElement는 Element의 자식이고, Element는 Node의 자식이다..
egas.tistory.com
주요 변화
Semantic Tags
HTML5에서의 가장 큰 변화는 Semantic Tag들이다. 정보가 점차 방대해지는데 비해, 컴퓨터가 정보자원의 의미를 이해하지 못해 다양한 정보자원의 처리 자동화, 데이터의 통합 및 재사용등을 컴퓨터가 스스로 수행하지 못하는 문제점이 생겼다.
semantic은 의미론적인의 뜻을 가지고 있다. Semantic Tag는 어느 부분이 무슨 역할을 하는지 HTML Tag에 의미를 부여해서, HTML 파일만 보더라도 어떤 역할을 하는지 이해할 수 있게 해준다.
The document element
- html
Document metadata
- head
- title
- base
- link
- meta
- style
Sections
- body
- article
- section
- nav
- aside
- h1, h2, h3, h4, h5, h6
- hgroup
- header
- footer
- address
Grouping content
- p
- hr
- pre
- blockquote
- ol
- ul
- menu
- li
- dl
- dt
- dd
- figure
- figcaption
- main
- div
Text-level semantics
- a
- em
- strong
- small
- s
- cite
- q
- dfn
- abbr
- ruby
- rt
- rp
- data
- time
- code
- var
- samp
- kbd
- sub, sup
- i
- b
- u
- mark
- bdi
- bdo
- span
- br
- wbr
Links
- a
- area
Edits
- ins
- del
Edits
- picture
- source
- img
- link
- iframe
- embed
- object
- param
- video
- audio
- track
- map
- area
Tabular data
- table
- caption
- colgroup
- col
- tbody
- thead
- tfoot
- tr
- td
- th
Forms
- form
- label
- input
- button
- select
- datalist
- optgroup
- option
- textarea
- output
- progress
- meter
- fieldset
- legend
- details
- summary
- dialog
Scripting
- script
- noscript
- template
- slot
- canvas
세부 정보는 아래 참고.
HTML Standard
html.spec.whatwg.org
참고
https://code.tutsplus.com/tutorials/28-html5-features-tips-and-techniques-you-must-know--net-13520
28 HTML5 Features, Tips, and Techniques you Must Know
This industry moves fast—really fast! If you're not careful, you'll be left in its dust. So, if you're feeling a bit overwhelmed with the coming changes/updates in HTML5, use this as a primer of...
code.tutsplus.com
https://webclub.tistory.com/491
HTML5란 무엇인가?
HTML5의 등장과 그 배경 대부분 알고 있듯이 웹을 지탱하는 핵심 기술은 HTML 입니다. 그리고 모바일 웹에서 핵심 기술을 뽑으라면 단연 HTML5 입니다. 흔히 HTML5 에 폭발적인 관심을 불러일으킨 데에
webclub.tistory.com
'Tech > HTML' 카테고리의 다른 글
| DOCTYPE은 무엇을 하나요? (2) | 2021.08.02 |
|---|
댓글