Sain inspiraation opinnäytetyöhöni ohjaajani Teppo Räisäsen ehdotuksesta miettiessämme mahdollisia opinnäytetyön aiheita. HTML5 vaikutti hyvin mielenkiintoiselta aiheelta, ja opinnäytetyön aihe kelpasi myös harjoittelupaikkani BelleGamesin toimitusjohtajalle Pirjo Ritokangas-Huttuselle. Olimme sopineet harjoittelun aikana mahdollisuudesta tehdä opinnäytetyö yritykseen. Aluksi aiheen tarkastelunäkökulmana oli HTML5:den soveltuvuus pelien ohjelmointiin, mutta aihe tarkentui HTML5:teen ja sen toimivuuteen selaimissa.

Työn tavoite oli saada selville kuinka hyvin nykyiset selaimet tukevat HTML5:den uusia ominaisuuksia, ja verrata selainten tukea keskenään. Internetissä on tarkat tukimäärittelyt, mutta itse ainakin olen kokenut ne hyvin epäselviksi. Määrittelyt muistuttavat enemmän tilastotiedettä kuin helposti ymmärrettävää ohjeistusta, joten katsoin parhaaksi testata HTML5-demoja suoraan selaimilla. Näin saatiin konkreettisesti selville, kuinka hyvin tai kuinka huonosti selaimet pärjäävät.

Tietoperustaksi otin HTML:n historian vuodesta 1989 aina nykyhetkeen saakka, sillä en katsonut tarpeelliseksi perehtyä koko internetin historiaan. HTML:n historia alkaa kuitenkin vasta Tim Berners-Leen CERNin ajoista, joten katsoin tarpeelliseksi aloittaa historian tutkimisen vasta siitä ajanjaksosta. HTML5:den osalta tietoperustaksi otin sen historian, toimintaperiaatteet ja uudet ominaisuudet.

Tutkimuskohteena opinnäytetyössäni oli HTML5-demojen toimivuus selaimissa. Valitsin ensin kolmekymmentä HTML5-demoa tai -sivua, ja sitten arvoin tästä otannasta viisi. Jokaista demoa testattiin viidellä eri selaimella ja tulokset kirjattiin taulukkoon vertailua varten. Selaimet olivat Google Chrome, Mozilla Firefox, Apple Safari, Opera ja Windows Internet Explorer.

Tutkimuksen tuloksena Google Chrome ja Mozilla Firefox olivat parhaat selaimet suoriutuessa jokaisesta testauksesta täydellisesti. Huonoiten sijoittuivat Windows Internet Explorer ja yllättäen Opera. Ne suoriutuivat vain kolmesta testauksesta täydellisesti, epäonnistuivat täysin yhdessä ja yhden suorittivat osittain onnistuneesti. Apple Safari sijoittui näiden väliin suoriutumalla neljästä testauksesta täydellisesti ja yhdestä epäonnistuneesti. Testauksessa havaittiin myös pieniä eroja selainten esitystavoissa mutta ne eivät ole merkitseviä relevantteja tässä tutkimuksessa.

Opinnäytetyöni tuloksia voidaan hyödyntää ainakin verkkosivujen ja –sovellusten suunnittelussa, sillä heti työskentelyn alkuvaiheessa on hyvä tietää selain jolle sovellus tehdään. Vaihtoehtoisesti voidaan lähteä heti rakentamaan kaikissa selaimissa toimivaa sovellusta, mutta tässä tapauksessa vastaan voi tulla selaimien HTML5-tuen puute.

I got an inspiration for my thesis when me and my supervisor Teppo Räisänen talked about possible thesis subjects. HTML5 seemed very interesting subject and my commissioner - Pirjo Ritokangas-Huttunen, CEO of BelleGames - approved it as well. I had completed my training for BelleGames so we agreed that I will do my thesis to them as well. At first the point of view of the thesis was how suitable HTML5 is for game programming but subject was specified to HTML5 and its functionality in browsers.

The goal of this thesis was to find out how well the current browsers support HTML5 and its new features. In addition I compared how the browsers matched against each other. I decided not to use the exact definitions of browser support as I found them too complicated for casual user. HTML5 specifications seemed like science documents to me. So I decided that the best method to test the browsers support was just run the HTML5-demos on each browser. This way I could directly see which browsers are supporting HTML5 and which are not.

For theoretical basis I chose history of HTML from 1989 to the present day because I don't consider it necessary to study the entire history of the Internet. HTML's history goes back to Tim Berners-Lee at CERN so I began my review of history from there. For theoretical basis I also added history of HTML5, its base functionality and the new features.

The target of research was to find out if HTML5 demos worked on selected browsers. At first I chose thirty HTML5 demos and then I randomly took five of them. Each of them was tested on five different browsers and the results were recorded in a table. Selected browsers were Google Chrome, Mozilla Firefox, Apple Safari, Opera and Windows Internet Explorer.

As a result of research Google Chrome and Mozilla Firefox were the best browsers because they manage perfectly of every test. The worst browsers were Windows Internet Explorer and surprisingly Opera as well. They managed to work perfectly only with three of the five tests, failed completely in one and in one test they worked almost successfully. Apple Safari was ranked in the middle as it worked well with four of the tests but failed in one.

The results of my thesis can be used when designing HTML5 web pages and applications because it's good to know which browsers will run your application. You can also start building application which will support all the browser but then you have to think again which features you can use from HTML5.