글쓰기에 앞서...
이 내용은 엄밀히 말하면 '테일즈위버' 자체와는 그다지 상관이 없습니다.
하지만 요즘 테일즈위버 영상의 업로드도 점점 활발해지는 상황이고 테일즈 유저분들 중에 영상 계정 등에 대해서 관심을 갖게 되신 유저분들도 꽤 있을 거라고 생각합니다.
또한 근래에 앰앤캐스트의 재정 악화 문제가 발생하고 고화질 영상 서비스들이 불안정한 경우가 많아서 마땅한 계정을 찾기가 좀 힘든 감도 있습니다.
유튜브의 경우 구글계열이기 때문에 서비스가 중단될 위험은 매우 적다고 볼 수 있고 근래에 들어서 720p의 고화질 서비스를 지원하기 때문에 괜찮은 서비스이지만 사용법이 비교적 불편해서 잘 안쓰이고 있는 실정인데요. (지금 '동영상정보' 게시판을 보더라고 해도 다음 기본 영상 업로드 서비스를 사용하신 분이 대부분이고..) 이번에 한번 소개를 해볼까 해봅니다.
원문은 http://talesbox.tistory.com/17, http://talesbox.tistory.com/18 에 작성하였고 도와주신 [트레]행복의시작님께는 감사의 말씀을 전합니다.
우선 유튜브의 최적인 동영상 형식은 다음과 같습니다.
- 반드시 영상 길이는 10분 미만.
- 높은 비트레이트 (적어도 유튜브의 최고화질인 2000kbps보다는 높은게 좋음)
- fps는 딱히 적혀있지 않네요 ''..;; 24이상이면 되면 될듯
- h.264, mpeg-2, mpeg-4 코덱을 사용.. 저는 h.264를 사용하기로 합니다.
- 오디오는 mp3나 AAC 형식으로 해서 걍 높게 잡으면 될듯하네요.
해상도의 경우 유튜브 측에서는 640*480 같은 SD 급도 괜찮다고 적어놓긴 했으나 막상 그렇게 해서 올리면 최고화질의 옵션으로는 인코딩이 되지 않습니다. 영상 크기도 크기지만 와이드가 지원되지 않는 테일즈위버인 이상 해상도를 변경하기 위해서라도 인코딩은 필수 입니다.
인코딩툴의 경우 휴대용 기기들의 보급도 많이 되었고 한 만큼 시중에도 무료로 간편하게 사용할 수 있는 툴들이 많습니다.
저는 다음 팟 인코더 기준으로 설명을 하려 합니다. 사용법도 간편한편이고 어차피 유튜브에서 재인코딩 될 영상인데 일일이 옵션줘가며 할 필요가 없기 때문이지요.
우선 다음 팟 인코더를 다운받아 설치합니다. (http://tvpot.daum.net/encoder/PotEncoderSpec.do)
인코더를 실행시키면 아래와 같은 화면이 뜨는데 우선 파일 불러오기 버튼을 눌러서 인코딩할 영상들을 추가합니다.
파일을 추가 시키면 인코딩 옵션 부분이 활성화 됩니다.
이제 이 부분을 수정해서 유튜브의 옵션에 알맞게 바꿔줘야 하는데.. 이는 아래처럼 합니다.
비트레이트의 경우는 저는 3600kbps를 설정했는데 이는 임의대로 수정하셔도 됩니다. (2000kbps만 넘기면 될듯..)
fps의 경우는 싱크가 변하는 경우도 있으니 (소리랑 화면이 맞지 않는다던가..) '원본 비율 유지'를 선택해주시구요.
화면 크기 부분에서 1280*720의 크기를 선택하되 위 처럼 '화면 비율 유지'를 선택하면 자동으로 양옆에 검은 띄를 둘러서 원본 영상이 와이드화면이 아니더라도 자체적으로 와이드 영상으로 바꿉니다.
이렇게 설정해두고 '인코딩 시작' 버튼을 누르면 인코딩이 진행됩니다. 인코딩이 끝나면 인코딩된 영상은
아래 위치에 저장됩니다. 물론 변경이 가능하니 원하는 위치를 설정하시면 됩니다.
2. YouTube에 업로드 & 사이트에 적용
업로드 자체는 그닥 어려운 일이 아니니 굳이 설명하지 않겠습니다. (회원가입 -> 업로드 -> 끝??..)
다만 위에서 설정한 대로 인코딩을 마친 뒤 업로드까지 끝마쳤다면 자체 인코딩이 완료되기 까지 좀 시간이 걸리니까 천친히 기다려주시구요 -_-;;
인코딩 된 영상을 사이트에 올리기 위해서는 html 태그를 이용하는데 우선 유튜브에서 지원하는 옵션은 4가지가 있습니다.
- fmt = 6: 해상도 480*360, 영상 flv 700kbps, 소리 mp3 모노 96kbps
- fmt = 18: 해상도 480*360, 영상 h.264 500kbps, 소리 AAC 스테레오 128kbps
- fmt = 22: 해상도 1280*720, 영상 h.264 2000kbps, 소리 AAC 스테레오 224kbps
참고: fmt=22 옵션을 이용해서 링크한 영상은 h264 코덱을 사용하면서 해상도의 크기가 1280*720이나 되기 때문에(예전의 1024*768 화면에는 들어가지도 않는 크기입니다.) 오래된 싱글코어 cpu를 사용한다면 연산능력이 달려서 어느정도 끊김이 발생합니다. (인터넷 회선과는 별개의 문제입니다. 비트레이트 봐서 1초당 2~300kbyte씩 받기만 해도 충분히 커버가 가능한 전송량이거든요.)
현재 동영상 페이지에서 '고화질로 보기'를 누르면 fmt=22 또는 fmt=6이 재생되는 듯합니다.
위에서 말씀드린대로 설정을 하시고 인코딩을 하셨다면 fmt=22까지 인코딩 될 것입니다. 이를 사이트에 올리기 위해서는 태그에 수정을 해야합니다.
우선 영상을 퍼가기 위한 소스, 링크 주소는
영상의 우측부분에 위의 스샷처럼 나오게 됩니다. 이를 각각 복사해서 단순히 링크 주소로 두거나 사이트 내에 html 태그로 삽입하면 됩니다. 물론 화질을 변경해서 올리기 위해서는 아래 처럼 변경을 해주어야 하는데..
우선 단순한 영상 주소 링크의 경우 뒤에 &fmt=옵션숫자를 붙여 주시면 됩니다.
ex: http://www.youtube.com/watch?v=KKXMSE_YvRs -> http://www.youtube.com/watch?v=KKXMSE_YvRs&fmt=22
영상을 사이트 내에 삽입하기 위해서는(퍼가기) 영상의 주소에 &ap=%2526fmt%3D옵션숫자를 붙여 주시면 됩니다.
<object width="640" height="385"><param name="movie" value="http://www.youtube.com/v/KKXMSE_YvRs&hl=ko&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/KKXMSE_YvRs&hl=ko&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385"></embed></object>
->
<object width="640" height="385"><param name="movie" value="http://www.youtube.com/v/KKXMSE_YvRs&hl=ko&fs=1&ap=%2526fmt%3D22"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/KKXMSE_YvRs&hl=ko&fs=1&ap=%2526fmt%3D22" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385"></embed></object>
코드만 봐서는 알기 어려우니 예시를 한번 작성해봅시다.
일단 fmt=22옵션을 준 영상을 사이트에 띄우고 그 밑에 저사양 컴퓨터(또는 인터넷이 느리신분)을 위한 링크를 따로 걸려고 합니다. 그렇게 하기 위해서 위의 코드를 이용해서 아래와 같은 코드를 작성했습니다.
<object width="640" height="385"><param name="movie" value="http://www.youtube.com/v/KKXMSE_YvRs&hl=ko&fs=1&ap=%2526fmt%3D22"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/KKXMSE_YvRs&hl=ko&fs=1&ap=%2526fmt%3D22" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385"></embed></object>
</DIV>
<DIV style="TEXT-ALIGN: left">
저사양이거나 인터넷이 느릴 경우
<A title="[http://www.youtube.com/watch?v=KKXMSE_YVRs&fmt=18]로 이동합니다."
href="http://www.youtube.com/watch?v=KKXMSE_YvRs&fmt=18"
target=_blank>
<STRONG>여기</STRONG>
</A>
를 클릭
</DIV>
코드를 살짝 설명하자면 ..
DIV 태그는 내용을 정렬 하는 태그입니다. 영상 부분에서는 center를 이용해서 가운데 정렬을, 글자 부분에서는 left를 이용해서 왼쪽 정렬을 시켰습니다.
DIV태그 안에는 복사한 내용이 들어갑니다. 첫부분의 영상부분을 페이지에 띄우기 위해서 수정된 소스코드를 삽입했구요.
밑에부분은 '저사양이거나 인터넷이 느릴 경우 여기를 클릭' 이라는 문구 중에서 '여기' 부분만 A태그를 사용해서 링크를 걸고 STRONG 태그를 사용해서 글자를 굵게 표시 시켰습니다. (B태그를 써도 글자가 굵게 되는데 웹표준 문제 때문인지 STRONG을 쓰는게 더 좋다고 합니다.)
작성된 코드를 html 편집 화면등을 이용해서 삽입하면 아래와 같은 화면이 출력됩니다. (물론 글상자 부분의 코드는 제외되어 있습니다.)
'▶ 세상에 말걸기 ◀◀ > ▣ 컴과 넷' 카테고리의 다른 글
[TIp] 네이버블로그에서도 다음블로그인 사랑방을 구독할 수 있습니다. (0) | 2010.02.22 |
---|---|
[Tip] 단축키 하나만 제대로 써도 속도가 빨라져요~ (0) | 2010.02.17 |
[Com] 네이버 블로그 검색등록 - RSS 피드등록 요쳥 (0) | 2010.01.14 |
[Com] 동영상을 다운로드 해주는 사이트들 - (0) | 2010.01.02 |
[Com] 블로그나 사이트 로딩 속도 줄이기 2탄 (0) | 2009.12.31 |