Uusi versio julkaistu – Rollemaan kehityspolku vuodesta 2014

Kirjoittanut . Liittyy aiheisiin , , , , , , , , , , , , , .

Keskiviikkoiltapäivänä, eli toissapäivänä sain idean freesata blogini alusta asti uusiin kuosiin. Otin asian myös henkilökohtaisena experimenttinä, sillä luet juuri sivustoa, joka on kaikkien aikojen ensimmäinen tekemäni verkkosivu. Rollemaalla on tunnearvoa, onhan saitti ollut pystyssä jo vuodesta 1999 ja muuttunut moneen otteeseen. Se on hullua se!

Experimentti siinä mielessä, että olen vuosi vuodelta vain tehokkaampi (vaikka itse sanonkin). Tuntuu, että edellisestä uudistuksesta on vasta lyhyt aika, mutta se oli hyvänen aika neljä vuotta sitten. Siitähän löytyy totta kai bloggaus, otsikolla Rollemaa.org uudistui – katso miten kaikki muuttui.

Kasvaneesta tehosta kielii myös se, että viimeksi projektissa meni kuusi päivää, nyt vain vajaat kolme. Teho on siis tuplaantunut! mutta niin on työkalutkin. Kerron niistä lisää kohta.

Uusille lukijoille hieman historiaa

Aloitin verkkosivujen tekemisen milleniumin kupeessa, Jyskässä, vanhalla Pentiumilla, ollessani noin kymmenvuotias nulikka. Aloitin toki jo aiemmin tietokonepeleillä, mutta kiinnostuin viimeistään siinä vaiheessa kun verkkosivut alkoivat muuttua visuaaliseksi. Visuaalinen puoli on ollut kaiken ”ohjelmoinnin” lähtökohta minun maailmassani. Se kai tekee minusta fronttidevaajan, eli ulkoasujen verkkomuotoon taittamiseen keskittyvän ihmisen. Työpaikkahan oli Dude, jossa koodarin roolin lisäksi olen perustajajäsenenä myös yrityksen yksi pyörittäjistä.

Täytyy sanoa, että nyt on helpottunut olo. Kaikista pahinta on kun joku jää kesken ja menet nukkumaan. Kärsin jo valmiiksi unettomuudesta, mutta tällaiset kertarykäys-lomaprojektit ovat siinä mielessä huonoja, että sitten en nuku lomallakaan. Onneksi menikin vain näin ”lyhyt” aika.

Omat projektit ja erityisesti Rollemaa ovat sellaisia, että jos lähden jotain tekemään, en pysty rauhoittumaan ennen kuin on valmista. Viimeiset kolme päivää on ollut intensiivistä web-kehitystä, jatkuvalla syötöllä, pisimmillään kymmenen tunnin putkea syömättä, juomatta ja nukkumatta. En mahda sille mitään. Jos on kipinä, niin se täytyy käyttää. Mobiililaitetestauksen kävin tekemässä toimistolla, siellä kun on tusinalla laitteella varustetut Device Labit.

En lähde tähän avaamaan historiaa sen enempää, sillä web.archive.orgista voit mennä aikakoneella taaksepäin syöttämällä kenttään rolleweb.net tai rollemaa.org sekä neljän vuoden takaisesta bloggauksesta voit katsoa mitä viimeksi muuttui. 2-4 vuotta on pitkä aika web-maailmassa, mutta vielä pidempi 10-20 vuotta.

On hurjaa, että alotiin verkkosivujen tekemisen silloin, kun ei tunnettu laajasti vielä käsitettä lisätä CSS:ää erilliseen tiedostoon. Oli taulukot, inline-tyylit (tyylejä laitettiin stylellä ja muilla määritteillä HTML:n sekaan) ja vasta myöhemmin kävi ilmi, että on kehitetty erillinen kieli tyyleille. Jo ennen MySpace ja IRC-Galleria -modauksia oli omia saitteja kasassa. Silloin muutama, nykyään sata. Aivan samalla kaavalla edetty päivittäin, kohta 20 vuotta eteenpäin. Pää räjähtää.

Blogin ja domainin nimi

Olen jo hetken aikaa pitänyt Rollemaa-nimeä vähän hömppänä. Se on teini-ikäisen päähänpisto, jossa ei ole minkäänlaista ajatusta taustalla. Varhaisteinin rolleweb.net kuopattiin kun webhotelli meni konkurssiin (lukea voi vuoden 2008 bloggauksia sekä tagin futuron alta), tämän jälkeen piti keksiä uusi domain ja mietin jos ei kerran web niin sitten maa. Rollen maa, tai jotain.

Twitter-kyselyyni tuli 54 ääntä ja lukuisia kommentteja. Suurin osa oli sitä mieltä, että etunimisukunimi.fi-tyyppinen olisi paras. Minusta se on kuitenkin turhan asiallinen ja liian henkilöä sitova. Kommentteja tuli paljon, kiitos valtavasti kaikille!

