HTML5:n multimediatoiminnallisuus

Abstract

Opinnäytetyön tarkoituksena oli testata HTML5:n multimediaelementtien toimintaa neljällä työpöytäselaimella. Tarkoitusta varten tehtiin yksinkertaiset testisivut, jolle eri kolme eri elementtiä sijoitettiin. Elementit olivat video, audio ja canvas. Testisivun avulla testattiin elementtien perustoiminnallisuutta, sekä laajempaa toiminnallisuutta itse tehtyjen kontrollien avulla. Sivut toteutettiin HTML5:llä ja lisätoiminnallisuus tehtiin JavaScriptillä.

Tietoperusta käsitteli Internetin ja HTML:n historiaa, erilaisia HTML:n avuksi tarkoi-tettuja laajennuksia, HTML5:ttä, Flashia sekä Flashin ja HTML5:n välisiä eroja. Erityistä huomiota kiinnitettiin video-, audio- ja canvas-elementtien ominaisuuksiin ja Flashin osalta pääpaino oli samoin video- ja audio-ominaisuuksilla.

Testauksessa testattiin kaikkien selaimien osalta samat asiat, että saatiin vertailukelpoinen lopputulos. Testauksessa käytettiin selaimina Internet Explorer 11:tä, Chromea, Firefoxia ja Operaa. Pääpiirteissään elementit toimivat kaikissa neljässä selaimessa sa-malla tavalla, joskin pieniä eroavaisuuksia löytyi, eritoten ulkoasun suhteen.

Yhteenvetona voitiin todeta, että HTML5:n multimediaelementit toimivat kaikissa tes-tatuissa selaimissa riittävän hyvin niiden kaupallista käyttöä varten. Kunhan suunnitte-lussa muistetaan ottaa huomioon erot elementtien ulkoasun kohdalla.

This thesis was meant to test the functionality of HTML5 multimedia elements on four desktop browsers. For testing purposes simple testing pages were created. On those pages three different HTML5 elements were placed. The elements were video, audio, and canvas. The test pages were used to test basic functionality of the elements and their wider functionality by creating controls for them. The pages were put together with HTML5 and the added functionality was implemented with JavaScript.

The theoretical part of the thesis deals with the history of the Internet and HTML, extensions for HTML, HTML5, Flash, and the differences between HTML5 and Flash. Careful consideration is given to the features of multimedia elements of HTML5, such as video, audio, and canvas. When examining Flash the main point of interest is likewise its video and audio features.

In testing, the same features were tested in all four browsers to make sure to have con-sistent data to base conclusions on. The testing was performed with Internet Explorer 11, Chrome, Firefox, and Opera. The elements performed mainly alike in all four browsers, but there were minor differences, especially regarding layout.

In conclusion it could be said that the multimedia elements of HTML5 work in all tested browser well enough for commercial use. However, differences in appearance of the elements between different browsers need to be taken into consideration when designing web pages.