U E D R , A S I H C RSS

html5/overview

1. HTML5 κ°œμš”

  • μžλ°”μŠ€ν¬λ¦½νŠΈ + CSS + HTML의 ν†΅ν•©κ°œλ…
  • 기쑴의 HTML : λ¬Έμ„œλΌ μœ„ν•œ ν”Œλž«νΌ, HTML5 : μ›Ή μ–΄ν”Œλ¦¬μΌ€μ΄μ…˜μ„ μœ„ν•œ ν”Œλž«νΌ

1.1. HTML5 λ²”μœ„

* HTML + XHTML + μš”μ†Œ + μš”κ±΄ + κ΄€λ ¨ API
* HTML+CSS+JavaScript

1.2. 달라진점

* ν’λΆ€ν•œ μ›Ή μ–΄ν”Œλ¦¬μΌ€μ΄μ…˜ κΈ°λŠ₯ : μ›Ή μ–΄ν”Œλ¦¬μΌ€μ΄μ…˜μ˜ ν‘œν˜„λ ₯ 증가
  • λ™μ˜μƒ/μŒμ„±
  • 2D κ·Έλž˜ν”½ 처리
  • μ˜€ν”„λΌμΈμ—μ„œ ꡬ동가λŠ₯
  • λ„λ©”μΈκ°„μ˜ 톡신기λŠ₯
  • ν΄λΌμ΄μ–ΈνŠΈμΆ• 데이터 μ €μž₯
  • λ°±κ·ΈλΌμš΄λ“œ 처리 μˆ˜ν–‰
  • μ„œλ²„λ‘œλΆ€ν„°μ˜ 데이터 ν‘Έμ‹œ
  • μ„œλ²„μ™€μ˜ 쌍방ν–₯ ν†΅μ‹ μˆ˜ν–‰
  • 둜컬파일 읽기
  • etc. MathML, SVGλ“± μ™ΈλΆ€ λ§ˆν¬μ—…μ–Έμ–΄ HTML에 직접 μ‚½μž…κ°€λŠ₯ (μ±… λ²”μœ„ λ°–)
  • κΈ°μ‘΄ HTML4.- : HTMLκ³Ό XHTML은 λ³„κ°œμ˜ 사양
  • HTML5 : HTMLκ³Ό XHTML은 ν‘œν˜„λ˜λŠ” λ¬Έλ²•μ˜ 차이, HTML5λŠ” DOM에 따라 ν‘œμ‹œλ¨


* μ‹œλ§¨ν‹±ν•œ λ§ˆν¬μ—…
  • κΈ°μ‘΄ HTML문의 애맀λͺ¨ν˜Έν•œ 문법 κ°œμ„ 
    • <head> <footer> <section> μΆ”κ°€
  • ν”„λ‘œκ·Έλž¨μ΄ λ¬Έμ„œμ˜ κ΅¬μ‘°λΌ νŒŒμ•…ν•˜κΈ° μ‰¬μ›Œμ§(HTML νŒŒμ‹± μˆ˜μ›”), 가독성 증가
    • selection : λ²”μš©μ μΈ μ…€λ ‰μ…˜
    • aticle : μ„Ήμ…˜μ˜ ν•œμ’…λ₯˜, νŽ˜μ΄μ§€μ—μ„œ λ…λ¦½λ˜μ–΄μžˆλŠ” λΆ€λΆ„ (ex. λΈ”λ‘œκ·Έμ›Ήμ˜ λΈ”λ‘œκ·Έ λ³Έλ¬Έ)
    • nav : μ‚¬μ΄νŠΈ 전체 or λ‚΄λΉ„κ²Œμ΄μ…˜ 메뉴
    • aside : μ„Ήμ…˜ λ‚΄μš©κ³Ό κ΄€λ ¨λ˜μ–΄μžˆμ§€λ§Œ 없어도 μƒκ΄€μ—†λŠ” λΆ€λΆ„(ex. λ¬Έμ„œ λ‚΄μš© μš”μ•½)
    • header : μ„Ήμ…˜ 헀더
    • footer : μ„Ήμ…˜μ˜ ν‘Έν„°
    • address : μ„Ήμ…˜μ— κ΄€ν•œ 문의처 정보(ex. νšŒμ‚¬ μ „ν™”λ²ˆν˜Έλ“±)
    • time : λ‚ μ§œ, μ‹œμž‘μ„ λ‚˜νƒ€λƒ„
    • 마이크둜 데이터 : λ¬Έμ„œμ— μ‚½μž…λœ λ°μ΄ν„°μ˜ 속성 데이터(λ°μ΄ν„°μ˜ 데이터, λ°μ΄ν„°μ˜ 의λΈκ°€ λͺ…확해짐)

