Responsiivinen web-suunnittelu - responsiivisuus kehitettäessä Reactilla
Hoikka, Maija (2021)
Julkaisun pysyvä osoite on
https://urn.fi/URN:NBN:fi:amk-2021120223179
https://urn.fi/URN:NBN:fi:amk-2021120223179
Tiivistelmä
Tänä päivänä, ja varmasti myös tulevaisuudessa, internettiä käytetään kasvavassa määrin mobiililaitteilla. Myös monet palvelut ovat kasvavassa määrin siirtyneet verkkoon. Kaikki käyttäjät eivät omista lainkaan tietokonetta, eikä heillä välttämättä myöskään ole helppoa pääsyä sellaisella. Tästä syystä on todella tärkeää, että verkko ja sen sisältö on kaikille saavutettavissa ja tarjoaa miellyttävän käyttökokemuksen riippumatta siitä millaista laitetta he käyttävät.
Tässä opinnäytetyössä tutkittiin responsiivista web-suunnittelua ja responsiivisuutta, kun kehityksessä käytetään React kirjastoa. Opinnäytetyön tavoitteena oli tutustua responsiiviseen web-suunnitteluun, sen kehitykseen, käsitteisiin ja hyötyihin. Lisäksi haluttiin tutustua Reactiin ja selvittää kuinka sillä luodaan responsiivinen verkkosivu ja mitä hyötyjä se tarjoaa responsiiviseen web-suunnitteluun. Tutkimuksen tarkoituksena ei kuitenkaan ollut ottaa kantaa siihen onko React kirjastona hyvä tai huono valinta responsiivisen verkkosivun luomiseksi.
Opinnäytetyön tietoperustan ensimmäisessä luvussa tutustutaan ensin responsiivisen web-suunnittelun käsitteeseen ja siihen mitä sillä tarkoitetaan. Tämän jälkeen käydään läpi responsiivisen web-suunnittelun historiaa ja kehitystä nykyisiin raameihinsa. Seuraavaksi tutustutaan keskeisimpiin käsitteisiin kuten mediakyselyt ja joustava ruudukko, jonka jälkeen avataan termiä Mobile first. Ensimmäisen luvun viimeisessä alaluvussa käydään läpi responsiivisen web-suunnittelun tarjoamia hyötyjä.
Tietoperustan toisessa luvussa tutustutaan lyhyesti Reactiin ja siihen, kuinka Reactilla toteutetaan responsiivinen verkkosivu. Lisäksi esitellään lyhyesti kolme suosittu Reactille suunnattua sovelluskehystä, jotka auttavat responsiivisen verkkosivun luomisessa. Tietoperustan lähteinä on käytetty pääasiassa kirja- ja erilaisia verkkolähteitä.
Tutkimus on tyypiltään laadullinen tutkimus. Tutkimus toteutettiin laadullisena, koska tutkimuskohdetta pyrittiin selittämään ja ymmärtämään ennemmin kuin mittaamaan. Tutkimuksessa hyödynnettiin myös asiantuntijahaastattelua haastattelemalla yhtä asiantuntijaa. Haastattelu toteutettiin Webropol verkkolomakkeen avulla, joka sisälsi kymmenen avointa kysymystä. Opinnäytetyö toteutettiin 20.9. – 23.11.2021 välisenä aikana.
Opinnäytetyön lopputuloksena saatiin kattavaa tieto responsiivisesta web-suunnittelusta sekä Reactista ja näiden kahden yhdistämisestä. Tutkimuksen johtopäätöksenä on se, että responsiivisen web-suunnittelun implementoiminen on erittäin tärkeää käyttäjien näkökulmasta ja tarjoaa myös monia hyötyjä kehittäjille. React ei varsinaisesti ota itsessään kantaa responsiiviseen web-suunnitteluun mutta se on luotu niin, että responsiivista suunnittelua voidaan Reactin kanssa toteuttaa esimerkiksi erilaisten kirjastojen, sovelluskehysten ja aivan tavallisen CSS:n avulla helposti.
Tässä opinnäytetyössä tutkittiin responsiivista web-suunnittelua ja responsiivisuutta, kun kehityksessä käytetään React kirjastoa. Opinnäytetyön tavoitteena oli tutustua responsiiviseen web-suunnitteluun, sen kehitykseen, käsitteisiin ja hyötyihin. Lisäksi haluttiin tutustua Reactiin ja selvittää kuinka sillä luodaan responsiivinen verkkosivu ja mitä hyötyjä se tarjoaa responsiiviseen web-suunnitteluun. Tutkimuksen tarkoituksena ei kuitenkaan ollut ottaa kantaa siihen onko React kirjastona hyvä tai huono valinta responsiivisen verkkosivun luomiseksi.
Opinnäytetyön tietoperustan ensimmäisessä luvussa tutustutaan ensin responsiivisen web-suunnittelun käsitteeseen ja siihen mitä sillä tarkoitetaan. Tämän jälkeen käydään läpi responsiivisen web-suunnittelun historiaa ja kehitystä nykyisiin raameihinsa. Seuraavaksi tutustutaan keskeisimpiin käsitteisiin kuten mediakyselyt ja joustava ruudukko, jonka jälkeen avataan termiä Mobile first. Ensimmäisen luvun viimeisessä alaluvussa käydään läpi responsiivisen web-suunnittelun tarjoamia hyötyjä.
Tietoperustan toisessa luvussa tutustutaan lyhyesti Reactiin ja siihen, kuinka Reactilla toteutetaan responsiivinen verkkosivu. Lisäksi esitellään lyhyesti kolme suosittu Reactille suunnattua sovelluskehystä, jotka auttavat responsiivisen verkkosivun luomisessa. Tietoperustan lähteinä on käytetty pääasiassa kirja- ja erilaisia verkkolähteitä.
Tutkimus on tyypiltään laadullinen tutkimus. Tutkimus toteutettiin laadullisena, koska tutkimuskohdetta pyrittiin selittämään ja ymmärtämään ennemmin kuin mittaamaan. Tutkimuksessa hyödynnettiin myös asiantuntijahaastattelua haastattelemalla yhtä asiantuntijaa. Haastattelu toteutettiin Webropol verkkolomakkeen avulla, joka sisälsi kymmenen avointa kysymystä. Opinnäytetyö toteutettiin 20.9. – 23.11.2021 välisenä aikana.
Opinnäytetyön lopputuloksena saatiin kattavaa tieto responsiivisesta web-suunnittelusta sekä Reactista ja näiden kahden yhdistämisestä. Tutkimuksen johtopäätöksenä on se, että responsiivisen web-suunnittelun implementoiminen on erittäin tärkeää käyttäjien näkökulmasta ja tarjoaa myös monia hyötyjä kehittäjille. React ei varsinaisesti ota itsessään kantaa responsiiviseen web-suunnitteluun mutta se on luotu niin, että responsiivista suunnittelua voidaan Reactin kanssa toteuttaa esimerkiksi erilaisten kirjastojen, sovelluskehysten ja aivan tavallisen CSS:n avulla helposti.