본문 바로가기

HTML5

 (16)
현재까지의 정리 HTML5는 HTML의 새 버전이다. 문법은 간결해졌으며,자바스크립트를 정식 지원하게 되어 이전 버전보다 더 쉽게 웹 애플리케이션을 만들 수 있다. type은 script와 css스타일시트 연결부분에서 생략된다. 태그는 문자 인코딩을 포함하는 용도로만 사용된다. 웹에서 표준 문자셋은 UTF-8이다. 대부분의 브라우저는 HTML5를 지원한다. HTML의 새로운기능들은 자바스크립트를 활용하여 만들어졌다. 자바스크립트로 문서 객체 모델과 상호작용을 할 수 있다.*문서 객체 모델이란 웹 페이지를 내부적으로 표현하는 것 자바스크립트 api를 통해 HTML5의 모든 기능을 제어할 수 있다. CSS는 HTML5의 스타일 표준이다
자바 스크립트 실습 예제 문제.H대는 x월 x일부터 y월 y일까지 학생 예비군 훈련이 있다. 하지만 첫날부터 메르스에 감염된 학생이 1명 입소하여 매일 2배씩 메르스 환자가 증가하고 있다. 매일 몇명의 학생이나 감염되고, 몇일차가 되면 모든 예비군이 감염되는지 알아보자. 출력 예제 소스코드.
HTML5와 자바스크립트의 연관성 html5가 작동하는데 사용되는 대부분의 기술들은 자바스크립트로 만들어져 있다. 그렇기 때문에 html5를 제대로 다루기 위해서는 반드시 자바스크립트와 라이브러리들을 배워야만 한다.
자바스크립트로 할 수 있는 것 1.HTML5에서 자바스크립트는 플러그인 없이 페이지에서 2D그래픽을 만들 수 있다. 2.사용자의 위치를 파악해서 근처에 어떤 건물이 있는지 보여주고 특정 장소로 데려가거나 방향을 알려 줄 수 있다. 또한 같은 지역에 있는 공통의 관심사를 가진 사람들도 불러 모을 수 있다. 3.모바일과 데스크탑 페이지를 구분하여 구현할 수 있다. 4.웹 워커를 이용하여 사용자들의 멀티코어 프로세서를 훨씬 더 효율적으로 사용할 수 있다. 5.임의의 웹 서비스에 접근하여 실시간으로 우리가 만든 앱으로 데이터를 가져올 수 있다. 6.브라우저 저장소에 캐시 데이터를 담아 모바일 앱의 속도를 향상시킬 수 있다. 7.브라우저 기반의 로컬 저장소를 사용할 수 있다.
HTML5 용어정리 CSS3 여러 요소들을 움직이게 하고, 다양한 시각적 효과와 기능을 구현할 수 있다. 웹 워커사용자 인터페이스에 방해를 주지 않으면서, 백그라운드에서 동시에 실행되는 스크립트가 필요할때 사용할 수 있다. 폼정보를 입력할때, 필드에 값을 채워 사용한다. 오프라인 웹앱네트워크와 연결이 되지 않을때에도 작동하게 할 수 있다. 오디오,비디오이전에는 플러그인이 필요했지만 이제는 단순한 코드 몇줄로 삽입할 수 있다. 새로운 마크업페이지에 있는 구간, 머리글 , 바닥글, 내비게이션을 만드는 새로운 방법 등 페이지 구조를 체계적, 의미론적으로 만드는데 도움을 준다. 로컬 저장소서너개의 즐겨찾기 주소, 장바구니 목록, 거대한 캐시 등을 사용할 수 있는 api 캔버스웹페이지에 그림을 그릴 수 있다. 지오로케이션현재 위치를..
HTML의 작동방식 1.브라우저가 HTML로 작성된 마크업과 css로 작성된 스타일을 포함하고 있는 문서를 읽어들인다. 2.브라우저는 페이지를 읽으면서 HTML 마크업의 모든 요소를 포함하는 문서 내부 모델을 생성한다.->이때 브라우저는 html의 각 요소를 표현하는 객체를 생성하여 트리형태로 위치시킨다.->이러한 트리를 문서 객체 모델이라고 한다. 3.브라우저는 페이지를 여는동안 자바스크립트 코드를 읽어온다.(페이지가 다 띄워지고 실행된다.)->자바스크립트는 페이지와 상호작용, 이벤트 실행 등에 이용된다. 4.각종 API가 실행된다.(자바스크립트를 통해)
HTML5 관련 이야깃거리 HTML의 이전 버전에서도 doctype, meta태그 등은 작동한다. css와 자바스크립트가 html5에서 표준이 된 것은 사실이지만, 이미 이전부터 지원하고 있었기 때문이다. doctype와 meta태그 없이도 html작성은 가능하지만, 이는 브라우저가 사소한 오류는 무시하고 실행되기 때문이다. 하지만 doctype와 meta태그를 통해서 사용자가 원하는 바를 정확하게 표현할 수 있다. 예를들면, doctype을 명시하지 않으면 일부 브라우저에서는 쿼크모드로 변환된다. XHTML이 약진했음에도, html과 xml의 장점을 모두 가진 html5가 모두에게 받아들여지게 되었다. xhtml은 필요 이상으로 까다로웠다.
HTML과 HTML5의 차이점 1.doctype의 변화 이전버전에서의 doctype HTML5의 doctype 이것은 HTML뿐만이 아니라 HTML5 이후의 버전에서도 적용된다.(HTML6, HTML7가 나오더라도 doctype은 로 사용할 수 있다. 2.meta태그의 변화 이전버전에서의 meta태그 HTML5의 meta태그 HTML5는 문자열 인코딩 부분만 넣으면 작동한다. 3.text/css타입 링크의 변화 이전버전에서의 text/css타입 링크 HTML5의 text/css타입 링크 그냥 type속성만 제거하면 된다.css는 html5에서 스타일을 위한표준이다. *그 외에도 html5에서는 자바스크립트가 기본 표준 스크립트 언어가 되었기 때문에 script 태그에서 type을 제거할 수 있다. 인라인 코드 이런식으로 사용할 수 있다.

티스토리툴바