[Mò] Nên dùng định dạng video nào cho HTML5

Chuyện này là trải nghiệm cá nhân về cái tag <video> trên HTML5, đọc cho vui nếu bạn cũng đang có rắc rối với nó 🙂

Nhân có dịp phải đưa mấy cái video lên web, ban đầu tính upload lên Youtube hay Vimeo rồi nhúng HTML vô cho nhanh gọn lẹ nhưng vì một vài lý do nên phải đưa lên server luôn thành thử mình có dịp dùng qua videojs và vài định dạng.

HTML5 hỗ trợ 3 định dạng video để play: MP4, WEBM, OGG. Ban đầu cứ nghĩ dùng các trình duyệt hỗ trợ full HTML5 như Firefox hay Chrome thì ngon ăn, nhưng ai dè trên Windows 7 (và cả Windows 8, 8.1) xài Firefox thì thế này

Còn trên Windows XP thì thế này

Ban đầu mình dùng định dạng MP4 để xuất file video, play video trên Chrome với Firefox/ Windows 7 quá ngon lành, chất lượng tuyệt vời 😀

Nhưng trên Windows XP thì có chuyện, dùng Chrome vẫn bình thường, dùng Firefox thì không load được video.  Do file MP4 mình xuất ra mặc định nó dùng Codec AVC1, mà theo Wikipedia thì AVC1 thuộc định dạng H.264. Đành phải chuyển qua định dạng OGV Theora, sử dụng tool Miro Video Converter nhưng mò hoài không tìm thấy chỗ nào cho phép chỉnh quality nên chất lượng file quá tệ, từ 1 file MP4 ~60MB cho ra file OGG chừng 5MB, không thể chấp nhận được.

Tiếp đến dùng tool Free WebM Video Converter để chuyển sang định dạng WebM VP8 với quality HD Ready 720p khá ổn.