Webbikielen ABC

Törmään melko säännöllisesti työssäni kysymykseen: Mitä tuo tarkoittaa? Ajattelin kirjoittaa ”webbikielen abc”- postin, jossa vähän avataan yleisintä webbikieltä, mistä kuluttajakin saattaa hyötyä.

Hakukoneoptimointi

Varmasti kaikki ovat joskus hakeneet Googlen hakukoneella (googlettaneet) jotain, kuten ”Volvo huolto”, ”verkkosivut oulu”, ”edulliset lennot” jne…

Miten google osaa tarjota juuri oikeat vaihtoehdot ja vielä alueelle missä googletat? Tämä johtuu siitä, että paikallisten yrityksien sivut ovat todennäköisesti hakukoneoptimoitu tietyille hakusanoille ja tietylle alueelle. Jotta sivut voivat löytyä oikeilla hakusanoilla, on sivuille tehtävä hakukoneoptimointi ja tämä onkin yksi tärkeimmistä asioista yrityksen / organisaatioiden sivuissa. Jos sivuja ei hakukoneoptimoida,voi olla että yrityksen sivuja ei löydy koskaan kun potentiaalinen asiakas etsii niitä.

Responsiivisuus

Toimivatko sivut niin matkapuhelimilla, padeillä kuin tietokoneilla? Jos vastaus on kyllä, sivut ovat tällöin responsiiviset. Sivut toisin sanoen mukautuvat ja ”tunnistavat” millä laitteella sivuja käytetään. Responsiivisissa sivuissa on tehty myös yleensä menuvalikko ”navigointi” eri tavalla mobiili- ja työpöytäpuolella. Valitettavasti useilla yrityksillä on vielä tälläkin hetkellä sivut, jotka eivät toimi matkapuhelimilla, tai sitten sivujen responsiivisuus on toteutettu erittäin huonosti.

Webhotelli ja domain

Kaikki kotisivut sijaitsevat jollain palvelimella mistä sivuja ladataan.

Webhotellitarjoaja myy valmiin paketin, joka sisältää seuraavat palvelut: sivuille paikan (palvelintilan), domainin ja yleensä muutaman sähköpostiosoitteen. Domain on vuorostaan kyseisen verkkosivuston osoite, kuten www.curu.fi . Webhotellissa kaikki nämä paketoidaan asiakkaalle valmiiksi tuotteeksi ilman, että hänen tarvitsee ymmärtää teknillisiä asioita liikaa. Voitaisiin puhua ALL-IN-ONE paketista, joka sisältää kaiken, mitä yritys tai organisaatio tarvitsee webbisivuja varten.

WordPress ja Magento

WordPress ja Magento ovat webbisivualustoja, jonka päälle itse sivut rakennetaan. Asiakas voi päivittää sivuja tai periaatteessa vaikka tehdä sivut alustojen avulla. Ulkopuolelta ei voi nähdä mille alustalle sivut on tehty, mutta kirjautuessa sisälle päivitystyökaluun ovat kaikki eri alustat täysin erityyppisiä käyttää. WordPress on tällä alueella ylivoimainen markkinajohtaja. Alustat ovat vähän kuin auton ohjaamo, josta autoa ohjataan ja auton ulkopuoli on mitä asiakas näkee. Websivualustat pyörivät aina jollain palvelimella / webhotellissa.

Front-end, back-end ja Full-stack

Alan henkilöt viljelevät näitä sanoja aika ajoin, jolloin kuluttajat ovat usein melko hämmentyneitä: ”Että mitähän bittiä noi puhuu?”. Kyseisillä asioilla tarkoitetaan webbisivujen koodirajapintoja. Ajattele vaikka jäätyneen järven jäätä ja sen alla olevaa vettä. Front-end (jää) kuvastaa asiakkaalle näkyviä asioita, kun he menevät vaikka iltalehden sivuille. Kaikki mitä näemme siellä on front-end-koodaajan tekemää näkyvää asiaa, kuten menuvalikko. Eli tämä mitä näet sivuilla tällä hetkellä on kaikki front-endiä.

Back-end on taas serveritason ”näkymätöntä” koodia, eli ”vettä”. WordPress ja Magento on periaatteessa back-endiä. Kun kirjoitin tämän artikkelin käytin siinä hyväkseni back-endiä, joka muuttui rajapintojen välillä back-endistä -> front-endiksi. Näiden sivujen alapalkissa oleva ”Palvelimen tila” vihreävalo perustuu osittain back-endiin. Jotta voin tietää onko palvelin kunnossa, joudun noutamaan palvelimelta tästä tiedon, joka tulee back-endistä.

Full-stack on vain nimi koodarille, joka hallitsee sekä front- ja back-end koodauksen.

Karuselli ja parallax

Näistä tulee aina aika-ajoin kysymyksiä, että mitä ne tarkoittavat. Karuselli on sivuilla näkyvä alue, jossa vaihtuu vaikka kuva ja teksti. Esim. CURU:n sivuilla etusivulla on asiakaskokemuksia 3kpl ja ne vaihtuvat vasemmalta oikealla aina uuteen. Eli karuselli kierrättää näitä kolmea arvostelua. Karusellejä kutsutaan myös toiselta nimeltä ”slideriksi”.

Parallax on websivujen 3D-manipuloinnista käytettävä nimitys, kun tausta liikkuu eri tahtiin, kuin pääsisältö. Tämä aiheuttaa sivujen käyttäjälle kolmiuloitteisen fiiliksen. Tässä yksi meidän asiakkaamme sivusto, joka on toteutettu parallaxilla. www.smartheating.fi (Huom! parallax on pois käytössä iOS-laitteilla)

No tässä tälläinen pieni infopaketti webkielestä. Toivottavasti sait iloa tästä ja se auttoi ymmärtämään mistä ne ”webbidevaajat” oikein puhuvat.

– CURU –

Jaa toki eteenpäin