랜드모아 
랜드모아 로그인   
랜드모아
 
동영상관련
 


HTML5 비디오 태그와 mp4 파일로의 인코딩
  2017-03-23 22:58:22 조회:595
글자수:2298


HTML5 비디오 태그와 mp4 파일로의 인코딩 




HTML5 포멧의 비디오 태그
______________________________________________________________________________
<!DOCTYPE html>
<html>
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
   <video  id="video" width="320" height="240" controls poster="하늘2.png">
      <source src="테스트.mp4" type="video/mp4">
      <source src="movie.ogg" type="video/ogg">
    지원하지 않는 브라우저 입니다.
   </video> 

<body>
</html>

______________________________________________________________________________  


이전에는 윈도우의 익스플로러에 의한 동영상 재생이 대부분이었습니다.
그래서 많은 인터넷 동영상 서버들이 WMV 포멧으로 동영상을 재생하곤 했습니다.
물론 프로그램을 하는 사람들의 입장에서는 코딩과 제어도 따로 추가 해야 했구요.

하지만 최근 많은 브라우즈가 HTML5를 지원하면서 별도의 외부프로그램에 의존하지 않고 동영상이나 소리를 재생하게 되었습니다.

때문에 많은 스트리밍 동영상 서버들은 WMV 파일의 포멧을 MP4나 MKV, OGG 등으로 변환하여 사용해야 하게 되었네요.

여기서는 간편하게 다음의 팟인코더를 활용하여 WMV 파일로 된 동영상을 스트리밍 가능한 MP4 파일로 변환하는 방법을 알아봅니다.




위 화면은 [다음팟 인코더]에서 [불러오기] 버턴을 눌러 변환할 WMV 파일을 연 모습입니다.
여기서는 꼭 WMV 파일인 아니라 어떤 포멧의 동영상  파일이라도 스트리밍 가능한 동영상 파일오 변환될 수 있습니다.

참고로 나중에 인코딩된 파일이 저장될 하단의 [저장폴드]를 확인하시고 마음에 들지 않으면 변경해 두시면 됩니다.
새로운 포멧으로 인코딩하기 위해 [환경설정] 버턴을 누릅니다.





여기서는 mp4 파일로 변경이 되어야 하므로 우측 상단은 [mp4 설정]이 나와야 합니다.
비디오 코덱 : MPEG-4 AVC/H264
오디오 코덱 : Advanced Audio coding(AAC)
화면 크기는 적당히 
화면 비율유지에 체크하시고 하단의 확인을 누르시면 설정은 끝납니다.

참고로 이 설정을 나중에도 사용해야겠다고 생각이 되시면
하단의 [내설정 주가] 버턴을 클릭하세요.




그러면 현재의 내용을 저장할 설정이름을 묻습니다.
여기서는 [mp4설정]이라고 적어 봤습니다.
설정이 끝났으면 위 환경설정 우측하단의 [확인] 버턴을 클릭해 설정을 끝냅니다ㅏ.





위 화면은 어떤 포멧의 비디오와 오디오 코덱으로 인코딩하여 파일명은 어떤 것으로 할지에 대한 내용입니다.
파일명의 확장자 : mp4로 되어야 하며
비디오 코덱 : H264(AVC1)
오디오 코덱 : AAC 로 되어 있어야 합니다.

만약 위와 다르다면 설정이 잘못된 것이므로 참고하여 다시 설정하세요.
설정이 끝났으면 [인코딩시작] 버턴을 클릭합니다.
 




위 화면은 인코딩이 끝났다는 것을 나타냅니다.




위 첫머리에 있는 코드를 브라우즈에서 실행해 본 것입니다.
참고로 이 포멧은 익스플로러 9 이상, 크롬, 사파리 정도에서 작동됩니다.





 댓글 (0)


동영상관련
페이지: 1 / 1   


     다음팟플레이어 동영상 재생정보 화면에 보이기와 감추71
     direct copy - 다음팟인코더 동영상 편집시258
     아이크로소프트의 윈도우즈 무비메이커 다운로드 및 설193
     다음 팟플레이어-소리만 나오고 영상이 나오지 않을때253
     캠타시아 소리 배속 설정 - camtasia 빨리감122
     유튜브 다운로드 - 유튜브 youtube 동영상 쉽103
     다음팟 플레이어 자동 업데이트 금지104
     크롬을 이용한 페이스북 동영상 다운로드3117
     웹서비스 - 페이스북 동영상 다운로드하기3082
     동영상에서 소리, 음성 제거하기 - 다음 팟인코더 4516
     윈도우즈 바탕화면에 글씨쓰기 그림그리기4095
     mms 등 동영상 주소찾는 프로그램 URL snoo1152
     FLV 플레이어 - FLVPlayer4Free1020
     마우스 우클릭해제 - IEToy 설치와 사용법1168
     다운로드의 왕자 - Net Transport 사용하1102
     FLV 파일변환 유틸리티 show1012
     사진편집 프로그램 - 포토스케이프(PhotoScap790
     동영상 파일의 합치기,나누기,컨버팅,복구 - Asf1066
     유투브 동영상 다운로드 방법 - Youtube Do1149
  HTML5 비디오 태그와 mp4 파일로의 인코딩596
      동영상 파일의 합치기,나누기,컨버팅,복구 - Asf4017
≪ [1]   ≫

복수단어 검색은 공백(space)로 구분해 주세요.



공지사항

 
인기 글
6911
9186
18973
8203
13814
6297
6828
11780
12684
7201
5985
9846
6383
5797
5775
 
최근 글
83
94
66
84
68
71
118
91
89
87
148
112
157
160
258