HTML 01

HTML 개발 툴

Brackets

- 미리 보기 기능이 있어 Chrome에서 바로 보기 가능

- 확장자들을 등록 해야함

- 작성 문서 대부분이 Brackets 기준

Visual Studio 2013 Express for Web

- 확장자 인식

ADOBE Dreamweaver CSS

외 등등

HTML5 추가 기능

멀티미디어

- HTML 웹 표준에 따라서 동영상을 재생하는 것이 아니라 플래시를 사용, HTML5는 플러그인의 도움 없이 스스로 음악과 동영상 재생가능

그래픽 http://lights.helloenjoy.com

- 하드웨어의 가속을 받아 2차원 그래픽과 3차원 그래픽 구현 가능, SVG 태그를 사용한 2차원 벡터 그래픽 구현, 자바스크립트 캔버스를 사용한 2차원 래스터 그래픽 구현

- 3차원 그래픽 구현 : CSS3를 사용한 3차원 구현, 자바스크립트 WebGL을 사용한 3차원 구현

통신

- 서버와 소켓 통신 가능, HTML 웹 표준은 단방향 방식으로 페이지 서버에 요청하고 서버에서 데이터를 받아왔는데 HTML5는 실시간으로 서버와 양방향 통신 수행 가능, 실시간 채팅 or 실시간 온라인 게임을 즐길 수 있다. 

그 이전에는 (폴링, 롱 폴링 기술을 써서 서버에 과부화 기술을 막아 양방향 통신을 하는 것처럼 보이게 만듬)

장치 접근

- HTML5는 장치에 접근해 장치의 정보와 기능을 사용할 수 있습니다. 스마트폰의 배터리 잔량과 같은 정보, 스마트폰의 기능인 GPS, 진동 벨을 사용 가능, WebOS SDK(developer.lge.com/webOSTV/sdk/web-sdk)를 사용하면 TV에 들어가는 애플리케이션도 만들 수 있다.

오프라인 및 저장소

- 인터넷이 연결되지 않은 상태에서도 애플리케이션이 동작할 수 있습니다. HTML5를 애플리케이션의 중심으로 사용하는 운영체제가 등장할 수 있다.

HTML5 시멘틱 태그

- 시멘틱(의미론적인) 웹을 구현하려고 만들어진 태그, 검색 엔진 같은 프로그램이 정보의 의미를 분석하고 자료를 검색 및 처리하여 제공하는 지능형 웹

CSS3 스타일시트

- CSS(Cascading Style Sheet)3 스타일 시트를 완벽하게 지원, 3차원 변환은 물론 애니메이션 효과를 적용

성능 및 통합

- 추가 기능을 사용해 웹의 성능을 극대화 가능

확장 프로그램

- Emmet : .템플릿 이외에도 각종 태그를 약어를 통해 불러주는 확장기능, http://docs.emmet.io/cheat-sheet/ 여기서 확인 가능

- Minimap : 옆 모습에 미니맵 보임

- Brackets File Icons : 파일을 아이콘으로 보이게함

- CSSFier : HTML에서 복사 붙여넣기 하면 CSS에서 바로 틀 만들어줌

- Interactive Linter : 각종 오류 체크

- Indent Guides : 들여쓰기 가이드라인 제공