"HTML5" vaizdo įrašo žyma leidžia lengvai pridėti vaizdo įrašą prie jūsų tinklalapių. Tačiau, nors atrodo lengvas ant paviršiaus, yra daug dalykų, kuriuos reikia padaryti, kad vaizdo įrašas būtų rodomas ir veikia. Šiame vadovėlyje bus atlikti veiksmai, siekiant sukurti HTML5 puslapį, kuriame bus rodomi vaizdo įrašai visose šiuolaikinėse naršyklėse.
- "Hostingas" jūsų "HTML5" vaizdo įrašas ir "YouTube" naudojimas
- Greita vaizdo palaikymo internete apžvalga
- Sukurkite ir redaguokite savo vaizdo įrašą
- Konvertuokite "Ogg" vaizdo įrašą "Firefox"
- Konvertuokite "Safari" vaizdo įrašą į "MP4"
- Konvertuoti "Video" į "FLV" naršyklę "Internet Explorer"
- Pridėti vaizdo įrašo elementą į savo tinklalapį
- Įtraukite "JavaScript" ir "Flash" grotuvą, kad "Internet Explorer" veiktų
- Išbandykite taip daug naršyklių, kiek galite
Jūsų "HTML 5" vaizdo įrašas ir "YouTube" naudojimas
"YouTube" yra puiki svetainė. Tai leidžia greitai įterpti vaizdo įrašą į tinklalapius, o su kai kuriomis mažomis išimtimis yra gana nesudėtinga vykdant tuos vaizdo įrašus. Jei paskelbiate vaizdo įrašą "YouTube", galite būti pakankamai įsitikinęs, kad visi galės jį žiūrėti.
Bet "YouTube" naudojimas įterpti jūsų vaizdo įrašus turi truputį
Dauguma problemų su "YouTube" yra vartotojų pusėje, o ne dizainerio pusėje, tokie dalykai kaip:
- Mažoji paieška ir indeksavimas
- Serverio išjungimas
- Turinys pašalinamas (atrodytų) savavališkai
- Per daug blogo turinio
Tačiau yra keletas priežasčių, dėl kurių "YouTube" yra blogai ir turinio kūrėjams, įskaitant:
- 10 minučių maksimalus vaizdo įrašų ilgis (nemokamoms paskyroms)
- Blogas įkėlimo efektyvumas
- "YouTube" gauna neribotas vaizdo įrašo naudojimo teises
- Kiekvienas "YouTube" naudotojas naudojasi neribotais vaizdo įrašo naudojimo teisėmis
HTML5 vaizdo įrašas suteikia tam tikrų privalumų per "YouTube"
Naudojant HTML5 vaizdo įrašui, galėsite valdyti kiekvieną vaizdo įrašo aspektą, nuo jo, kas gali jį peržiūrėti, kiek jis yra, kokį turinį turi, kur jis yra, ir kaip veikia serveris. O HTML5 vaizdo įrašas suteikia galimybę koduoti vaizdo įrašą tiek daug formatų, kiek reikia, kad kuo daugiau žmonių galėtų jį peržiūrėti. Jūsų klientams nereikia įjungti arba palaukti, kol "YouTube" išleidžia naują versiją.
Žinoma, HTML5 vaizdo įrašas turi tam tikrų trūkumų
Jie apima:
- Turite koduoti savo vaizdo įrašą bent trijuose skirtinguose kodekuose
- Turėsite įtraukti "JavaScript", kad užtikrintumėte HTML5 nepalaikomas naršykles
- Jūsų serveris turi sugebėti valdyti vaizdo įrašų priėmimo pralaidumo reikalavimus
Tęsti skaitymą žemiau
02 iš 10Greita vaizdo palaikymo internete apžvalga
Prisijungimas vaizdo įrašų į tinklalapius jau seniai yra sudėtingas procesas. Buvo tiek daug dalykų, kurie galėjo kilti blogai:
- Pirma, jūs naudojate tag įterpkite vaizdo įrašą į savo puslapį. BET ši žyma nebeteikiama kitai žyma. Ir kai kurios naršyklės vis tiek nepalaiko jo.
- Taigi jūs pereinate į žyma, tačiau senesnės naršyklės jo nepalaiko, o naujesnės naršyklės yra išrankios.
- Tada tu galvoji Flash! Ir koduoti savo vaizdo įrašą kaip FLV failą. Tačiau "Flash" daugelyje mobiliųjų įrenginių nepalaiko, o daugelis žmonių nekenčia "Flash", nesvarbu, kaip jie naudojami (25 proc. Mano apklausos respondentų, kurie klausia, kaip jūs manote apie "Flash", teigė, kad jie jokiu būdu negali laikyti "Flash").
- Taigi nuspręsite įkelti savo vaizdo įrašą į vaizdo įterpimo svetainę, pvz., "YouTube", bet tada turėsite problemų, su kuriomis aptarėme "YouTube".
- Galiausiai nusprendėte eiti su HTML5, bet "Internet Explorer" jo nepalaiko (tik "Internet Explorer 9"). Net jei jūs tai padarysite, yra palaikomi du vaizdo kodekų standartai, kuriuos galima naudoti tik vienoje naršyklėje. Naršyklės palaikymas vaizdo kodekams ir konteineriams
Taigi, ką turėtumėte daryti? Atsisakymas vaizdo įrašams nebėra daugelio svetainių pasirinkimas, nes vaizdo įrašas tampa vis svarbesnis. Ir daugelis svetainių sėkmingai perėjo prie vaizdo įrašo.
Toliau pateikiamuose šio straipsnio puslapiuose pateikiama informacija apie tai, kaip pridėti vaizdo įrašą į jūsų tinklalapius, kuriuose veikia "Firefox 3.5", "Opera 10.5", "Chrome 3.0", "Safari 3" ir "4", "iPhone" ir "Android", "Flash" ir "Internet Explorer 7" ir " Taip pat turite raktus, kuriuos prireikus reikės pridėti prie kitų senesnių naršyklių.
Tęsti skaitymą žemiau
03 iš 10Sukurkite ir redaguokite savo vaizdo įrašą
Pirmas dalykas, kurio reikia, kai jūs ketinate įdėti vaizdo įrašą į tinklalapį, yra faktinis vaizdo įrašas. Galite fotografuoti nepertraukiamai ir po to redaguoti, kad galėtumėte kurti funkciją, arba galite scenarijų jį planuoti anksčiau laiko. Bet kuriuo atveju gerai veikia, tai viskas, ko jums patinka. Jei nežinote, kokio tipo vaizdo įrašą turėtumėte padaryti, peržiūrėkite šias idėjas iš "Desktop Video Guide":
- Šeimos vaizdo projektai
- Rinkodaros ir reklaminiai vaizdo įrašai
- Vaizdo virtuali ekskursija
- Kaip vaizdo įrašus
- Vestuvių vaizdo įrašai
Sužinokite, kaip įrašyti aukštos kokybės vaizdo įrašą
Įsitikinkite, kad žinote, kaip įrašyti patalpose ir lauke, taip pat kaip įrašyti garsą. Apšvietimas taip pat yra labai svarbus - pernelyg ryškiai sužeidžiamos akys, o pernelyg tamsios tiesiog atrodo purvinas ir neprofesionalus. Net jei planuojate tik 30 sekundžių vaizdo įrašą savo svetainėje, tuo aukštesnė kokybė, tuo geriau ji atspindės jūsų svetainėje.
Taip pat atminkite, kad autorių teisės taikomos bet kokiems garsams ar muzikai (taip pat ir filmuotoms medžiagoms), kurias galbūt norėsite naudoti savo vaizdo įraše. Jei neturite prieigos prie draugo, kuris gali jums parašyti ir paleisti dainą, turėsite pamatyti nemokamą muziką fone. Taip pat yra vietų, kuriose galite pridėti filmuotą medžiagą į savo vaizdo įrašus.
Vaizdo redagavimas
Nesvarbu, kokią redagavimo programinę įrangą naudojate, tik tuo metu, kai esate susipažinę su ja ir galėsite ją efektyviai naudoti. Gretchen, "Desktop Video Guide", turi keletą profesionalių vaizdo redagavimo patarimų, kurie gali padėti redaguoti vaizdo įrašus, kad jie atrodytų puikiai.
Išsaugokite savo vaizdo įrašą į MOV arba AVI (arba MPG, CD, DV)
Norėdami likusį šios pamokos dalį, mes įsivaizduosime, kad jūsų vaizdo įrašas išsaugotas tam tikros rūšies aukštos kokybės (ne suspausto) formatu, pavyzdžiui, AVI ar MOV. Nors galite naudoti šiuos failus taip, kaip jie yra, jūs susiduriate su visomis vaizdo įrašo problemomis, apie kurias jau kalbėjome. Toliau nurodyti puslapiai paaiškins, kaip paversti failą trimis tipais, kad jį būtų galima peržiūrėti daugiausiai naršyklių.
04 iš 10Konvertuokite "Ogg" vaizdo įrašą "Firefox"
Pirmasis formatas, į kurį mes konvertuosime, yra Ogg (kartais vadinamas Ogg-Theora). Šis formatas yra tas, kurį gali peržiūrėti "Firefox 3.5", "Opera 10.5" ir "Chrome 3".
Deja, nors "Ogg" palaiko naršyklę, daugelis gerai žinomų vaizdo įrašų programų, kurias galite įsigyti ("Adobe Media Encoder", "QuickTime" ir tt), nepateikia "Ogg" konversijos parinkties. Taigi vienintelis būdas konvertuoti vaizdo įrašą į "Ogg" yra rasti konversijos programą žiniatinklyje.
Konversijos parinktys
Yra internetinė priemonė, vadinama "Media-Convert", kuri teigia, kad įvairius vaizdo įrašų (ir garso įrašų) formatus paverčia kitais vaizdo įrašų (ir garso) formatais. Kai bandėme su savo 3 sekundžių bandomuoju vaizdo įrašu, negalėjome į jį dirbti "Mac". Bet jums gali tekti sėkmės. Ši svetainė yra nemokama.
Kai kurios kitos priemonės, kurias radome, yra:
- "Miro Video Converter" ("Windows Macintosh") - ši programa naudinga konvertuoti į "Ogg" ir "MP4" (H.264), o tai yra atviro kodo.
- "Koyote Video Converter" ("Windows")
- Nemokama vaizdo keitiklis Mes manome, kad tai yra ir "Windows", ir "Macintosh" versija, tačiau jų svetainėje buvo sunku pasakyti
- Paprasta Theora Encoder ("Macintosh") - tai tas, kurį mes linkę naudoti.
Kai vaizdo įrašas bus išsaugotas Ogg formatu, įrašykite jį į savo svetainės vietą ir pereikite į kitą puslapį, kad galėtumėte jį konvertuoti į kitus, kitų naršyklių formatus.
Tęsti skaitymą žemiau
05 iš 10Konvertuokite "Safari" vaizdo įrašą į "MP4"
Kitas formatas, į kurį turėtumėte konvertuoti vaizdo įrašą, yra MP4 (H.264 vaizdo įrašas), kad jį būtų galima atkurti "Safari 3" ir "4" bei "iPhone" ir "Android". Be to, H.264 vaizdo įrašai gali būti lengvai konvertuojami į FLV failus, norint žiūrėti "Flash".
Šis formatas yra lengviau prieinamas komerciniuose produktuose, ir jūs turbūt jau turite programą, kuri konvertuos į MP4, jei turite vaizdo redaktorių. Jei turite "Adobe Premiere", galite naudoti "Adobe Video Encoder" arba jei turite "QuickTime Pro", kuris taip pat veiks. Daugelis konverterių, apie kuriuos mes kalbėjome ankstesniame puslapyje, taip pat konvertuos vaizdo įrašus į MP4.
- MediaConvert - internetinis AWS įrankis.
- "Miro Video Converter" ("Windows Macintosh") - ši programa naudinga konvertuoti į "Ogg" ir "MP4" (H.264), o tai yra atviro kodo.
- SUPER ("Windows") - konvertuos daug skirtingų failų tipų į MP4 ir FLV
- Nemokama vaizdo keitiklis Mes manome, kad tai yra ir "Windows", ir "Macintosh" versija, tačiau jų svetainėje buvo sunku pasakyti.
Išsaugokite savo MP4 failą į savo svetainę, o tada turėsite jį konvertuoti į "Flash", kurį naudos "Internet Explorer".
06 iš 10Konvertuoti "Video" į "FLV" naršyklę "Internet Explorer"
Lengviausias būdas konvertuoti vaizdo įrašus į FLV yra naudoti pačią "Flash". Būtent taip mes konvertuojame mano vaizdo įrašus į "Flash". Bet jei neturite "Flash", čia yra du populiariausi failų konvertavimo į FLV įrankiai:
- SUPER ("Windows") - konvertuos daug skirtingų failų tipų į MP4 ir FLV
- ffmpegX (Macintosh) - konvertuos daug įvairių failų tipų į Mp4 ir FLV.
Išsaugokite savo FLV failą į savo svetainę, o kitame puslapyje parodysite, kaip rašyti HTML, kad galėtumėte atkurti savo vaizdo įrašus.
Tęsti skaitymą žemiau
07 iš 10Pridėti vaizdo įrašo elementą į savo tinklalapį
Labai paprasta naudoti HTML 5, norint pridėti vaizdo įrašą į tinklalapius. Dauguma šiuolaikinių naršyklių palaiko "HTML 5" vaizdo įrašą, nors jos ne visi palaiko tą patį. Bet tai reiškia, kad jei išsaugosite savo vaizdo įrašą kaip "Ogg" ir "MP4" formatus, galėsite parašyti tik keturias ar penkis HTML eilutes, kad jį būtų galima rodyti daugelyje modernių naršyklių (išskyrus "Internet Explorer 8"). Štai kaip:
Įrašykite žymeklį "HTML 5 doctype", kad naršyklės žinotų, kad tikisi HTML 5:
- Sukurkite savo tinklalapį, kaip paprastai jį sukuriate:
- Kūno vietoje uždėkite
- Nuspręskite, kokie atributai nori turėti jūsų vaizdo įrašą: rekomenduojame naudoti valdiklius ir iš anksto įkelti. Naudokite plakato parinktį, jei jūsų vaizdo įraše nėra geros pirmosios scenos.
- autoplay - paleisti iš karto, kai tik atsisiunčiama
- valdikliai - leisk savo skaitytojams valdyti vaizdo įrašą (pristabdyti, perverti, greitai perduoti)
- ciklas - paleiskite vaizdo įrašą nuo pat pradžios, kai jis baigiasi
- išankstinė įkėlimas - iš anksto atsisiųskite vaizdo įrašą, kad jis būtų paruoštas greičiau, kai klientas spustelėja jį
- plakatas - apibrėžkite vaizdą, kurį norite naudoti, kai vaizdo įrašas yra sustabdytas
- Tada pridėkite šaltinio failus dviem savo vaizdo įrašo (MP4 ir OGG) versijoms
- Atidarykite puslapį "Chrome" 1, "Firefox 3.5", "Opera 10" ir / arba "Safari 4" ir įsitikinkite, kad jis rodomas teisingai. Turėtumėte išbandyti bent "Firefox 3.5" ir "Safari 4", nes jie naudoja skirtingą kodeką.
Viskas. Kai turėsite šį kodą, turėsite vaizdo įrašą, kuris veikia "Firefox 3.5", "Safari 4", "Opera 10" ir "Chrome 1." Bet kas apie "Internet Explorer"?
Internet Explorer nepatinka HTML 5 arba
Kitame skyriuje kalbėsime apie tai, ką galite padaryti, norėdami gauti "IE 8" puikiai, naudodami HTML 5 vaizdo įrašų žymas ir rodyti vaizdo įrašą. Jūs turite naudoti "Flash".Geros naujienos yra tai, kad "IE 9" palaiko "HTML 5" ir vaizdo įrašo žymą.
08 iš 10Įtraukite "JavaScript" ir "Flash" grotuvą, kad "Internet Explorer" veiktų
Galbūt pastebėjote, kad ankstesnio puslapio HTML nėra FLV failo šaltinio eilutės. Ir jei jūs išbandėte šį puslapį "Internet Explorer", tai neveikia. Taip yra todėl, kad "Internet Explorer" neatpažįsta "HTML 5" ir negali išgirsti nei OGG, nei MP4 vaizdo įrašų. Norint, kad "Internet Explorer 7" ir "8" veiktų, reikia, kad vaizdo įrašas būtų rodomas kaip "Flash". Tačiau yra daugiau žingsnių, kad jį į darbą, o ne tiesiog pridėti FLV failą.
1 žingsnis: gaukite savo svetainės flash vaizdo grotuvą
Rekomenduojame gauti "FlowPlayer", nes tai yra atviro kodo "Flash" vaizdo įrašų grotuvas, kurį galite įdiegti į savo žiniatinklio serverį ir naudoti, kai norite žaisti "Flash" vaizdo įrašą. Nemokama "FlowPlayer" versija įterpia reklamą į jūsų vaizdo įrašus, bet jūs taip pat galite įsigyti komercines licencijas, jei jų reikia.
Norėdami įdiegti "FlowPlayer" savo svetainėje, sekite FlowPlayer svetainės instrukcijas. Trumpai tariant, jūsų svetainėje bus įdiegti 2 SWF failai ir "JavaScript" failas. HTML apačioje (prieš žyma) pridėsite eilutę:
Tačiau "Internet Explorer" vis tiek vaizdo įrašą nebus paleisti, reikia mokyti jį atpažinti HTML 5 žymes.
2 žingsnis: įtikinkite "Internet Explorer" skaityti HTML 5 žymes
"Google Code" yra patogus "HTML Shiv" scenarijus, kuris padės IE atpažinti HTML 5 elementus. Taigi
savo HTML dokumento, į kurį norite nukreipti. Tai geriausia įtraukti į IE sąlygines pastabas, kad nebūtų painiojamos kitos naršyklės:
Gerai, dabar IE pripažins
