[HTML] HTML5의 기능

2022. 6. 21. 07:50·Language/HTML
728x90

HTML5의 기능

HTML5의 전체 기능은 크게 두 부분으로 나눌 수 있다.

  • 웹 문서 작성을 위한 HTML 태그 셋
  • 웹 애플리케이션 작성을 위한 API

HTML5는 이전 HTML 태그를 계승하였지만, 문서의 모양을 표현하는 HTML 태그와 속성들은 과감히 청산하였다. 그리고 문서의 구조를 명확히 표현하는 시맨틱 태그를 추가하였다.

또 다른것으로, HTML5의 출현은 웹 문서의 시대에서 웹 애플리케이션의 시대로의 변화를 뜻한다. 그것은 기존 HTML이 웹 문서를 만들기 위한 언어 역할밖에 할 수 없었지만, HTML5는 나아가 웹 브라우저상에서 플러그인의 도움 없이 웹 애플리케이션을 만들 수 있는 언어이면서 플랫폼을 갖추었다는 뜻이다. 이를위해, HTML 웹 브라우저는 웹 애플리케이션을 개발할 수 있는 자바스크립트 API(Application Programming Interface)를 표준화하였다. 자바스크립트 API(간단히 API)는 HTML5 표준을 갖춘 어떤 웹 브라우저에서도 지원되므로, 웹 개발자들은 API를 이용하여 자바스크립트 프로그램을 작성하기만 하면 된다.

 

HTML5의 세부 기능 간단 정리

웹 폼 (Web Form)

  • 사용자로부터 입력을 받기 위한 다양한 HTML태그와 속성을 제공한다.

오디오, 비디오 (Audio/Video)

  • 오디오나 비디오를 재생하는 HTML 태그를 지원하며, 별도의 플러그인 설치 없이 재생이 가능하다. 또한 자바스크립트 코드를 이용하여 오디오, 비디오의 재생, 중지 등을 제어할 수 있다. 세계적인 비디오 스트리밍 기업인 넷플릭스(Netflix)는 이미 HTML5로 비디오 스트리밍 서비스를 제공하고 있다.

캔버스 (Canvas)

  • Canvas는 <canvas> 태그와 자바스크립트를 이용하여 웹 브라우저상에서 동적으로 2, 3차원 그래픽을 그릴 수 있는 API이다. 이 기능을 이용하면 차트, 애니메이션, 게임 등 GUI 기반의 웹 애플리케이션을 만들 수 있다.

SVG (Scalable Vector Graphics)

  • XML로 표현하는 2차원 벡터로 그래픽을 그리는 API이다.

웹 스토리지 (Web Storage)

  • 웹 스토리지는 웹 브라우저가 실행되는 로컬 컴퓨터에 데이터를 저장하는 API이다. 이 기능으로 쇼핑몰, 게임 등에서 발생하는 데이터를 사용자 컴퓨터에 저장하여 웹의 성능을 높이거나 웹 서버와 연결되지 않은 상황(off-line)에서도 웹 애플리케이션을 실행할 수 있다.

웹 SQL 데이터베이스 (Web SQL Database)

  • 웹 브라우저가 실행되는 로컬 컴퓨터에 DB를 두고 표준 SQL로 활용할 수 있는 API이다.

인덱스 데이터베이스 (Indexed Database API)

  • 웹 브라우저가 실행되는 로컬 컴퓨터에 대용량의 데이터를 저장하고, 인덱스를 이용하여 검색하는 API이다. 이 기능으로 데이터를 다루는 광범위한 웹 애플리케이션을 구현할 수 있다.

파일 입출력 (File I/O)

  • 로컬 컴퓨터의 파일을 읽고 쓸 수 있는 API이다.

위치 정보 API (Geolocation API)

  • 구글 맵이나 지도 앱을 이용하지 않고, 웹 브라우저 사용자의 위치를 알아내거나 사용자의 위치를 계속 추적하여 변경되는 위치를 알려주는 API이다.

웹 워커 (Web Worker)

  • 백그라운드 작업을 만들 수 있는 API이다. 시간이 오래 걸리는 작업을 백그라운드 작업(자바스크립트 코드)으로 만들어 웹 브라우저의 사용자 인터페이스가 느려지지 않도록 할 수 있다.

웹 소켓 (Web Socket)

  • 웹 브라우저에서 실행되는 웹 애플리케이션이 웹 서버에서 실행되는 응용프로그램과 직접 통신 할 수 있도록 지원하는 API이다.

오프라인 웹 애플리케이션(Offline Web Application)

  • 인터넷에 연결되지 않는 상황에서도 웹 애플리케이션이 정상적으로 실행될 수 있도록 지원하는 API로 애플리케이션 캐시와 데이터 캐시로 구성된다.

 

'Language > HTML' 카테고리의 다른 글

[HTML] HTML 기초 정리  (0) 2022.09.13
[HTML] HTML(Hyper Text Markup Language) Tag Sheet  (0) 2022.09.13
[HTML] HTML 태그 간단 정리  (0) 2022.06.19
[HTML] HTML 기본  (0) 2022.06.19
[HTML] HTML 기초  (0) 2022.06.19
'Language/HTML' 카테고리의 다른 글
  • [HTML] HTML 기초 정리
  • [HTML] HTML(Hyper Text Markup Language) Tag Sheet
  • [HTML] HTML 태그 간단 정리
  • [HTML] HTML 기본
arajo
arajo
  • arajo
    아라 메모장
    arajo
  • 전체
    오늘
    어제
    • 분류 전체보기 (509)
      • Language (298)
        • HTML (55)
        • CSS (11)
        • JavaScript (70)
        • TypeScript (8)
        • Python (33)
        • Java (119)
        • C (0)
        • C# (2)
      • Programming (92)
        • Programming (14)
        • Web (51)
        • Apache (1)
        • MySQL (23)
        • AWS (3)
      • Framework | Library (26)
        • Framework | Library (3)
        • Vue.js (2)
        • React.js (5)
        • React Native (4)
        • Node.js (1)
        • Ajax (1)
        • Bootstrap (8)
        • Spring (1)
        • Flutter (1)
      • etc (2)
      • 휴식 (19)
        • 책 (13)
        • 일기 (5)
        • 게임 일기 (1)
      • A (71)
        • 공부 (18)
        • 기타 (6)
        • 일 (47)
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    Python
    event
    제어문
    object
    next.js
    객체
    react
    파이썬
    변수
    HTML
    자바스크립트
    JavaScript
    MySQL
    web
    Java
    CSS
    타입스크립트
    리액트
    TypeScript
    array
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.1
arajo
[HTML] HTML5의 기능
상단으로

티스토리툴바