23.9.2015 | Verkkopalvelukehitys

Mitä markkinoijan tulee ymmärtää web-ohjelmoinnista

1. Front-end ja back-end

Jokaisella verkkosivustolla on kaksi puolta – front-end ja back-end. Niihin viitataan myös termeillä ”selainpuoli” ja ”palvelinpuoli”. Front-end tarkoittaa kaikkea sitä koodia, joka ajetaan verkkoselaimessa – siis silmiesi edessä, kun käytät sivua. Front-endiä ovat esimerkiksi sivun rakenne (html), ulkoasu (css) ja selaimessa tapahtuvat toiminnallisuudet (javascript).

Back-end puolestaan tarkoittaa koodia, joka ajetaan sivuston palvelimella – siis esimerkiksi yrityksesi serverihuoneessa tai pilvipalvelussa. Täällä tapahtuvat esimerkiksi sellaiset asiat kuin lomakkeiden käsittelyt, kirjautuminen ja salasanojen tarkistaminen, järjestelmäintegraatiot ja tietokantojen käsittely.

Miksi tämä on tärkeää? Koska uutta verkkopalvelua ostettaessa front-end ja back-end vaikuttavat oleellisesti projektin hintaan, kokoon ja kestoon. Lähinnä front-endistä koostuva sivusto – oli se kuinka hieno ja visuaalinen tahansa – on aina yksinkertaisempi ja tiiviimpi projekti kuin suuren back-endin vaativa sivusto, johon liittyy esimerkiksi järjestelmäintegraatioita. Jos siis osaat tunnistaa, liittyvätkö sivustosi uudistustarpeet pääosin back-endiin vai front-endiin, olet jo askeleen muita pidemmällä.

2. Selain tulkitsee koodia – omalla tavallaan

Miksi verkkosivustot näyttävät erilaisilta eri selaimilla? Kun saman verkkosivun avaa Internet Explorerilla, Firefoxilla, Chromella tai Safarilla, voi yleensä havaita pieniä eroavaisuuksia sivun layoutissa. Mitä vanhempia selaimia käytetään, sitä erilaisemmilta sivut usein näyttävät. Erityisesti vanhat Internet Explorer -selaimet voivat näyttää modernista verkkosivusta paljon tylsemmän ja yksinkertaisemman version.

Tämä johtuu siitä, että verkkosivuston ulkoasua tehdessään koodari oikeastaan kirjoittaa verkkoselaimelle vain ”ohjeet” sivun rakentamiseen. Lopullisen työn tekee selain, ja sillä saattaa olla asiasta erilainen käsitys. Taitava koodari testaa aina sivuston useilla eri selaimilla, mutta toisinaan vanhoilla selaimilla ei yksinkertaisesti ole kompetenssia ymmärtää modernia web-teknologiaa. Tällöin joudutaan tekemään kompromisseja. Aina ei ole tarkoituksenmukaista optimoida sivua selaimelle, jota käyttää alle prosentti kohderyhmästä.

Sivuston ei ole lainkaan välttämätöntä näyttää täsmälleen samalta kaikilla selaimilla – tärkeintä on, että sivuston käyttökokemus on hyvä ja miellyttävä. Mobiiliselaimia unohtamatta!

3. Avoin vai suljettu järjestelmä?

Drupal, WordPress, Joomla… mihin järjestelmään kirjaudut, kun päivität sivustoa? Julkaisujärjestelmissä on eroja, ja useimmiten tekee mieli valita se, joka näyttää hyvältä ja on mukava käyttää. Mutta autoakaan ei osteta pelkän verhoilun takia – väliä on myös sillä, mitä löytyy konepellin alta. Julkaisujärjestelmäkin on lopulta vain kasa koodia – eikä ole yhdentekevää, millaista.

Jo mainitut Drupal, WordPress ja Joomla – sekä monet muut – ovat avoimen lähdekoodin ohjelmistoja. Tämä tarkoittaa sitä, että näiden ohjelmistojen kehittäminen on ilmaista ja mahdollista kenelle tahansa. Niihin ei siis omista yksinoikeutta mikään tietty ohjelmistotalo – kuten vaikkapa Microsoft – vaan ne ovat tavallaan koodariyhteisön yhteistä omaisuutta. Tästä syystä suositut avoimen lähdekoodin julkaisujärjestelmät ovat yleensä turvallinen valinta. Niihin on helppo löytää osaavaa teknistä tukea, etkä sitoudu yhteen toimittajaan.

Monilla ohjelmistoyrityksillä on myös omia julkaisualustoja, jotka saattavat laadultaan vaihdella surkeasta briljanttiin, mutta sitoutumalla niihin sitoudut myös aina kyseiseen toimittajaan. Jos haluat vaihtaa sivuston kehittäjää, tarkoittaa se tyypillisesti koko sivuston uudelleenkoodausta, joka on kallis ja aikaa vievä projekti. Jos taas sivustosi on rakennettu avoimen lähdekoodin alustalle, voidaan se siirtää sellaisenaan uuden toimittajan hallintaan alustaa vaihtamatta.

(Toisinaan myös ”suljettu” julkaisujärjestelmä voi olla mielekäs valinta – kunhan olet varma mihin sitoudut ja tiedät mitä ostat).

4. Kurkista lähdekoodiin

Oletko koskaan vilkaissut sivustosi lähdekoodia? Se tapahtuu näin: klikkaa selainikkunaa hiiren oikealla painikkeella ja valitse avautuvasta valikosta ”Näytä lähdekoodi” /  ”View source”. Tämä avaa uuteen välilehteen tai ikkunaan sivuston lähdekoodin, joka saattaa kieltämättä näyttää sekamelskalta. Tutkimalla lähdekoodia tarkemmin huomaat, että sieltä löytyy kaikki sivustosi sisältö html-muodossa. Esimerkiksi sivun otsikko saattaa näyttää tältä: <h1>Otsikko</h1>. Kun päivität sivua, koodaat siis itsekin – julkaisujärjestelmä vain muokkaa sisällön puolestasi html-muotoon.

Yleisimpien html-muotoilujen ymmärtäminen on hyödyllistä kenelle tahansa verkkosivujen parissa työskentelevälle. Seuraavan kerran, kun päivität sisältöä verkkosivustolle, valitse julkaisujärjestelmästäsi (jos mahdollista) html-näkymä perinteisen editorin sijaan – ja kokeile itse!

 

Tarvitsetko apua verkkopalvelusi kehitykseen? Ota yhteyttä sami.aittovaara@dagmar.fi

Tuulikki Laine

Tuulikki Laine

Lisää aiheesta