Đa phương tiện trên web là âm thanh, âm nhạc, video, phim và hình ảnh động.

Đa phương tiện là gì?

Đa phương tiện có nhiều định dạng khác nhau. Nó có thể là hầu hết mọi thứ bạn có thể nghe hoặc nhìn thấy, như hình ảnh, âm nhạc, âm thanh, video, bản ghi, phim, hoạt ảnh, v.v.

Các trang web thường chứa các phần tử đa phương tiện thuộc nhiều loại và định dạng khác nhau.

Hỗ trợ trình duyệt

Các trình duyệt web đầu tiên chỉ hỗ trợ văn bản, giới hạn ở một phông chữ có một màu duy nhất.

Sau này xuất hiện các trình duyệt hỗ trợ màu sắc, phông chữ, hình ảnh và đa phương tiện!

Định dạng đa phương tiện

Các phần tử đa phương tiện (như âm thanh hoặc video) được lưu trữ trong các tệp phương tiện.

Cách phổ biến nhất để khám phá loại tệp là xem phần mở rộng của tệp.

Tệp đa phương tiện có các định dạng và phần mở rộng khác nhau như: .wav, .mp3, .mp4, .mpg, .wmv và .avi.

Format	File	Description
MPEG	.mpg .mpeg	MPEG. Developed by the Moving Pictures Expert Group. The first popular video format on the web. Not supported anymore in HTML.
AVI	.avi	AVI (Audio Video Interleave). Developed by Microsoft. Commonly used in video cameras and TV hardware. Plays well on Windows computers, but not in web browsers.
WMV	.wmv	WMV (Windows Media Video). Developed by Microsoft. Commonly used in video cameras and TV hardware. Plays well on Windows computers, but not in web browsers.
QuickTime	.mov	QuickTime. Developed by Apple. Commonly used in video cameras and TV hardware. Plays well on Apple computers, but not in web browsers.
RealVideo	.rm .ram	RealVideo. Developed by Real Media to allow video streaming with low bandwidths. Does not play in web browsers.
Flash	.swf .flv	Flash. Developed by Macromedia. Often requires an extra component (plug-in) to play in web browsers.
Ogg	.ogg	Theora Ogg. Developed by the Xiph.Org Foundation. Supported by HTML.
WebM	.webm	WebM. Developed by Mozilla, Opera, Adobe, and Google. Supported by HTML.
MPEG-4 or MP4	.mp4	MP4. Developed by the Moving Pictures Expert Group. Commonly used in video cameras and TV hardware. Supported by all browsers and  recommended by YouTube.

HTML Video

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

Làm thế nào nó hoạt động
Thuộc tính điều khiển thêm các điều khiển video như phát, tạm dừng và âm lượng.

Bạn nên luôn bao gồm các thuộc tính chiều rộng và chiều cao. Nếu chiều cao và chiều rộng không được đặt, trang có thể nhấp nháy trong khi tải video.

Phần tử cho phép bạn chỉ định các tệp video thay thế mà trình duyệt có thể chọn. Trình duyệt sẽ sử dụng định dạng được nhận dạng đầu tiên.

Văn bản giữa thẻ sẽ chỉ được hiển thị trong các trình duyệt không hỗ trợ phần tử

HTML <video> Autoplay

Để bắt đầu video tự động, hãy sử dụng thuộc tính tự động phát:

<video width="320" height="240" autoplay>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

Thêm tắt tiếng (muted) sau khi tự động phát để video của bạn bắt đầu phát tự động (nhưng bị tắt tiếng):

<video width="320" height="240" autoplay muted>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

HTML Video Formats

Có ba định dạng video được hỗ trợ: MP4, WebM và Ogg. Hỗ trợ trình duyệt cho các định dạng khác nhau là:

Browser	MP4	WebM	Ogg
Edge	YES	YES	YES
Chrome	YES	YES	YES
Firefox	YES	YES	YES
Safari	YES	YES	NO
Opera	YES	YES	YES