<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
<source src="movie.webm" type="video/webm">
<object data="movie.mp4" width="320" height="240">
<embed src="movie.swf" width="320" height="240">
</object>
</video> 

음 그러니까 설명을 하자면...

브라우저마다 지원하는 동영상 코덱이 모두 다 다르다~

그럼으로 위와같이 mp4, ogg, webm 동영상을 모두 서버에 업로드 해 둔 다음에, 모두 source 태그에 포함시켜 버리는 것이다.

비디오 태그가 자바스크립트 callback(콜백) 을 지원해 주기 때문에, 매우 저버리기 아까운 태그이다.

결론부터 말하자면,

사파리 -> mp4 재생

그밖에 -> webm 재생

으로 하면 다 해결된다.

webm은 사파리 이외의 모든 브라우저에서 재생이 됨을 확인했고, 사파리는 mp4만 재생이 됨을 확인했다.