HTML5 vs Flash: Lucruri pe care ar trebui să le știți. HTML5 vs Flash: Lucruri pe care ar trebui să le știți O scurtă introducere: HTML5 VS FLASH

HTML 5 este o tehnologie puternică cu arhitectură centrată pe web, care vă ajută să rulați orice cod HTML5 pe orice dispozitiv compatibil cu HTML 5. Nu este nevoie să dezvoltați software/aplicație separată pentru fiecare dispozitiv diferit, cum ar fi telefoane mobile, browsere etc.

HTML 5 este ușor de învățat și de codat, ceea ce ajută dezvoltatorul să scrie cod optimist în mai puțin timp. Consumul de resurse HTML 5 este mult mai mic decât animațiile flash obișnuite, ceea ce face ca dispozitivul mobil html5 să fie compatibil. Pe măsură ce HTML 5 consumă mai puține resurse, acesta ajută dispozitivul mobil să-și economisească bateriile. Flash consumă o mulțime de baterie de dispozitiv mobil decât HTML5.

Știm că HTML 5 include o varietate de etichete avansate, care vor ajuta robotul/robotul motorului de căutare să acceseze cu crawlere conținutul și să-l sorteze în funcție de proprietățile etichetei. SERP.

Deși aceste 2 tehnologii se luptă, le poți folosi pe ambele, în funcție de obiectivele tale. Dacă doriți să construiți o singură dată cu funcționalitate medie spre bună care funcționează în fiecare ecosistem, atunci HTML5 este o opțiune excelentă. Pentru mai multe cerințe de avans, mergeți cu blițul. Vă împărtășesc o listă de instrumente online care vă ajută să vă convertiți Flash în format HTML 5.

Deși aceste instrumente au limitări, totuși vă vor ajuta pentru conversia la scară mică.

Swiffy convertește fișierele Flash SWF în HTML5, permițându-vă să reutilizați conținutul Flash pe dispozitive fără un player Flash (cum ar fi iPhone-urile și iPad-urile). Are o limitare a dimensiunii fișierului, puteți converti doar până la 1 MB swf în html5

Acesta este un alt serviciu care include și procesarea scriptului de acțiune împreună cu swf. Suportă până la 2 MB dimensiune fișier swf pentru conversie. Are o interfață de utilizare bogată, împreună cu facilitate de glisare și plasare

Bună, dragi prieteni. Bannerele în format HTML5 câștigă din ce în ce mai multă popularitate. În timp ce Flesh se estompează în fundal.

În Google Chrome, de la 1 septembrie a acestui an, setarea implicită este întreruperea afișării conținutului flash. Utilizatorul decide dacă va vedea sau nu un astfel de conținut.

De asemenea, AdWords în prezent acceptă doar Adobe Flash Player versiunile 4–10.1. Alte versiuni nu se vor încărca.

Și apoi sunt problemele de afișare a conținutului Flash pe dispozitivele mobile.

Și se dovedește că este nevoie de a converti bannere flash în html5. De exemplu, rețelele de publicitate AdWords și DoubleClick convertesc bannerele SWF (Flash) în HTML5. Direct, de altfel, nici nu rămâne în urmă.

Desigur, nu toate bannerele animate Flash pot fi convertite. Animația complexă nu poate fi convertită încă.

Prin urmare, este mai bine, desigur, să creați imediat bannere frumoase în format html5.

Dar, dacă tot trebuie să refaceți bannerul flash, atunci vă voi spune cum să o faceți.

Google a dezvoltat special un serviciu - Swiffy, care vă va ajuta să determinați dacă bannerul dvs. poate fi convertit și, dacă da, descărcați bannerul html5 finalizat.

Puteți utiliza acest serviciu fie direct pe Internet, fie ca extensie pentru Flash Professional.

Utilizarea serviciului este destul de simplă. Totul se face literalmente în trei pași.

Ca alternativă, există mai multe produse software care vă permit să rezolvați această problemă. Dar, toate sunt plătite și este puțin probabil să justifice investiția. Și de ce să le ai dacă există un serviciu swiffy gratuit.

În primul rând, accesați pagina de servicii și faceți clic pe link « ÎNCĂRCAREACUM".

Dacă bannerul dvs. nu conține o animație complexă, atunci veți vedea o previzualizare a bannerului final în format HTML5. Durata de viață a unei astfel de previzualizări este de 15 minute. După care linkul nu mai funcționează.

Pentru a vizualiza rezultatul într-o fereastră separată, puteți face clic pe butonul « VEDERECONVERSIE".

Pentru a face acest lucru, faceți clic pe butonul din dreapta al mouse-ului « VEDERECONVERSIE" iar în meniul contextual selectați elementul „Salvează obiectul ca...” sau „Salvează linkul ca...”, depinde de browser.

Asta e tot, bannerul a fost convertit din flash în html5 și poate fi folosit pe orice site.

Notă: aspectul bannerului html5 pe site

— încărcați fișierul pe găzduire;

- lipiți codul cadrului

— În foaia de stil, inserați stiluri de aliniere pentru blocul DIV și setările de cadru.

