신기한 웹 세상

Tag

html5

HTML5 Video태그 사용하기!

정의 <video>는 비디오나 영화를 재생시킨다. 속성 src: 재생할 비디오의 주소를 지정한다. width: 요소의 너비를 지정한다. (value: pixels) height: 요소의 높이를 지정한다. (value: pixels) loop: 반복 재생을 지정한다. (value: loop) poster: 사용자 에이전트가 비디오 데이터를 사용할 수 없는 경우 이미지 파일의… Continue Reading →

HTML5 크로스브라우징을 위한 Polyfill 기술들

Polyfill이란? 개발자가 브라우저가 자체적으로 제공하기를 기대하는 기술을 실행한다. Polyfills는 웹브라우저에서 설치되어있지 않는 기능을 제공하는 하는 것이다. 예를 들어서 대표적인 HTML5의 특징들은 하위브라우저 IE 9이하 버전에서는 지원하지 않는데 Polyfill를 설치한 웹 페이지를 사용하면 가능해주는 기술이다. Web Shim과 HTML5 Shiv 관련된 개념이다…. Continue Reading →

모바일 브라우징 향상시키기 위해 HTML5의 입력 형식을 사용하기

<input type=”email” name=”email> 이메일 유형은 아이폰 iOS와 안드로이드 브라우저 모두 사용자 정의 키보드가 나타난다. iOS키보드에서는 “@”와 “.”가 키보드 아래 추가 되었다. 안드로이드트에서는 표준 콤마 키가 스페이스바 왼쪽에 “@”키가 나타난다. <input type=”url” name=”url” /> iOS url 주소 키보드 input type url은… Continue Reading →

HTML5 내용의 종류

1. 콘텐츠 모델(Content Models) 기존 HTML 기반의 마크업에서는 일반적으로 인라인 요소(Inline Element)와 블록 요소(Block Level Element)로 구분하는 정도의 개념만 존재하였지만, HTML5에서는 좀 더 명확한 정보 구조 설계 및 구성을 위해 카테고리를 정의하여 각 요소별로 비슷한 성격을 가지고 있는 것 끼리… Continue Reading →

Video 태그 사용하기 (HTML5 비디오와 플래쉬 대체)

<!– 먼저 HTML5 재생 시도: XML을 제공할 경우, `controls` to `controls=”controls”` and autoplay 을 확장 –> <!– 경고: 포스터 속성을 이용 할 경우, iOS3에서는 재생이 되지 않는다. iOS4에서는 해결되었다. –> <video width=”640″ height=”360″ controls> <!– MP4 must be first for… Continue Reading →

HTML5 시맨틱(Semantic) 마크업

  시맨틱 마크업(Semantic Markup) : 컴퓨터가 웹 정보자원의 의미를 이해할 수 있도록 문서의 논리적인 구조를 묘사하는 것. 시맨틱 마크업을 통해 얻을 수 있는 장점 – 접근성이 좋아짐 – SEO(Search Engine Optimization) – 수정이 용이해짐 – 코드 가독성이 좋아짐 – 코드와… Continue Reading →


© 2017 신기한 웹 세상

Up ↑