html5 & css 살펴보기
DESCRIPTION
TRANSCRIPT
HTML5 특성
출처 : http://www.webtrendset.com/2010/12/13/`28-html5-features-tips-and-techniques-you-must-know/
더 분명한 마크업HTML5 이전버전 HTML
vs
http://html5demos.com/ 소스 http://andstudy.com 소스
기타 좋아진 점• 더 나은 애플리케이션–문서간 데이터 교환–웹 소켓–클라이언트 측 스토리지
• 더 좋은 인터페이스–더 좋은 폼 –향상된 접근성–개선된 선택자–시각 효과
HTML5 의 현재• 회사들의 이해 관계–표준에 대해서 주장하는 바가 다름– Audio 태그의 서로 다른 지원• http://www.jplayer.org/HTML5.Audio.Support/
• HTML5 와 CSS3 는 진행 중인 명세– http://dev.w3.org/html5/spec/Over-
view.html
하위 호환성• 독 타입 이란 ?– 사용한 HTML 문서 종류를 선언하는 부분– 종류
• http://www.w3.org/QA/2002/04/valid-dtd-list.html
– 독 타입에 따라 브라우저 랜더링 방식이 달라짐• 접근성– CSS 제거하면 ?
• 폐기된 태그들– http://www.w3.org/TR/html5-diff/
기초지식
출처 : http://www.webdesignfromscratch.com/html-css/how-html-css-js-work-together/
HTML
–문서의 구조와 정의를 표기 하는 법– http://www.w3schools.com/html/default.
asp
CSS
–요소들이 어떻게 표기 되어야 되는지 지정하는 서식
– http://www.w3schools.com/css/default.asp
JavaScript
–브라우저에 지원하는 스크립트 언어–폼내용을 검증 / 통신 /DOM 을 이용 요소 추
가 / 삭제 / 변경 지원– http://www.w3schools.com/js/default.asp
DOM
– HTML 문서의 요소를 접근 할 수 있는 표준 접근법
– http://www.w3schools.com/htmldom/default.asp
JQuery
– http://jquery.com/– JavaScript 대표적 라이브러리– JavaScript 함수 확정하여 문서 요소 접근 /
변경을 쉽게 하도록 해 줌– http://www.w3schools.com/jquery/defaul
t.asp
개발자 도구• 개발자 도구란 ?– DOM 탐색–스크립트 디버깅–런타임성능측정 / 네트워크 모니터링
• 개발자 도구 실행법– IE - F12–크롬 – Ctrl +Shift +I– Safari – Ctrl + Alt + I– FF – Firebug Extension
정리• HTML5 는 기존보다 분명한 마크업 구조를 지원한다 .• HTML5 은 미디어 재생 등에 별로 플러그인을
이용하지 않고도 멀티미디어 재생 가능• HTML 5 는 현재도 진행 중인 명세이며 각 밴더별로
구현의 차이가 발생됨• HTML/CSS/JavaScript/DOM/Jquery 들의
기술을 이용해 웹페이지를 구성 / 제어할 수 있다 .• 최신 브라우저에서 제공하는 개발자 도구를 제공한다 .