#html5 (text-align: center;) #banner728x90 (lățime: 728px; înălțime: 90px; chenar: niciunul;)

Și acum vă sugerez să vizionați un tutorial video pentru a consolida materialul, unde veți vedea procesul de conversie și plasare a unui banner html5 pe site.

Asta e tot pentru azi. Ne vedem în noile tutoriale video și articole. Vă doresc succes, prieteni.

Salutări, Maxim Zaitsev.

• Adobe Flash,
• Pânză

Mulți dintre cei implicați în dezvoltarea bannerelor se confruntă cu faptul că în planul media sunt necesare unele materiale în format Adobe Flash, iar unele, din cauza noilor cerințe de browser, sunt acceptate doar în format html5. Desigur, acum există convertorul Swiffy preferat al tuturor, dar, din păcate, nu toate site-urile acceptă rezultatul acestuia din cauza greutății excesive a bibliotecilor externe sau a interzicerii încărcării lor din exterior, ceea ce mail.ru găsește de fapt defectul atunci când postează. Și apoi trebuie să colectați două bannere principale pe platforme diferite pentru a trece această restricție prin TT.

Adobe Flash CC/Animate CC are o metodă prin care un banner finit poate fi convertit rapid la html5 de care avem nevoie cu puțin plus. Mai mult, este mai bine să utilizați CC, deoarece greutatea bibliotecilor suplimentare din acesta este cu 20 kb mai mică decât în ​​pachetul Animate CC.

Mai jos sunt instrucțiuni specifice pentru cei care sunt mai implicați în animație decât în ​​programare.

1. Luați sursa noastră flash în format .fla, redenumiți-o în index.fla și deschideți-o în Adobe Flash CC/Animate CC. În meniul de comandă, îl convertim în format HTML5 Canvas.

2. Din biblioteca de materiale, eliminați imaginile și obiectele care nu sunt folosite în animație. Acest lucru trebuie făcut, altfel vor fi exportate, ceea ce va adăuga greutate bannerului.

3. Convertiți fonturile non-standard în curbe. Textul mic, cum ar fi o declinare a răspunderii, poate fi lăsat neatins, dar după compilare ne asigurăm că verificăm dacă totul este în ordine.

4. Un banner pe HTML5 Canvas nu acceptă codul AS2/AS3, așa că animația din banner trebuie asamblată liniar fără cod. După conversie, tot codul va fi eliminat.

5. Accesați Opțiuni de publicare și debifați caseta de selectare Biblioteci permise:

P.S. Pentru site-urile Rambler, puteți lăsa caseta de selectare Biblioteci găzduite, aceasta va oferi o greutate suplimentară de 40 kb.
TT-ul lor permite încărcarea bibliotecilor suplimentare.

6. Publicați proiectul și obțineți următoarea structură de fișiere:

7. Toate fișierele din subdirectoare trebuie mutate în folderul rădăcină, unde se află index.html rezultat. Dosarele goale sunt șterse. Ieșirea va fi următoarea:

8.1. – deschideți index.js și în secțiune // proprietățile biblioteciiîn tabloul y manifesta corectăm căile către bibliotecile js. Eliminați imagini/.

Ar trebui să arate așa:

Lib.properties = ( lățime: 240, înălțime: 400, fps: 24, culoare: "#FFFFFF", manifest: [ (src:"el1.png", id:"el1"), (src:"el2.png ", id:"el2"), (src:"fon2.jpg", id:"fon2"), (src:"/logo.png", id:"logo") ] );
8.2. – deschideți index.html și eliminați libs/ din căile bibliotecii din partea de sus:

P.S. Pentru TT Rambler, sărim peste punctul 8.2.

9. Adăugați următoarele rânduri la antetul fișierului index.html:

La sfârșit, ajustăm eticheta corporală și înfășurăm pânza cu un buton de la TT:

11. Împachetăm toate fișierele, cu excepția index.fla, într-o arhivă și verificăm greutatea pentru conformitate cu TT.

Dacă există un avantaj, atunci imaginile PNG pot fi comprimate folosind serviciul

Mulți dintre cei implicați în dezvoltarea bannerelor se confruntă cu faptul că în planul media sunt necesare unele materiale în format Adobe Flash, iar unele, din cauza noilor cerințe de browser, sunt acceptate doar în format html5. Desigur, acum există convertorul Swiffy preferat al tuturor, dar, din păcate, nu toate site-urile acceptă rezultatul acestuia din cauza greutății excesive a bibliotecilor externe sau a interzicerii încărcării lor din exterior, ceea ce mail.ru găsește de fapt defectul atunci când postează. Și apoi trebuie să colectați două bannere principale pe platforme diferite pentru a trece această restricție prin TT.

Adobe Flash CC/Animate CC are o metodă prin care un banner finit poate fi convertit rapid la html5 de care avem nevoie cu puțin plus. Mai mult, este mai bine să utilizați CC, deoarece greutatea bibliotecilor suplimentare din acesta este cu 20 kb mai mică decât în ​​pachetul Animate CC.

Mai jos sunt instrucțiuni specifice pentru cei care sunt mai implicați în animație decât în ​​programare.

