Responsiivisten verkkosivujen toteuttaminen: Case Twebs Oy

Abstract

Opinnäytetyön tavoitteena oli kuvata opinnäytetyön tekijän Taneli Raatikaisen omistaman yrityksen (Twebs Oy) verkkosivujen muokkaamisprosessia, jossa yritettiin luoda asiakkaalle helppokäyttöiset ja eri laitteille skaalautuvat eli responsiiviset sivut. Tarkoitus oli myös selvittää, miten nykyaikainen IT-alan yritys hyötyy kehitetyistä verkkosivuista. Tutkimusmenetelmänä käytettiin case-tutkimusta.

Tässä opinnäytetyöraportissa kuvataan alkutilanne, jossa yrityksellä oli käytössään itse ohjelmoidut verkkosivut. Ne toimivat hyvin vain tietokoneella katseltaessa, mutta eivät mukautuneet mobiililaitteille. Jopa yli puolet käyttäjistä tulee yrityksen sivuille mobiililaitteilla, joten nämä käyttäjät oli huomioitava uusia sivuja suunniteltaessa.

Työssä selvitettiin, miten sivuja piti parantaa käyttäjän näkökulmasta. Samalla selvitettiin myös, miten responsiiviset sivut toteutetaan. Responsiivisten sivujen toteutus kuvataan raportissa yksityiskohtaisesti.

The goal of the thesis was to describe the editing process of a company website. The company (Twebs Oy) is owned by Taneli Raatikainen who is also the writer of this thesis. The website was developed to make it easy to use for a customer and to make it responsive to support different kinds of devices. One target was also to find out how modern IT-business benefits from the improved website. The used research method was case study.

The starting point where the company had self-programmed website is described in the thesis. The self-programmed website was working great only when it was used on a desktop, but it did not scale as wanted on mobile devices. However, over 50 percent of the people visiting a website use mobile devices. That is why it is necessary to take the mobile users into account when designing the new website.

The thesis describes how the website should be improved from the aspect of a customer and how to make a flawless responsive website. The whole development process was described in detail.