Ihailen WordPressin perustajan Matt Mullenwegin ma.tt-domainia ja haluaisin samanlaisen itselleni, mutta valitettavasti kaikki rolle-sanan sisältävät domainit on viety, eikä .le TLD:tä pysty rekisteröimään. Kerkesin rekisteröidä Zonerilta domainin rol.le ja hauskaa kyllä, päästi sen läpi, mutta peruin tilauksen kun tajusin että .le ei ole oikea pääte. Aika kökkö systeemi kun ei tarkista mitenkään.

Kukaan ei kyseenalaistanut nimenmuutospohdintaani missään vaiheessa, mistä olin hieman yllättynyt. Pingasin Ei oo totta -blogin Katleenaa, sillä hänellä on lause domainina, eikä esimerkiksi katleenakortesuo.fi. Hän lähestyi privaviestillä ystävällisesti ja ehdotti rollemaa.fi-domainia. Yksityisesti siksi, koska ei halunnut että menetän domainin, jos joku ilkimys varaa sen. Upeasti ajateltu, kiitos Katleena!

Katleenalle lisää ruusuja, sillä hän oli ainoa, joka kyseenalaisti koko asian. Rollemaa on tosiaan vakiintunut nimi, eikä sitä parane mennä muuttamaan. Ja minä hölmö kun edes mietin moista! Blogin nimen ei tarvitse liittyä henkilöön, vaikka minulla se toisaalta sisältää nimimerkkini. Rollemaa voi olla pöhkö, mutta kaikki tuntevat sen. Se riittää minulle.

Nimi ei siis vaihtunut, vaan ainoastaan domain, joka on nyt rollemaa.fi. Vanha rollemaa.org ohjaa uuteen domainiin jatkossa. En oikeastaan tiedä miksi en aikoinaan varannut .fi-domainia. Ehkä .org kuulosti vähemmän viralliselta ja kankealta. Olin nuori hei.

Aikataulu

Wakatimen mukaan uudistukseen kului tasan 26 tuntia, 25 minuuttia ja 10 sekuntia. Palvelu tarkistaa 10 minuutin välein nakuttaako koodia, eli tämä tarkoittaa sitä että tuo 26 tuntia on yhtämittaista koodaamista. Tuon ajan lisäksi toki nukuin, söin ja touhuilin perheen parissa siinä välissä, jolloin kokonaisajaksi muodostui se vajaa kolme vuorokautta.

Inspiraatio

Jo viimeksi varmaan huomasit, että inspiraatiota oli haettu Medium.comista. Niin tälläkin kertaa (rakastan tuota saittia!). Monet elementit ovat jopa identtisiä. Mitään ole kuitenkaan suoraan kopioinut, vaan ottanut mallia. Kaikki koodi on omaa, ellei open source -palikoita lasketa.

Typografia

Viimeksi otsikkofonttina oli Kievit ja leipiksessä Charter. Tällä kertaa vaihdoin Circulariin, jota käyttää mm. Spotify. Tobias van Schneider on yksi lempisuunnittelijoiltani ja häneltä saan paljon inspiraatiota typografiaan. Hän on tietääkseni suunnitellut myös Spotifyn typografian.

Mitä kehittyi viime versiosta?

Rakastin edellistä leiskaa niin paljon, että en lähtenyt tarkoituksella suunnittelemaan uutta yhtään aikaisemmin. Tästä ulkoasusta näkee, että olen säilyttänyt tosi paljon vanhaa. Olen kuitenkin myös vanhat palikat koodannut alusta asti uusiksi, vaikka ne saattavat näyttää samalta.

Kehittynyttä on, mm.

  • Logon freesaus. Jotain ovelaa koitin suunnitella, tykkään, vaikka onkin vähän hassu. Niin on Rollemaakin.
  • Kokonaan uusi koodipohja. Kaikki on koodattu alusta asti, pohjateemana yritykseni/kehittämäni Air -niminen WordPress -starterteema. Edellisen dudestarter on kuopattu jo pari vuotta sitten.
  • Bootstrap ja kaikki bloat-tauhkat heitetty hevonkuuseen ja tilalla vain hyvää koodia, eli enimmäkseen sitä mitä olen starter teemaamme kehittänyt viimeisen neljän vuoden ajalta. Gridinä toimii mainio jeet (SCSS-versio). CSS Grid -systemeitä en vielä ruvennut virittelemään, koska se ei minun makuuni edelleenkään ole riittävän stable. Odotellaan sopivaa hetkeä.
  • Typografiana viewport units remin sijasta (wv yms.). Dokumentaatiota löytyy airista
  • Viime uudistuksessa (2013-2014) käytin sentään SASSia (oho!), mutta Compass on ihan hirveää bloatwarea josta luovuin vuosi tuon jälkeen. Samoin CodeKit ja muista GUI-tyyppisistä sovelluksista, joilla kestää kääntää SCSS CSS:ksi useampi sekunti tallentamisen jälkeen. Long live libsass!
  • Valokuvat edelleen keskiössä. Osa minun ottamiani, osa CC0-lisensoiduista, vapaista ja ilmaisista kuvapankeista.
  • Erikoisuudet: Mm. muualla kuin etusivulla, kun rullaat ihan pohjalle, somefeedejä ei tule oletuksena näkyviin. Tämä säästää latausnopeutta huomattavasti, ja kun ei niiden tarvitse tulla aina mukana kun olet kerran ne nähnyt. Kehittelen muutakin vastaavaa kivaa jatkossa!
  • Aina tyylikäs artikkelikuva. Jos kuvaa ei löydy (90% vanhoista artikkeleista, jolloin ei edes ollut käsitystä mistääna artikkelikuvasta) arvotaan valitsemieni 100 kuvan joukosta yksi helmi.
  • Etusivun video! Löysin ihan mahtavan CC0-videon Internetin ihmeellisestä maailmasta. Rollemaata on aina kuvannut melankolinen tai utuinen maisema. Paras olisi ollut kesäinen sadesää/myrsky, jossa lämmin tuuli on keskiössä. Tämä teema on näkynyt jokaisessa Rollemaan leiskassa aina vuodesta 2006 lähtien.
  • Mobiilivalikko! Sano ei hampurilaismenulle! (kolme viivaa allekain) Tässä versiossa on vaakatasossa swaipattava valikko. Mitäs pidät?
  • Terävät SVG-kuvakkeet! Ei enää tuhnuisia png-kuvia. Nyt kaikki mikä voi, on vektoria.

