HyperText Markup Language
웹페이지의 구조와 콘텐츠를 정의하는 마크업 언어
웹의 뼈대를 구성
텍스트, 이미지, 동영상 등 다양한 콘텐츠를 웹 브라우저가 이해할 수 있도록 Tag를 사용해 구조화
주요 특징
- Markup Language
Tag사용
h1 p img span ...
- 구조와 의미 제공
header, footer, article 등의 태그는 문서의 구조와 의미를 명확히 보여줌
- 기본 프로그래밍 언어없이 사용 가능
논리적 동작은 JavaScript를 통해 추가됨
구성요소
- Tag
HTML의 기본단위로, 시작과 종료태그로 구성
- Attribute(속성)
태그에 대한 추가 정보를 제공
<img src = "Link" alt="blank">
-
Element(요소)
Tag와 Tag가 포함하고 있는 Content
-
Content
Tag에 포함된 내용
HTML5의 주요기능
HTML5는 최신 HTML 표준으로 여러 새로운 기능과 태그를 제공
- Sementic Tag
- 콘텐츠 구조와 의미를 명확히 하기 위해 추가됨
- 코드의 가독성과 접근성이 향상되며, 검색엔진 최적화에도 유리함
- header, footer, article, section, nav ...
- Media Tag
- 멀티미디어 콘텐츠를 지원하는 태그가 추가됨, 별도의 플러그인 불필요
- audio, video, track
- Form tag 개선
- 사용자 입력을 처리하기 위한 새로운 입력 타입과 속성이 추가됨
- 유효성 검사를 브라우저에서 기본적으로 지원함
- Canvas 와 SVG
- Canvas : JavaScript를 사용해 2D 그래픽을 그릴 수 있는 공간을 제공
- 데이터 시각화, 애니메이션, 게임 등에 주로 사용됨


- SVG(Scalable Vector Graphics) : XML 기반의 벡터 그래픽을 정의, 해상도에 구애받지 않음
- CSS와 JavaScript로 스타일링 및 애니메이션을 추가할 수 있음
- 오프라인 저장소
- 데이터를 클라이언트에 저장할 수 있는 기능이 강화
- localStorage, sessionStorage, IndexedDB
- WebSocket
- 서버와 클라이언트 양방향 통신을 이어주는 API가 추가됨
- 구버전 브라우저에서는 작동하지 않을 가능성이 있음