webm HTML코드 / 파일 무료변환기 VLC media player / Handbrake

 

런웨이 Gen4 사이트를 보다가 영상 클립이 있어 사용하려 보니 확장자가 저는 첨 보는거라 포스트 해 봅니다.

 

WebM은 개방형 미디어 파일 포맷으로, 구글(Google)이 주도하여 개발된 오픈 소스 동영상 및 오디오 컨테이너 포맷 입니다.

웹(Web) 환경에서 고품질 멀티미디어 콘텐츠를 효율적으로 스트리밍 및 재생할 수 있도록 설계되었으며, 주로 HTML5 웹 표준에서 권장하는 형식으로 활용 되네요 

 

---

"WEBP  HTML 코드를 알아보자 "

WebP는 이미지 포맷입니다. 비디오 코덱이 아닌, JPEG, PNG, GIF를 대체하기 위해 구글이 개발한 고효율 이미지 포맷이죠. 따라서 WebP는 코덱이 아니라 압축 이미지 포맷입니다.

 

1.HTML에 WebP 이미지를 삽입할 수 있는 방법은 아래와 같습니다.

 

<img src="image.webp" alt="설명 텍스트">

 

 

---

2. 호환성 코드

브라우저가 WebP를 지원하면 image.webp를 보여주고,

지원하지 않으면 자동으로 image.jpg를 보여줍니다.

img 태그는 항상 마지막에 fallback 용도로 삽입되어야 함.

 

 

<picture>
  <source srcset="image.webp" type="image/webp">
  <source srcset="image.jpg" type="image/jpeg"> <!-- fallback -->
  <img src="image.jpg" alt="설명 텍스트"> <!-- fallback 이미지 -->
</picture>

 

3. CSS에서 WebP 배경 이미지 사용

.element {
  background-image: url('image.webp');
}

---

 

1. WebM 개요 및 특징

• 파일 확장자: .webm
• 컨테이너 형식: Matroska(.mkv)를 기반으로 개발됨.
• 개방형 소스: 로열티가 없으며, 자유롭게 사용할 수 있는 오픈 소스 라이선스를 따름.

---

2. WebM 지원 코덱(Codec)

WebM은 주로 아래의 코덱을 사용한다:

유형사용 가능한 코덱설명

비디오	VP8, VP9, AV1	Google이 개발한 효율적인 비디오 압축 코덱. 특히 VP9와 AV1은 압축률과 화질이 뛰어나 YouTube, Netflix 등 스트리밍 플랫폼에서 활발히 사용됨.
오디오	Vorbis, Opus	Opus는 저지연 및 뛰어난 음질을 제공하며, VoIP 및 스트리밍 서비스에서 널리 사용됨.

• VP9와 AV1은 H.264/H.265와 비교하여 로열티 부담 없이 고화질 압축을 제공하기 때문에 웹 브라우저에서의 활용성이 높다.

---

3. WebM의 기술적 장점

• 효율적 압축률: 동일 품질의 영상을 더 작은 용량으로 압축할 수 있어 웹 페이지의 로딩 속도 향상에 유리.

webp 3.42메가 3.42메가

mp4로 컨버트시 5메가 5.11메가

 

 

 

• 오픈 소스와 무료 라이선스: 특허 로열티를 지불할 필요가 없어 상업적으로 자유롭게 사용할 수 있음.
• 웹 브라우저와의 높은 호환성: Chrome, Firefox, Edge, Opera 등 주요 웹 브라우저가 네이티브로 WebM을 지원함.

---

4. WebM 활용 분야 및 예시

• HTML5 웹사이트의 비디오 재생 표준 형식으로 널리 사용됨.
• YouTube 및 Netflix에서 VP9 및 AV1 코덱을 사용하여 고해상도(4K, 8K) 영상을 스트리밍할 때 활용됨.
• 게임 또는 애플리케이션의 인게임 동영상 및 인트로 영상의 웹 기반 스트리밍 재생.

5. WebM의 제한 사항

• Safari 및 구형 Internet Explorer 브라우저에서는 WebM 파일을 네이티브로 재생하지 못할 수 있음. (추가 플러그인 필요)
• 압축 및 인코딩 시간이 MP4(H.264/H.265)에 비해 비교적 오래 걸릴 수 있음.

---

6. MP4와 WebM의 비교

항목MP4WebM

지원 코덱	H.264, H.265(HEVC), AAC	VP8, VP9, AV1, Opus
로열티	있음 (특히 H.265)	없음 (오픈 소스)
웹 호환성	모든 브라우저 지원	Safari 제외 대부분의 주요 브라우저 지원
화질 대비 압축률	우수(H.265)	매우 우수(AV1, VP9)

 

---

이 파일을 편집하기 위해 일단 mp4 로 컨버터를 찾아봄 :

미디어 컨버트 VLC 미디어 플레이어 media player

 

https://www.videolan.org/index.ko.html

다운로드 페이지 

VLC: 공식 사이트 - 모든 OS의 무료 멀티미디어 솔루션! - VideoLAN

 

변환 저장하기 들어가서 설정하면 mp4로

 

파일 메뉴에서 / 추가하고 / 옵션 표기해서 아웃풋 경로 설정

 

웹사이트를 통한 변환

https://convertio.co/kr/

 

---

HandBrake: Open Source Video Transcoder