Responsiiviset web-käyttöliittymäkirjastot
Kallonen, Antti (2017)
2017
Tietotekniikka
Tieto- ja sähkötekniikan tiedekunta - Faculty of Computing and Electrical Engineering
This publication is copyrighted. You may download, display and print it for Your own personal use. Commercial use is prohibited.
Hyväksymispäivämäärä
2017-11-08
Julkaisun pysyvä osoite on
https://urn.fi/URN:NBN:fi:tty-201710182026
https://urn.fi/URN:NBN:fi:tty-201710182026
Tiivistelmä
Responsiivinen web-käyttöliittymä on käyttäjän päätelaitteen ominaisuuksiin mukautuva käyttöliittymä. Laitekannan muuttuminen pelkistä työpöytäpäätteistä monipuolisemmaksi älypuhelimien yleistyessä suosii tällaisen kirjaston käyttämistä. Työssä vertaillaan kolmea eri web käyttöliittymäkirjastoa, jotka ovat: Bootstrap, Semantic-UI ja Milligram.
Web-selaimet noudattavat tiettyjä standardeja, joiden ansiosta ohjelmistokehittäjä voi varmistua siitä, että sivusto on mahdollisimman suuren yleisön käytettävissä. Näitä standardeja ovat esimerkisi sivuston rakennetta kuvaava HTML, ulkoasua kuvaava CSS, toiminnallisuutta kuvaava Javascript ja sovellustason protokolla HTTP.
Päätelaitteiden kehittyessä myös web-sivustot ovat kehittyneet. 90-luvulla päätelaitteet olivat hyvin samankaltaisia ja täten myös sivustojen kehittämisessä ei tarvinnut huomioida eroja. 2000-luvun loppupuolella älypuhelimet alkoivat yleistyä ja tämä vaikutti käyttöliittymien suunnitteluun.
Erillisten mobiili- ja työpöytäkäyttöliittymien sijasta voidaan sivuston käyttöliittymä toteuttaa responsiivisena. Responsiivinen käyttöliittymä ottaa huomioon päätelaitteen resoluution ja fyysisen koon. Näiden tietojen perusteella se asettelee sivuston eri osaset eri paikoille riippuen laitteesta.
Kirjastojen vertailua varten luotiin käyttöliittymäprototyyppi ja se toteutettiin jokaisella kirjastolla erikseen. Vertailu on jaettu kolmeen osa-alueeseen: responsiivisuus, suorituskyky ja kehitettävyys.
Vertailun parhaaksi kirjastoksi osottautui Bootstrap ja lähes yhtä hyväksi Semantic-UI. Milligram kuitenkin oli suorituskyvyltään paras, mutta muilla mittareilla heikoin.
Web-selaimet noudattavat tiettyjä standardeja, joiden ansiosta ohjelmistokehittäjä voi varmistua siitä, että sivusto on mahdollisimman suuren yleisön käytettävissä. Näitä standardeja ovat esimerkisi sivuston rakennetta kuvaava HTML, ulkoasua kuvaava CSS, toiminnallisuutta kuvaava Javascript ja sovellustason protokolla HTTP.
Päätelaitteiden kehittyessä myös web-sivustot ovat kehittyneet. 90-luvulla päätelaitteet olivat hyvin samankaltaisia ja täten myös sivustojen kehittämisessä ei tarvinnut huomioida eroja. 2000-luvun loppupuolella älypuhelimet alkoivat yleistyä ja tämä vaikutti käyttöliittymien suunnitteluun.
Erillisten mobiili- ja työpöytäkäyttöliittymien sijasta voidaan sivuston käyttöliittymä toteuttaa responsiivisena. Responsiivinen käyttöliittymä ottaa huomioon päätelaitteen resoluution ja fyysisen koon. Näiden tietojen perusteella se asettelee sivuston eri osaset eri paikoille riippuen laitteesta.
Kirjastojen vertailua varten luotiin käyttöliittymäprototyyppi ja se toteutettiin jokaisella kirjastolla erikseen. Vertailu on jaettu kolmeen osa-alueeseen: responsiivisuus, suorituskyky ja kehitettävyys.
Vertailun parhaaksi kirjastoksi osottautui Bootstrap ja lähes yhtä hyväksi Semantic-UI. Milligram kuitenkin oli suorituskyvyltään paras, mutta muilla mittareilla heikoin.
Kokoelmat
- Kandidaatintutkielmat [10561]