Flash-ről html5-re

2011 novemberében az Adobe bejelentette, hogy abbahagyja a Flash Player mobilkészülékekre való fejlesztését az Android készülékekre szánt Flash Player 11.1 és a BlackBerry Playbook megjelenése után, és inkább azokra a eszközökre koncentrál, amelyek HTML5 alkalmazások készítését biztosítják a mobil eszközökhöz. Annak ellenére, hogy az Adobe megismételte, hogy támogatja a Flash Player alkalmazást a személyi számítógép böngészők számára, sokan úgy vélik, hogy csak idő kérdése, mielőtt az Adobe megszünteti a PC-s verzió támogatását. Ez rossz hír azoknak a cégeknek, amelyek erősen befektetnek a Flash alkalmazásokba, valamint azoknak a fejlesztőknek, amelyek időt fektettek a Flash alkalmazások készítéséhez szükséges programozási ismeretek megszerzésére.

Nézzük meg a Flash és a HTML5 közötti különbségeket, és adjunk néhány tippet és eszközt a két platform közötti átmenet megkönnyítéséhez.

A Flash Platform alapjai

A Flash gyakran esernyő kifejezésként egy olyan saját Adobe platformra utal, amely valójában a következő komponensekből áll:

• Flash: eszköz, amelyet elsősorban animációk tervezésére és létrehozására használnak
• Flex: Az alkalmazások készítéséhez használt fejlesztői környezet, beleértve egy szoftverfejlesztő készletet (SDK)
• MXML: A Flash projektekben használt jelölőnyelv
• ActionScript: Szkriptnyelv

A Flash-alkalmazás webböngészőben történő futtatásához a Flash Player beépülő modult kell letölteni. Alternatív megoldásként egy Flash alkalmazás összeállítható, hogy futtassa az Adobe AIR asztali futási környezetében. Az AIR alkalmazás futtatásához ismét telepíteni kell az Adobe AIR-t a felhasználó számítógépére.

A Flash a következő fő fájlformátumokat használja:

• .fla: Flash projekt fájl
• .flv: Flash video fájl
• .swf: Összeállított Flash / Flex alkalmazásfájl, amely .flv fájlokat tartalmazhat

A HTML5 platform alapjai

A HTML5 egy nyílt szabványos platform, amely a következőkből áll:

• HTML5: A weblapok létrehozásához használt jelölőnyelv
• Cascading Style Sheets 3 (CSS3): A stíluslap nyelve az HTML5 weblapon lévő objektumok formázásának meghatározásához
• Alkalmazásprogramozási felületek (API): API-k olyan funkciók támogatására, mint például a drag-and-drop és a dokumentumok közötti üzenetküldés
• JavaScript: Az HTML5 használatával az animáció engedélyezéséhez használt szkriptnyelv

A HTML5 egyik előnye, hogy natív módon böngészőben fut és nem igényel plug-inet. A megfelelő futtatáshoz azonban a böngészőnek támogatnia kell a HTML5 és CSS3 szolgáltatásokat egy HTML5 weblaphoz. A nagy böngészők különböző szintű támogatást nyújtanak a HTML5 és a CSS3 számára, és a végrehajtás még nem fejeződik be. A JavaScriptet szinte egyetemesen támogatják a böngészők; a felhasználóknak azonban lehetősége van "kikapcsolni" a JavaScriptet, amely esetben a JavaScript-sel létrehozott ügyféloldali szkriptek nem futnak.

A HTML5 fájlformátumok a következőket tartalmazzák:

• .htm / .html: HTML5 weboldal fájl
• .css: CSS3 stíluslap-fájl

2011-től a jelenlegi HTML5 specifikáció nem határozza meg a támogatott videofájl formátumokat, így az egyes böngészőknek kell megválasztaniuk, mely formátumokat támogatják. A jelenleg támogatott formátumok a következőket tartalmazzák:

• .mp4: MPEG 4 videofájl H.264 video codec-vel és AAC audio codec-kel
• .webm: WebM videofájl VP8 video codec-kel és Vorbis audio codec-kel
• .ogg: Ogg videofájl Theora video codec és Vorbis audio codec használatával

Flash projektek konvertálása HTML5 formátumra

