컨텐츠 이미지사이트 :게티이미지뱅크, 아이클릭아트 참고
멀티 미디어 파일
이미지, 동영상 , 오디오 등의 파일들을 말한다.
인터넷 초기에는 동영상이나 오디오를 확인하기 위해 pc를 통해서만 멀티 미디어
파일들을 확인 할 수 있었다. 그래서 웹 초기때에는 ActiveX를 설치해야만 파일들을 확인 할 수 있었는데 바이러스 등 여러 문제가 발생하여 w3c에서 웹표준 태그로 멀티미디어 태그를 정의했다.
audio태그
오디오를 재생해주는 태그.
[기본형]
<audio src="경로" 속성></audio>
[속성 종류]
-autoplay :오디오를 자동 재생함.
-controls :오디오 컨트롤바.
-muted : 음소거
-preload : 재생버튼을 눌러 재생하기 전에 비디오 파일을 다운로드하여 준비함.
로딩상태.만약 속성명만 쓰면 자동으로 auto값으로 설정됨.
-none : 미디어 파일을 미리 다운로드 하지 않고 사용자가 재생 버튼을 누르면 다운로드함.
▪ metadata : 미디어 파일 전체를 다운로드하지 않고 메타 정보만 다운로드함.
▪ auto : 사용자가 즉시 이용할 수 있도록 웹 문서를 로드할 때마다 미디어 파일도 다운로드함. auto는 서버를 많이 차지하기 때문에 보통은 metadata를 주로 사용한다.
-Loop : 반복재생
video태그
비디오를 재생해주는 태그.
[기본형]
<audio src="경로" 속성></audio>
[속성 종류]
-autoplay :비디오를 자동 재생함. 동영상을 자동재생하려면 muted 속성이 함께 쓰여야함.
-controls :비디오 컨트롤바.
-muted : 음소거
-preload : 재생버튼을 눌러 재생하기 전에 비디오 파일을 다운로드하여 준비함.
->로딩상태
만약 속성명만 쓰면 자동으로 auto값으로 설정됨.
-none : 미디어 파일을 미리 다운로드 하지 않고 사용자가 재생 버튼을 누르면 다운로드함.
▪ metadata : 미디어 파일 전체를 다운로드하지 않고 메타 정보만 다운로드함.
동영상은 보이지만 다운로드 되지는 않은 상태를 말함.
▪ auto : 사용자가 즉시 이용할 수 있도록 웹 문서를 로드할 때마다 미디어 파일도 다운로드함.
-Loop : 반복재생
-poster : 브라우저나 인터넷 문제 등으로 영상을 재생할 수 없을 경우 표시.
-type : 웹 브라우저가 해당 미디어 파일을 재생할 수 있는지 확인하도록 미디어 파일의 유형을 알려주는 속성. 반드시 표기해준다.
*규정상 음소거 상태에서만 반복 재생이 가능하다.
비디오 태그를 입력 후에 너비도 지정해줄 수있는데 이때 단위는 생략하고 입력한다. ex 500(px)
*동영상은 한개지만 확장자가 여러개일때 아래와 같이 입력한다.
브라우저의 호환성을 위해 ( 모든 브라우저에 보여야하기 때문에 )여러 확장자를 넣어준다.
오디오 태그도 동일