Med nära ett decennium av erfarenhet av webbdesign har jag stött på många misstänkta övertygelser om de senaste designverktygen och teknikerna. men inget misslyckas med missuppfattningarna kring användningen av HTML 5.

Som utvecklare har vi vår egen uppsättning missgynnade övertygelser om en viss teknik, men när vi börjar använda den teknologin kan vi förstå vad det handlar om, dess användning och omfattning.

Inspirerat av vissa HTML5 krav som jag har stött på under tiden, ville jag lägga till mina två cent för att rensa luften på vissa aspekter av HTML5. De flesta missuppfattningarna kring HTML5 beror på att många tycker att det är en ersättning för Flash.

Till att börja med vill jag klargöra att detta inte är en HTML5 vs Flash-post. Sanningen är att man inte kan fungera som ersättare för den andra, så det finns ingen "oss vs dem" strid. Men däremot är missuppfattningen knutpunkt. Problemet är att folk tror HTML5 är ett förbättrat alternativ till Flash. Alla missuppfattningar är ett resultat av detta tänkande.

Teknisk översikt av HTML 5

Den femte stora översynen till språket på World Wide Web kan skrivas både i HTML och XML-syntaxen och har integrerats speciellt med detaljerade bearbetningsmodeller för att underlätta driftskompatibla implementeringar och samtidigt förbättra markeringen för HTML-dokument och webbapplikationer. Dess huvudsyfte är att lösa överplattformsberoende i webbranschen.

Om allt detta låter grekiskt till dig, låt oss bryta ner vad HTML5 gör på ett språk som är lätt att förstå, utan att komma in i komplexa tekniker:

  • HTML5 är ett uppdaterat markup språk som följer XML-standarder.
  • Tanken bakom HTML5 är att säkerställa konsekvens i prestanda och produktion av webbprodukter på alla operativsystem, inklusive iOS, Android, Windows bland många andra.

De vanligaste missuppfattningarna om HTML är designcentriska. Så, låt oss ta en titt på vad som erbjuds av HTML 5 ur designsynpunkt.

  • Inbyggt ljud och video stöd som hjälper till att bädda in media direkt i HTML-dokument har gjort det möjligt att använda externa plugins redundanta.
  • HTML5 stöder SVG och Canvas-element för animeringar.
  • Erbjuder designers ett dukelement som underlättar rendering av 2D-grafik i "direktläge". Detta innebär att grafiska objekt görs direkt på displayen.
  • Har utvecklats för att skapa interaktiva applikationer som är tunga innehåll och inte bara användarvänliga utan också SEO-vänliga.

Varför tror folk att HTML5 är en Flash-ersättare?

Flash är ett program för multimediaförfattande som hjälper till att leverera interaktivt och engagerande webbinnehåll som ger en rik webbupplevelse till användarna. Det är en mycket populär plattform som når 99% av skrivbords- och bärbara webbläsare, och erbjuder samma uppsättning teknisk och visuell prestanda i alla webbläsare. Men det har en signifikant nackdel, vilket är att den inte effektivt stöds av mobila operativsystem som iOS.

För det finns det HTML5.

Kolla nu mycket på detta uttalande. Tagen till sitt nominella värde kan det innebära att HTML5 är ett ersättare för Flash när det gäller att utveckla mycket interaktiva applikationer för iOS-plattformen.

Scenarier, där klienter har bett sina utvecklare att replikera en Flash-applikation i sin helhet med hjälp av HTML5, för en viss mobilenhet eller surfplatta, är ganska vanliga. Problemet är att utvecklingsplattformar och deras funktionalitet inte bör tas till deras nominella värde. Ja, en av de främsta fördelarna med HTML 5 gör det lättare att utveckla applikationer som fungerar på alla mobila operativsystem i stället för att koda en ny applikation för varje mobil OS.

Men det betyder inte att det är en Flash-ersättning.

Populära missuppfattningar kring HTML5

Jag kommer bara ta dig igenom en serie scenarier som illustrerar de missuppfattningar som människor har om HTML 5.

Scenario 1 : Konvertera ett befintligt Flash-baserat designverktyg till HTML 5

Missuppfattningen : HTML 5 kan inte maskera bilder på ett sätt som liknar Flash; dess bildmaskering är varken up-to-mark eller jämn. Viktigare är att Flash är snabbare och när det gäller specifika funktionaliteter som beräkningsområden och diametrar. Flash är ett mycket bättre alternativ. Funktioner som Drag / Skala och Zoom fungerar också bättre i Flash jämfört med HTML 5.

Scenario 2 : Konvertera a Flash-baserat ljudbibliotek till ett HTML5-baserat tablettkompatibelt bibliotek.

