最近好几个做站的朋友问我，网页上嵌的那种视频播放器有没有好看点的，自带的那套界面实在太丑了。其实这类超酷网页视频播放器现在挺多的，关键是很多都支持自定义界面，你想换成什么风格都行。我自己折腾了差不多两个礼拜，把市面上口碑还行的几款都试了一遍，有惊喜也有坑，今天就把真实感受写出来，给正在找超酷网页视频播放器的朋友省点时间。
说白了就一个字，顺眼。你想想，一个页面整体设计得挺清爽，结果视频播放器那排按钮又灰又土，整个质感就掉下去了。支持自定义界面的超酷网页视频播放器，能让你把播放按钮、进度条、音量图标全换成自己网站的配色，甚至可以把不常用的功能藏起来，只留最核心的几个。
我之前用过一个国外的播放器，功能确实强，但界面压根改不了，连颜色都锁死。后来换成另一款，好家伙，CSS变量直接暴露出来，改起来跟搭积木一样。所以选之前一定看清楚，它到底给不给你改界面的权限，别光看宣传图好看。
另外提醒一句，有些播放器说是支持自定义，其实只是换个logo了事，按钮位置动都动不了。这种就别浪费时间了，直接pass。
先说我用得最久的那款，名字就不提了免得像打广告，特点就是轻。整个JS文件压缩完不到30KB，加载飞快，界面通过一个配置对象就能改，背景色、圆角、按钮图标都能自己定。我把它嵌在一个小工具站上，访问速度基本没受影响。缺点是高级功能少，比如弹幕、画+中画这些得自己写。
还有一款偏重度一点的，自带皮肤市场，里面几十套现成的界面模板，挑一个套上去再微调几下，五分钟就能搞定。这款超酷网页视频播放器适合不想折腾代码的朋友，鼠标点一点就能换风格。但它体积大一些，加载大概多出两百毫秒，看你能不能接受了。
第三款是我在GitHub上翻到的，更新挺勤快，作者响应也快。它的自定义程度最高，连播放器控制栏的DOM结构都能改，但代价是文档写得跟天书似的，我啃了半天才搞明白。如果你前端底子还行，这款值得一试。
对了，还有一款移动端表现特别好，手机上按钮大小自动适配，手指点着不费劲。做H5页面的可以重点看看。
第一个坑，别光看演示站。演示站往往跑在本地或者优化过的服务器上，速度当然快。你得自己下载下来，放到真实环境里跑一遍，看看加载时间、内存占用能不能接受。
第二个坑，注意浏览器兼容。有些超酷网页视频播放器用了比较新的API，老版本浏览器直接白屏。虽然现在用老浏览器的人不多了，但保不齐你的用户里就有。我一般会拿两台旧手机测一下，能跑起来才放心用。
第三个坑，看清楚开源协议。有的说是开源，结果商用要收费，或者要求你保留版权信息还不能藏起来。这个提前看好，省得以后麻烦。
最后一个，别一次装好几个播放器。我刚开始贪心，同一个页面塞了两个，结果快捷键冲突了，按空格两个一起暂停，闹笑话。选一个顺手的，把自定义界面调到位就行了。
总的来说，找超酷网页视频播放器这事，没有绝对最好的，只有最适合你项目的。先想清楚自己需要哪些功能，再对着上面说的几点去筛，基本不会踩大坑。希望这篇分享能帮你少走点弯路，早点把播放器界面折腾成自己喜欢的样子。
鄂公网安备42011102004716号