1. Luați sursa noastră flash în format .fla, redenumiți-o în index.fla și deschideți-o în Adobe Flash CC/Animate CC. În meniul de comandă, îl convertim în format HTML5 Canvas.

2. Din biblioteca de materiale, eliminați imaginile și obiectele care nu sunt folosite în animație. Acest lucru trebuie făcut, altfel vor fi exportate, ceea ce va adăuga greutate bannerului.

3. Convertiți fonturile non-standard în curbe. Textul mic, cum ar fi o declinare a răspunderii, poate fi lăsat neatins, dar după compilare ne asigurăm că verificăm dacă totul este în ordine.

4. Un banner pe HTML5 Canvas nu acceptă codul AS2/AS3, așa că animația din banner trebuie asamblată liniar fără cod. După conversie, tot codul va fi eliminat.

5. Accesați Opțiuni de publicare și debifați caseta de selectare Biblioteci permise:

P.S. Pentru site-urile Rambler, puteți lăsa caseta de selectare Biblioteci găzduite, aceasta va oferi o greutate suplimentară de 40 kb.
TT-ul lor permite încărcarea bibliotecilor suplimentare.

6. Publicați proiectul și obțineți următoarea structură de fișiere:

7. Toate fișierele din subdirectoare trebuie mutate în folderul rădăcină, unde se află index.html rezultat. Dosarele goale sunt șterse. Ieșirea va fi următoarea:

8.1. – deschideți index.js și în secțiune // proprietățile biblioteciiîn tabloul y manifesta corectăm căile către bibliotecile js. Eliminați imagini/.

Ar trebui să arate așa:

Lib.properties = ( lățime: 240, înălțime: 400, fps: 24, culoare: "#FFFFFF", manifest: [ (src:"el1.png", id:"el1"), (src:"el2.png ", id:"el2"), (src:"fon2.jpg", id:"fon2"), (src:"/logo.png", id:"logo") ] );
8.2. – deschideți index.html și eliminați libs/ din căile bibliotecii din partea de sus:

P.S. Pentru TT Rambler, sărim peste punctul 8.2.

9. Adăugați următoarele rânduri la antetul fișierului index.html:

La sfârșit, ajustăm eticheta corporală și înfășurăm pânza cu un buton de la TT:

11. Împachetăm toate fișierele, cu excepția index.fla, într-o arhivă și verificăm greutatea pentru conformitate cu TT.

Dacă există un avantaj, atunci imaginile PNG pot fi comprimate folosind serviciul

După cum probabil știți deja, cel mai popular browser din lume, Google Chrome, a încetat parțial să accepte animația flash. Acum animația scrisă în banner de către dezvoltator nu pornește automat, ci așteaptă ca utilizatorul să dea clic. De aici rezultă că având un banner publicitar în format SWF, acum aveți mai puține șanse ca bannerul să calculeze banii și timpul petrecut pentru crearea lui. Dar nu totul este atât de rău pe cât ar părea la prima vedere. Google însuși a avut deja grijă de noi, deoarece serviciul său Google Lab este în prezent în curs de dezvoltare și testare serviciu online conversia bannere Flash din formatul SWF în format HTML5 și îl puteți folosi complet liber.

Dar mai întâi, puțină istorie...

Unele proiecte Google au fost începute de o singură persoană și abia apoi au devenit o echipă de dezvoltatori și au devenit parte dintr-o mare familie. S-a întâmplat și de data asta. În vara anului 2010, Peter Senster s-a alăturat echipei de cercetare în publicitate mobilă, care lucra la problema afișării animației Flash pe dispozitive care nu acceptă Adobe Flash Player, ca stagiar de inginerie.

Drept urmare, Peter a reușit să obțină rezultate atât de uimitoare încât conducerea Google l-a angajat cu normă întreagă, iar ceea ce este și mai tare a fost că o echipă de dezvoltatori a fost organizată pentru nevoile proiectului.

Având în vedere faptul că tehnologia este încă în curs de dezvoltare, nu ar trebui să contați pe rezultate 100%, ci pe cele mai simple bannere cu animație online convertor clicuri ca semințele))

Puteți încerca serviciul pentru conversia SWF în HTML5 făcând clic pe linkul de mai jos

Swiffy folosește reprezentarea compactă a datelor JSON folosind SVG, HTM5 și CSS3. Există și Action Script 2.0 în obiectele JSON? care este ulterior interpretat de JS în browser. Această abordare face ca animația Swiffy rezultată să fie la fel de compactă ca fișierul SWF original.

Swiffy este un exemplu grozav al cât de departe a ajuns platforma web.

Animația Swiffy profită din plin de toate evoluțiile din tehnologiile web, cum ar fi viteza crescută de execuție a scripturilor și accelerarea hardware a graficii 2D în browserele moderne.

Încă o dată: dacă aveți un banner Flash în format SWF, atunci cel mai probabil îl veți putea converti în HTML5 și îl veți plasa pe site-ul dvs. web sau în popularul sistem de plasare a bannerelor AdRiver.

Asta e tot. Noroc!