haku: @keyword HTML5 / yhteensä: 49
viite: 2 / 49
Tekijä:Hilvenius, Jarno
Työn nimi:Adaptiiviset kuvat responsiivisessa web-suunnittelussa
Adaptive Images in Responsive Web Design
Julkaisutyyppi:Diplomityö
Julkaisuvuosi:2016
Sivut:70 s. + liitt. 12      Kieli:   fin
Koulu/Laitos/Osasto:Perustieteiden korkeakoulu
Oppiaine:Mediatekniikka   (T-111)
Valvoja:Vuorimaa, Petri
Ohjaaja:Arpinen, Tero
Elektroninen julkaisu: http://urn.fi/URN:NBN:fi:aalto-201606172593
Sijainti:P1 Ark Aalto  4113   | Arkisto
Avainsanat:responsive web design
responsiveness
adaptive image
web page download size
picture element
responsiivinen web-suunnittelu
responsiivisuus
adaptiivinen kuva
verkkosivun latauskoko
HTML5
picture-elementti
Tiivistelmä (fin):Tämän diplomityön tarkoituksena on selvittää adaptiivisen kuvan hyödyntämistä responsiivisessa web-kehityksessä nykyisten standardien ja toteutusten pohjalta.
Työssä esitellään mukautuvien kuvien teknisiä ratkaisuja ja käydään läpi W3C:n uusin määritys mukautuvien kuvien merkinnästä.
Tutkimuksellisessa osassa työtä tehtiin data-analyysi verkkosivujen latauskoosta päätelaitteen ja selaimen responsiivisten ominaisuuksien suhteen ja haastattelupohjainen tapaustutkimus responsiivisen palvelusivuston toteuttamisesta.

Responsiiviset verkkosivut ovat tulleet laajasti käyttöön viime vuosina ja useat testaamisessa käytetyt sivustot mukautuivat sisällöltään selaimen näkymään.
Käyttäjälle vähemmän suoraan näkyvissä teknisissä ratkaisuissa on kuitenkin laaja kirjo ja usein pienimmillekin laitteille ladataan suurimpia mahdollisia kuvia tai jopa päällekkäisiä versioita.

Tapaustutkimuksessa havaitaan, että responsiivisen palvelusivuston toteuttamisessa sisällönhallinnan menetelmät ja ratkaisut nousevat teknistä kyvykkyyttä suurempaan rooliin.
Varsinkin adaptiivisten kuvien moninaisten mahdollisuuksien hyödyntämisessä tarvitaan harkittuja toimintatapoja ja pidemmän aikavälin sisältöstrategioita, jotta uudenlainen sisältö saadaan käyttäjille asti.
Verkkopalvelun kehittämisessä sisällön mukautuminen moninkertaistaa testattavien kokonaisuuksien määrän ja lopullinen varmistaminen vaatii oikeilla fyysisillä päätelaitteilla kokeilemista.
Tiivistelmä (eng):This master's thesis aims to examine the usage of adaptive images within responsive web design regarding the current standards and implementations.
The thesis introduces the technical solutions implementing adaptive images and presents the latest definition of W3C adaptive image mark up.
In the research part of the thesis, a data analysis was conducted in order to discover the relation between the responsive characteristics of the browsing device and the download size of a web page in addition to an interview based case study of implementing a responsive service web site.

Responsive web sites have been taken more and more into use within the last years and most of the pages tested adapted their content to the browser viewport.
For the user less directly visible technical solutions had, however, more variety and often the largest images are downloaded to the smallest devices or even overlapping versions.

In the case study, it is discovered that in implementation of a responsive service web site the methods and solutions of the content management are playing more important role than the technical capabilities.
Especially utilising the various possibilities of adaptive images it is required to have considered methods and forward-looking content strategies in order to provide the new type of content for the users.
In the web service development, the adaptivity of the content multiplies the testable entities and the final verification requires using the real physical devices.
ED:2016-07-17
INSSI tietueen numero: 54023
+ lisää koriin
INSSI