Missuppfattningen : HTML5 erbjuder ljud- och bildstöd men med vissa begränsningar. Denna Flash-baserade webbplats hade nästan 800 mp3-filer; gör det till en stor skala applikation. Problemet ligger i det faktum att medan Mozilla stöder .ogg-format och krom / safari stöder .mp3-formatet, så om användarens föredragna webbläsare är IE8, blir Flash Audio Player en nödvändighet. Begränsade tillägg tillgängliga på HTML5 betyder att den enda lösningen är att konvertera alla ljudfiler till två format - mp3 och ogg / wave. Att konvertera 800 filer till två filformat är inte bara en tidskrävande process utan ökar också serverns lagring.

Resultatet är en iPad-app som går långsamt från blocken.

Scenario 3 : Konvertera a Flash-baserad webbplats till en HTML5-baserad webbplats.

Feluppfattningen : Det finns en missuppfattning att HTML5 kan hantera alla slags animationer, även de i stor skala. Men det kan inte, åtminstone inte än. Dess förmåga att erbjuda 3D-effekter och köra flera animationer samtidigt är allvarligt begränsad. Det är systemkonfigurationen som bestämmer prestandan för HTML5-animationerna och hittills har det visat sig vara en minnesare. Det finns en god chans att användningen av HTML5 kommer att påverka webbplatsens prestanda om det är uppmanat att göra mycket när det gäller animering. Antingen kommer webbplatsen att krascha eller dess hastighet kommer att påverkas. Så, i det ovanstående fallet kan HTML 5-webbplatsen kanske inte erbjuda samma prestanda.

Debunking vanliga HTML 5 missuppfattningar

För det första erbjuder HTML 5 en mycket bekväm ljud- och videolösning med några avancerade funktioner. Allt bra och bra, men vad många människor ignorerar är det faktum att dessa ljud- och videofiler spelas i webbläsarna. Varje webbläsare har inbyggda plugins för ljud och video, men olika webbläsare stöder olika versioner av ljud och video. På grund av detta blir det svårt att tillgodose kraven hos alla webbläsare.

För det andra har SVG och Canvas-elementen definitivt gjort det enklare för utvecklare att implementera och integrera 2D-animationer, men det har observerats att denna animering har en skadlig effekt på webbplatsens prestanda. HTML5 visar också att det är svagt när det gäller hantering av 3D-animeringar, vilket resulterar i att utvecklare inte kan replikera en hel Flash-webbplats med liknande effektivitet i HTML5. Det kommer alltid att finnas begränsningar.

För det tredje kan du använda HTML5 Rich Internet Applications men inte vara under missuppfattning att de kan erbjuda dig samma effektivitet och funktionalitet som Flash / Flex kan erbjuda, till exempel kan Flash direkt kommunicera med fjärrtjänster, medan HTML5 inte kan .

Nu när du vet vilken HTML5 inte kan göra, tillåta mig att erbjuda dig en liten lista över saker som HTML5 kan göra och det kan faktiskt göra mycket bra. Detta kan också bidra till att minska missuppfattningarna på ett stort sätt.

  • Du kan skapa en enda applikation som fungerar på iPad, iPhone, Windows etc. Med andra ord underlättar det plattform / enhetens oberoende - en stor fördel i sig.
  • Hjälper till att utveckla en enda webbplats som fungerar på surfplattan, mobilen och skrivbordet samtidigt.
  • Om det används bra och hur det ska användas kan det förbättra webbplatsens prestanda.
  • Gör det möjligt att använda ljud- och videotaggar på alla plattformar, men vara beredda att göra lite hårt arbete.
  • Video, ljud och bilder skrivs alla direkt in i koderna, vilket eliminerar behovet av någon tredje parts programvara.
  • Snabbare laddningstid jämfört med den äldre versionen på grund av WebSockets implementering.
  • Erbjuder bra vektoranimationer för grafik och ljuseffekt, men förvänta dig inte månen, solen och stjärnorna när det gäller animationer. Flash är långt framåt i denna aspekt.
  • Ger lämplig inbyggd formvalidering och typdeklarationer för att erbjuda specifikt tangentbordsstöd.

HTML 5 har definitivt potentialen att uppstarta Flash på flera sätt än en, men det är för närvarande ett pågående arbete. Även i sin nuvarande avatar bidrar det till att göra mobilapplikationer mer tillgängliga, och utvecklare kan nu skapa universella applikationer för olika mobiltelefoner. Dessutom finns det ingen tvekan om att det ger mer flexibilitet i webbplatsens kreativitet. För nu är det tillräckligt. Det som händer i framtiden är ren hypotes.

Ansvarsbegränsning: Alla illustrationer som används i denna artikel är endast förklarande för att förklara relevanta scenarier.

Implementerar du redan vissa HTML5-funktioner som inte är brett stödda? Vilka egenskaper ser du mest fram emot att anta? Låt oss veta i kommentarerna!