* 더 높은 μ ‘κ·Όμ„±
  • 휴먼 μΈν„°νŽ˜μ΄μŠ€μ— κ°€κΉŒμ›Œμ§ˆμˆ˜μžˆμŒ

* 더 높은 ν˜Έν™˜μ„±
  • 버전간 ν˜Έν™˜μ„±
    • μ „λ°©ν˜Έν™˜μ„± - HTML5을 μ μš©ν•˜κΈ° μ΄μ „μ˜ λΈŒλΌμš°μ €μ—μ„œλ„ HTML5μ‚¬μš©κ°€λŠ₯(μ›ΉλΈŒλΌμš°μ €μ˜ fall back 적용)
      • fall back : λͺ¨λ₯΄λŠ” 뢀뢄은 λ¬΄μ‹œν•˜λŠ” μ›Ή λΈŒλΌμš°μ €μ˜ νŠΉμ„±
    • ν›„λ°©ν˜Έν™˜μ„± - HTML5을 μ μš©ν•œ λΈŒλΌμš°μ €μ—μ„œ HTML5 이전 버전 λ¬Έμ„œ ν‘œμ‹œκ°€λŠ₯
  • λΈŒλΌμš°μ €κ°„ ν˜Έν™˜μ„±
    • ν‘œμ€λ§Œ λ”°λ₯Έλ‹€λ©΄ μ–΄λ–€ λΈŒλΌμš°μ €μ—μ„œλ„ λ˜‘κ°™μ΄ μž‘λ™ν•œλ‹€
    • μ΄λΈ μ‚¬μš©λ˜κ³  μžˆλŠ” λ‚΄μš©μ—μ„œ 사양을 μΆ”μΆœν•œλ‹€

2. 역사

* HTML의 λͺ©μ  : 1998λ…„ W3CλŠ” html이 μ•„λ‹Œ XHTML의 ν‘œμ€ μ‚¬μš©μ„ κΆŒκ³ ν•œλ‹€. κ·ΈλŸ¬λ‚˜ XHTML은 HTML과의 λΉ„ν˜Έν™˜μ„±μœΌλ‘œ 널리 퍼지지 λͺ»ν•œλ‹€.
* 결과적으둜 10년이상 μ‚¬μš©λ˜λŠ” HTML의 저사양이 였히렀 μ›Ή μ–΄ν”Œλ¦¬μΌ€μ΄μ…˜μ˜ λ°œμ „μ„ μ €ν•΄ν–ˆλ‹€. κ·ΈλŸ¬λ‚˜ W3CλŠ” XHTML을 μœ„ν•΄ μƒˆλ‘œμš΄ HTML의 κ°œλ°œμ„ κ±°μ ˆν•œλ‹€.
* 그러자 apple, mozillar, opera μ„Έ 기업이 λͺ¨μ—¬ WHATWGλΌ λ°œμ±ν•˜κ³  HTML의 μ§„ν™”λΌ μ§€ν–₯ν•œλ‹€.(apple은 ν”Œλž˜μ‹œλΌ μ œκ³΅ν•˜λŠ” 어도비와 관계가 μ’‹μ§€μ•Šμ•„ HTML5λΌ μ κ·Ήμ μœΌλ‘œ μΆ”μ§„ν•œλ‹€λŠ” μ†Œλ¬Έμ΄λ‹€)
* ν˜„μž¬ HTML5λŠ” W3C에 LAST CALL(μ΅œμ’… 심사 μ΄ˆμ•ˆ)이 제좜된 μƒνƒœμ΄λ‹€. λ˜ν•œ W3Cκ°€ μ§„ν–‰ν•˜λ˜ XHTML2의 사양 μ œμ •μ΄ μ€‘μ§€λ‘œ HTML5의 ν‘œμ€ν™”λŠ” κΈ°μ • μ‚¬μ‹€λ‘œ 보인닀.
Valid XHTML 1.0! Valid CSS! powered by MoniWiki
last modified 2021-02-07 05:31:41
Processing time 0.0204 sec