A komplex Flash projekt kézi konvertálása HTML5 formátumba munkaerő-igényes és időigényes folyamat, a platformkülönbségek miatt. A fejlesztőnek konvertálnia kell a Flash és ActionScript segítségével létrehozott animációkat HTML5 és JavaScript formátumokra. Szerencsére van néhány eszköz, amelyek segítenek automatizálni a konvertálást a Flash-ről HTML5-re.

Az Adobe kiadta a Wallaby-t, egy kísérleti eszközt, amely ingyenesen letölthető az Adobe Labs webhelyéről. A Wallaby Flash projekt fájlt (.fla) vesz bemenetként, és exportálja a HTML5-et, valamint a CSS és a JavaScript fájlokat. A Wallaby kiadási megjegyzései viszont meglehetősen hosszú listát tartalmaznak a nem átalakított szolgáltatásokról - ezek közül a legfontosabbak az ActionScript, a filmek és a hang. A Wallaby egy korlátozott eszköz, amelyet elsősorban az animált grafikus tartalom HTML5-re konvertálására terveztek, és így weboldal-tervező eszköz segítségével integrálható a weboldalakba.

A Google Labs kiadta a Swiffy-t, egy ingyenes webes eszközt, amely konvertált Flash alkalmazásfájlt (.swf) konvertál HTML5-re. A kimenetet ezután beágyazhatja egy weboldalba, de a fejlesztők számára ezt nem könnyű szerkeszteni. Mint a Wallaby, a Swiffy sem konvertálja az összes Flash funkciót. A Swiffy támogatja az ActionScript konvertálást, de csak a 2.0-s verziót (az ActionScript jelenleg a 3.0-s verzióval rendelkezik). A Swiffy kimenet csak olyan böngészőkön fut, amelyek támogatják a Scalable Vector Graphics (SVG) alkalmazást.

Edge, egy új fejlesztési eszköz a HTML5-hez

Amint a HTML5 a választott platformmá válik, új eszközök jelennek meg, amelyek olyan tervezési és fejlesztési környezeteket biztosítanak, amelyek integrálják a HTML5, CSS3 és a JavaScriptet.

2011 augusztusában az Adobe kiadta az Edge fejlesztő eszköz előnézeti verzióját. Az Edge lehetővé teszi a tervező számára, hogy HTML5 animációkat hozzon létre, és animációkat adjon a meglévő HTML5 projektekhez. A Flash tervezők felismerik az Edge felhasználói felület néhány ismert elemét, beleértve a színpadi, a tulajdonságok ablakot és az animációs idővonalat. Az Edge azonban CSS és JavaScript fájlokat generál, animációs tartalmát a JavaScript Object Notation (JSON) adatstruktúrában tárolja.

Az írás idején Edge a negyedik előzetes kiadását vette előre. Az új kiadások új funkciókkal bővülnek.

A YouTube konvertálása HTML5-re

A HTML5-hez való átállás egyik jele, hogy a YouTube most lehetőséget kínál HTML5 videolejátszó használatára a videók megtekintéséhez.

A HTML5 opció felajánlása előtt az összes YouTube-videót Flash-lejátszón keresztül szállították. A felhasználók szinte bármilyen formátumban feltölthetnek videofájlokat, a YouTube ezután konvertál minden videót a kívánt Flash (.flv) formátumba.

A YouTube most a videókat kódolja a H.264 video codec-el és a WebM formátumban is a HTML5 kézbesítéséhez. A videók HTML5 formátumban történő megtekintéséhez rendelkeznie kell egy böngészővel, amely támogatja a HTML5 videocímkét, valamint a YouTube által használt videoformátumot.

A vaku öröksége

Mint korábban megjegyeztük, az Adobe tovább folytatja a Flash Player PC-s verziójának fejlesztését - egyelőre. Még ha az Adobe abbahagyja a Flash Player támogatását a jövőben, a régebbi Flash alkalmazásokat továbbra is támogatják az interneten - valószínűleg évekig. Tehát a Flash nem hamarosan teljesen eltűnik. Rendelkezésre állnak eszközök a Flash-alkalmazások HTML5-alkalmazásokká konvertálására, ám jelenleg ezek az eszközök nem támogatják az összes Flash-szolgáltatás konvertálását. Amint a HTML5 szabvány uralkodóvé válik, valószínű, hogy a Flash fájlkonverziós eszközök kifinomultabbá válnak, és új eszközöket hoznak létre a tartalom HTML5 platformon történő fejlesztésére.