Kaikkea ei ole 100% testattu, mutta sanoisin että 90% ollaan maalissa. Todolistalle jäi tavaraa, eli tulevina päivinä, viikkoina tai kuukausina aion tehdä tänne vielä jotain siistiä!

Palvelin

Uudistuksen myötä Rollemaa on siirretty järeämmälle palvelimelle Suomeen, joten kaiken pitäisi toimia hieman nopeammin.

Sisältö

Erityisesti etusivulle pyrin tuomaan jatkossa erilaista sisältöä ja erityisesti helpottamaan sisällön löytymistä. Mm. ”viimeisimmät kannanotot” -kohta on tulossa sekä uusien tekstien lataaminen ilman sivunlatausta. Ja paljon muuta.

Avoin lähdekoodi

Olen päättänyt ensimmäistä kertaa julkaista Rollemaan teeman open sourcena, jotta pääset tutkailemaan miten nykyään koodaan. Khonsu löytyy GitHub-tilini alta tästä linkistä. Koko Rollemaan repositorya en viitsi julkaista, koska se olisi silkka tietoturvariski (legacy-koodi). Lisäksi Rollemaan koko hässäkkä, leffasivu ja kaikki palikat vuosien varrelta vievät tilaa koneelta yhteensä 1,14 GB.

Loppusanat

Toivottavasti nautit uudesta Rollemaasta! Pyrin kehittämään sivustoa lisää ja kirjoittamaan uusia hyödyllisiä juttuja. Annahan ihmeessä palautetta alle kommentin muodossa tai Twitteriin. Ilmoitelkaa myös ongelmista heti kun niitä ilmenee!

Kuva Roni Laukkarisesta

Roni Laukkarinen

Kirjoittaja on 30-vuotias elämäntapanörtti, ammatiltaan yrittäjä itse perustamassaan digitoimistossa ja SaaS-palvelua kehittävässä startupissa, verkkosivujen tekijä, sosiaalisen median asiantuntija ja koukussa kirjoittamiseen 5-vuotiaasta. Suurin osa päivästä kuluu hevimusiikin ja koodaamisen parissa, mutta arkea piristyttää myös vaimo ja kaksi lasta. Twitter, leffat ja erikoisoluet lähellä sydäntä.

Lue Rollesta lisää

Reaktiot

Vaadittu kenttä

 

4 kommenttia

  1. Pete

    Oletko muuten huomannut, ettei https://www.rollemaa.org/ ainakaan vielä ohjaa minnekään?

  2. Rolle

    Hmm, pitäisi ohjata ja pingaakin oikeaan paikkaan. Jotkin mobiililaitteet saattavat pitää aika tiukassa välimuistissa.

  3. Pete

    Joo, olen käynyt monena päivänä katsomassa miten .org-päätteinen toimii ja se näyttää siltä, että yksittäiset blogipostaukset ohjaavat .fi-päätteiseen sivustoon, mutta etusivu (https://www.rollemaa.org/) ei ohjaa mihinkään. Testasin monella eri selaimella.

  4. Rolle

    Testasin nyt VPN:llä ja totta, näin on! Hyvin hämmentävää, sillä vanhan palvelimen tiedostoja ei enää ole ja kaikki pingaa oikeaaseen ip-osoitteeseen (185.87.110.7). En kyllä nyt millään keksi mikä tämän aiheuttaisi, sillä DNS on oikea, IP:t ovat oikein, välimuistitukset purgettu ja kaikki tuplatsekattu… mitähän ihmettä?

    Chromella ohjautuu oikein.