Ang HTML 5 nga tag sa video naghimong sayon sa pagdugang sa video sa imong mga Web page . Apan bisan kini daw sayon sa ibabaw, adunay daghan nga mga butang nga kinahanglan nimo buhaton aron makuha ang imong video ug pagdagan. Kini nga panudlo magdala kanimo pinaagi sa mga lakang aron sa paghimo sa usa ka pahina sa HTML 5 nga mopadagan sa video sa tanang modernong mga browser.
- Pag-host sa Imong Kaugalingong HTML 5 Video vs. Paggamit sa YouTube
- Quick Overview sa Video Support sa Web
- Paghimo ug Pag-ilis sa Imong Video
- I-convert ang Video sa Ogg alang sa Firefox
- I-convert ang Video sa MP4 alang sa Safari
- I-convert ang Video sa FLV alang sa Internet Explorer
- Idugang ang Elemento sa Video sa Imong Web Page
- Idugang ang JavaScript ug Flash Player aron ang Internet Explorer magtrabaho Bahin 1
- Pagsulay sa Daghang Mga Browser Samtang Ikaw Makahimo
01 sa 10
Pag-host sa Imong Kaugalingong HTML 5 Video vs. Paggamit sa YouTube
Ang YouTube usa ka maayo nga site. Gihimo nga sayon ang pag-embed sa video ngadto sa mga panid sa Web sa madali, ug uban sa pipila ka mga ginagmay nga mga eksepsiyon nga adunay igong gidaghanon sa pagpatuman niini nga mga video. Kon mag-post ka og video sa YouTube, mahimo ka nga masaligon nga adunay bisan kinsa ang makatan-aw niini.
Apan ang Paggamit sa YouTube sa Pag-embed sa Imong Mga Video Adunay Ang Mga Kakulian
Kadaghanan sa mga problema sa YouTube anaa sa consumer nga bahin, kay sa sa magdudula, mga butang sama sa:
- Hinay nga pagpangita ug pag-indeks
- Ang mga kakulangan sa server
- Gikuha nga hugpong (morag) nga arbitraryong
- Daghang dili maayo nga sulod
Apan adunay pipila ka mga rason ngano nga ang YouTube dili maayo alang sa mga tig-develop sa sulod usab, lakip ang:
- 10 minutos nga maximum nga gitas-on alang sa mga video (alang sa libre nga mga account)
- Dili maayo ang pag-upload nga performance
- Ang YouTube nakakuha sa walay kinutuban nga mga katungod sa paggamit sa imong video
- Ang bisan unsang YouTube nga tigpamuha makaangkon og walay kinutuban nga mga katungod sa paggamit sa imong video
Ang HTML 5 Video Naghatag og Pipila ka mga Kaayohan sa YouTube
Ang paggamit sa HTML 5 alang sa video magbutang kanimo sa pagkontrol sa matag aspeto sa imong video, gikan sa kinsa ang makatan-aw niini, hangtud kanus-a kini, unsa ang anaa sa sulod, diin kini gidumala ug kung giunsa nga ang server nag-perform. Ug ang HTML 5 nga video naghatag kanimo sa oportunidad sa pag-encode sa imong video sa daghang mga format nga kinahanglan nimo nga masiguro nga ang pinakadaghan nga mga tawo makatan-aw niini. Ang imong mga kustomer wala magkinahanglan og usa ka plugin o maghulat hangtud nga ipagawas sa YouTube ang mas bag-ong bersyon.
Sa Kurso, ang HTML 5 Nagtanyag sa Video Ang pipila ka mga Kakulian
Kini naglakip sa:
- Kinahanglan mo nga pag-encode sa imong video sa labing menos tulo ka lainlaing codec
- Kinahanglan nimong ilakip ang pipila ka JavaScript aron maseguro nga ang mga browser nga wala mosuporta sa HTML 5 magtrabaho
- Ang imong server kinahanglan nga makahimo sa pagdumala sa mga gikinahanglan sa bandwidth sa pag-host sa mga video
02 sa 10
Quick Overview sa Video Support sa Web
Ang dugang nga video sa mga panid sa Web dugay na nga lisud nga proseso. Adunay daghang mga butang nga mahimong sayup:
- Una, gigamit nimo ang
- Busa ibalhin ka sa tag sa
- Unya ikaw maghunahuna " Flash !" Ug pag-encode sa imong video isip FLV file. Apan ang Flash wala suportado sa daghang mga mobile device ug daghang mga tawo nga nagdumot sa Flash bisan kung giunsa kini gigamit (25% sa mga respondents sa akong poll nga nangutana mahitungod sa unsa ang imong gibati mahitungod sa Flash nag ingon nga dili sila makabarug sa Flash sa bisan unsa nga paagi).
- Busa nakahukom ka nga i-upload ang imong video sa usa ka video embedding site sama sa YouTube, apan duna kay problema sa YouTube nga among gihisgutan.
- Sa katapusan, nakahukom ka nga moadto uban sa HTML 5, apan ang Internet Explorer wala mosuporta niini (dili hangtud sa Internet Explorer 9). Ug bisan kung buhaton nimo, adunay duha ka video codec standards nga gisuportahan ug usa lamang ka browser nga magamit sa duha. Suporta sa Browser alang sa mga Video Codec ug mga sudlanan
Busa unsay angay nimong buhaton? Ang paghatag sa video dili na usa ka kapilian alang sa kadaghanan sa mga site, samtang ang video nahimong mas ug mas importante. Ug daghan nga mga site nga malampuson nga nakabalhin sa video.
Ang mosunod nga mga panid niining artikuloha magatabang kanimo kon unsaon pagdugang sa video sa imong mga Web page nga nagtrabaho sa Firefox 3.5, Opera 10.5, Chrome 3.0, Safari 3 ug 4, iPhone ug Android, Flash, ug Internet Explorer 7 ug 8. Ikaw usab adunay mga yawe nga imong gikinahanglan aron makadugang sa suporta alang sa ubang mga daan nga mga browser kon gikinahanglan.
03 sa 10
Paghimo ug Pag-ilis sa Imong Video
Ang unang butang nga imong gikinahanglan sa dihang imong ibutang ang usa ka video sa usa ka Web page mao ang aktwal nga video. Mahimo nimo mapadayon ang pagpana ug pag-edit pagkahuman aron paghimo og usa ka bahin, o mahimo nimo kining isulat ug i-plano kini sa una. Ang bisan unsang paagi nga maayo ang pagtrabaho, kini bisan unsang butang nga imong nahimutangan. Kung wala ka mahibal-an kung unsa nga matang sa video ang kinahanglan nimong buhaton, susiha ang mga ideya gikan sa Desktop Video Guide:
- Mga Proyekto sa Family Video
- Marketing ug Promosyonal nga mga Video
- Video Virtual Tours
- Giunsa nga mga Video
- Mga Video sa Kasal
Pagkat-on Unsaon Pagrekord sa High-Quality Video
Siguroha nga nahibal-an mo kung unsaon pagrekord sa sulod sa balay ug sa gawas ingon man usab unsaon sa pagrekord sa audio. Ang pag-iilaw importante usab - ang mga buto nga hilabihan ka hayag nga makasakit sa mga mata, ug ngitngit nga tan-awon nga lapokon ug dili propesyonal. Bisan kung nagplano lang ka nga adunay usa ka 30-segundong video sa imong site, ang mas taas nga kalidad mao ang mas maayo nga kini magpakita sa imong website.
Hinumdumi usab nga ang katungod sa katungod magamit sa bisan unsang mga tingog o musika (maingon man stock footage) nga mahimo nimo gamiton sa imong video. Kon wala ka makaadto sa usa ka higala nga makasulat ug makadula og usa ka awit alang kanimo, kinahanglan ka nga mangita og wala'y royalty nga musika nga magdula sa luyo. Adunay mga dapit usab nga imong ma-stock ang footage aron idugang sa imong mga video.
Pag-edit sa Imong Video
Dili igsapayan unsa nga software sa pag-edit ang imong gigamit, basta kon pamilyar ka niini ug magamit kini sa epektibo. Si Gretchen, ang Desktop Video Guide, adunay pipila ka mga propesyonal nga pag-edit sa mga tip sa video nga makatabang kanimo sa pag-edit sa imong mga video aron kini mahimong nindot tan-awon.
Luwasa ang Imong Video sa MOV o AVI (o MPG, CD, DV)
Alang sa uban pa niini nga pagtulun-an, among ipahayag nga imong gitipigan ang imong video sa pipila ka matang sa kalidad (non-compressed) format sama sa AVI o MOV. Samtang ikaw makagamit niini nga mga file ingon nga kini, ikaw mahulog sa tanan nga mga problema sa video nga gihisgutan na namon. Ang mosunod nga mga panid mopatin-aw kon unsaon pag-convert sa imong file ngadto sa tulo ka matang aron makita kini sa kinadak-ang gidaghanon sa mga browser.
04 sa 10
I-convert ang Video sa Ogg alang sa Firefox
Ang unang format nga atong himuon mao ang Ogg (usahay gitawag og Ogg-Theora). Kini nga format mao ang usa nga ang Firefox 3.5, Opera 10.5, ug ang Chrome 3 makita tanan.
Sa kasubo, samtang ang Ogg adunay suporta sa browser, daghan sa inila nga mga video nga mga programa nga imong mapalit (Adobe Media Encoder, QuickTime, ug uban pa) dili mohatag og Ogg conversion option. Busa ang bugtong paagi sa pag-convert sa imong video sa Ogg mao ang pagpangita sa usa ka programa sa pagkakabig sa Web.
Mga Kapilian sa Pagpangilis
Adunay usa ka himan sa Internet nga gitawag Media-Convert nga nag-angkon sa pag-convert sa nagkalain-laing mga format sa video (ug audio) ngadto sa laing mga video (ug audio) nga mga format. Sa dihang gisulayan namo kini sa akong 3-segundos nga video sa pagsulay, dili namo kini mahimo sa akong Mac. Apan tingali adunay mas maayo nga suwerte. Kini nga site adunay kaayohan nga libre.
Ang ubang mga himan nga among nakit-an naglakip:
- Miro Video Converter (Windows Macintosh) - Kini nga programa adunay kaayohan sa pagkabig ngadto sa Ogg ug MP4 (H.264) ug kini bukas nga tinubdan.
- Koyote Video Converter (Windows)
- Free Video Converter Naghunahuna kami nga kini adunay Windows ug usa ka bersyon sa Macintosh, apan lisud isulti gikan sa ilang site
- Ang Simple Theora Encoder (Macintosh) - kini mao ang atong gigamit.
Sa higayon nga imong maluwas ang imong video sa format sa Ogg, i-save kini sa usa ka lokasyon sa imong website ug adto sa sunod nga panid aron ma-convert kini sa ubang mga format sa uban nga mga browser.
05 sa 10
I-convert ang Video sa MP4 alang sa Safari
Ang sunod nga format nga kinahanglan nimo nga i-convert ang imong video sa MP4 (H.264 video) aron kini mahimong dulaon sa Safari 3 ug 4 ug ang iPhone ug Android. Dugang pa, ang mga video sa H.264 mahimong sayon nga makabig ngadto sa mga file sa FLV alang sa pagtan-aw sa Flash.
Kini nga format mas dali nga magamit sa mga komersyal nga mga produkto, ug tingali aduna nay programa nga mag-convert ngadto sa MP4 kon ikaw adunay editor sa video. Kon ikaw adunay Adobe Premiere imong magamit ang Adobe Video Encoder, o kung ikaw adunay QuickTime Pro nga magtrabaho ingon man. Daghan sa mga tigpabalik nga among gihisgutan sa miaging panid ang mag-usab sa mga video sa MP4.
- Media-Convert - usa ka himan sa online
- Miro Video Converter (Windows Macintosh) - Kini nga programa adunay kaayohan sa pagkabig ngadto sa Ogg ug MP4 (H.264) ug kini bukas nga tinubdan.
- SUPER (Windows) - mag-convert sa daghang lain-laing mga tipo sa file sa MP4 ug FLV
- Free Video Converter Naghunahuna kami nga kini adunay Windows ug usa ka bersyon sa Macintosh, apan lisud isulti gikan sa ilang site
Luwasa ang imong MP4 file sa imong website ug kinahanglan nimo nga i-convert kini sa Flash para gamiton sa Internet Explorer.
06 sa 10
I-convert ang Video sa FLV alang sa Internet Explorer
Ang labing sayon nga paagi sa pag-convert sa mga video sa FLV mao ang paggamit sa Flash mismo. Kana mao kon giunsa nato pag-usab ang akong mga video sa Flash. Apan kung wala ka Flash, ania ang duha ka popular nga mga himan alang sa pag-convert sa mga file ngadto sa FLV:
- SUPER (Windows) - mag-convert sa daghang lain-laing mga tipo sa file sa MP4 ug FLV
- ffmpegX (Macintosh) - mag-convert sa daghang lain-laing matang sa file sa Mp4 ug FLV.
Luwasa ang imong FLV file sa imong website ug ang sunod nga pahina magpakita kanimo kon unsaon pagsulat sa HTML aron imong ma-play ang imong mga video.
07 sa 10
Idugang ang Elemento sa Video sa Imong Web Page
Sayon ra ang paggamit sa HTML 5 aron makadugang sa video sa mga panid sa Web. Ang kadaghanan sa mga modernong mga browser nagsuporta sa HTML 5 nga video, bisan dili sila tanan nagsuporta niini sa samang paagi. Apan unsa ang gipasabut niini mao nga kon imong i-save ang imong video sama sa Ogg ug MP4 format, makahimo ikaw sa pagsulat og upat o lima ka mga linya sa HTML aron kini makita sa labing modernong mga browser (gawas sa Internet Explorer 8). Ania kung giunsa:
- Isulat ang HTML 5 doctype marker aron ang mga browser mahibal-an nga magdahom HTML 5:
- Paghimo sa imong Web page sama sa normal nga paghimo niini:
title>
ulo>
body>
html> - Sa sulod sa lawas, ibutang ang
- Paghukom unsa nga mga kinaiya nga gusto nimo nga ang imong video:
- autoplay - aron magsugod sa diha nga kini na-download
- kontrol - tugoti ang imong mga magbabasa sa pagkontrol sa video (paghunong, pagpauli, pagpadali)
- loop - sugdi ang video gikan sa sinugdanan kon kini matapos
- preload - pre-download ang video aron kini mas andam sa diha nga ang customer magsuksok niini
- poster - ipaila ang imahen nga gusto nimo gamiton sa dihang ang video gihunong
video> - Dayon idugang ang source files alang sa duha ka bersyon sa imong video (MP4 ug OGG) sulod sa elemento sa
:
- Ablihi ang panid sa Chrome 1, Firefox 3.5, Opera 10, ug / o Safari 4 ug siguroha nga kini husto ang pagpakita. Kinahanglan mo kini sulayan sa labing menos Firefox 3.5 ug Safari 4 - samtang sila naggamit sa lainlaing codec.
Mao kana. Sa higayon nga imong aduna kini nga code sa dapit ikaw adunay video nga nagtrabaho sa Firefox 3.5, Safari 4, Opera 10, ug Chrome 1. Apan komosta ang Internet Explorer?
Ang Internet Explorer Dili Gusto sa HTML 5 o sa Tag
Sa sunod nga seksyon, Among hisgutan kung unsa ang imong mahimo aron sa pagkuha sa IE 8 sa pagdula nga maayo sa imong HTML 5 video tags ug magpakita sa usa ka video. Kinahanglan nimo gamiton ang Flash. Ang maayong balita mao nga ang IE 9 gilauman nga mosuporta sa HTML 5 ug sa tag sa video.
08 sa 10
Idugang ang JavaScript ug Flash Player aron Makahimo ang Internet Explorer
Mahimo nimong namatikdan nga sa HTML sa miaging panid, walay linya sa tinubdan alang sa file sa FLV. Ug kung gisulayan nimo ang maong panid sa Internet Explorer dili kini molihok. Kana tungod kay ang Internet Explorer wala makaila sa HTML 5 ug kini dili makadula sa OGG o MP4 videos natively. Aron makuha ang Internet Explorer 7 ug 8 aron magtrabaho, kinahanglan nimo nga ipasalida kini nga video isip Flash. Apan dunay daghang mga lakang aron kini magamit kay sa pagdugang sa FLV file.
Lakang 1: Pagkuha og Flash Video Player alang sa Imong Website
Among girekomendar ang pagkuha sa FlowPlayer tungod kay kini usa ka open source Flash video player nga mahimo nimo ma-install sa imong Web server ug gamiton sa higayon nga ikaw adunay Flash video nga magdula. Ang libre nga bersyon sa FlowPlayer magsulod sa pag-anunsiyo sa imong mga video, apan mahimo ka usab nga mopalit sa mga lisensya sa komersyo kon gikinahanglan nimo kini.
Sunda ang mga instruksyon sa FlowPlayer site aron i-install ang FlowPlayer sa imong website. Sa ato pa, imong pag-instalar ang 2 SWF nga mga file ug ang JavaScript file sa imong site. Sa ubos sa imong HTML, (sa wala pa ang body> tag) makadugang ka usa ka linya: