# 180: Бъркане с видео на мобилни устройства - CSS-трикове

Anonim

Справедливо предупреждение: Не съм експерт по тези неща, просто си играя с видео в мрежата и разглеждам някои проблеми, които имам, когато показвам видеоклипове в публикации в блога.

Имам iOS симулатор в това видео и слагам HTML видео маркер в основен HTML документ за бърз видеоклип, който записах с Kap.

Има много неща, които трябва да се вземат предвид при видео:

  1. Давайки го контролира! Както в ,. Забележете във видеото, че ми отне минута, за да разбера, че затова видеото не се показва изобщо на мобилно устройство, докато не се появи.
  2. Възпроизвеждането на видеоклипа вградено, подобно , което му пречи да премине на цял екран на мобилното устройство в секундата, когато го пуснете.
  3. Оразмерявайте го плавно и с пропорции.
  4. Къде да го домакин. Добре ли е вашият уеб сървър? Трябва ли да е на CDN? Трябва ли да използвате медиен хост, специализиран в подобни неща? Във видеото го използвам на Droplr, което е удобно, след това на CodePen Asset Hosting, който също е удобен, и в крайна сметка на Cloudinary, защото може да прави фантастични неща като оптимизация и обработка на формати.
  5. Уверете се, че видеото изглежда като проклет видеоклип. На мобилно устройство, ако използвате , това означава, плакат: . В противен случай получавате празно бяло нищо. Понякога само това си струва да се използва някакъв помощник.

Разбира се, можете просто да хвърлите видеоклипове в YouTube или каквото и да е и да получите добра обработка на видео за нищо. Но YouTube не винаги е подходящ за малки демонстрационни видеоклипове, с които имах работа тук. Плюс това те са тежки, така че може би гледате мързеливи товари.

В крайна сметка разглеждаме studio.cloudinary.com. Той може да направи някои добри неща, като например да предложи персонализиран плейър и да адаптира битрейт поточно предаване, което е фантазия и наистина изглежда като важно нещо за възможно най-доброто видео изпълнение.