Toinen syy tämän kyselyn tekemiseen on Wufoo-kysymyslomakepalvelun testaaminen. Tuntuu erittäin näppärältä palvelulta, jolla saa kysymyslomakkeen aikaiseksi varsin helposti. Lomakkeen saa myös upotettua haluamalleen sivulle lisäämällä pienen pätkän javascriptiä, kuten tällä sivulla on tehty.

Tutustu Smilehouse eCommerce Academyyn

Suora liikenne kertoo itse asiassa ainoastaan sen, kuinka moni vierailija saapuu sivuille sellaisen toiminnon kautta, joka ei kerro selaimelle lähtöpaikkaansa.

Alla eräs lista, joka selventää mistä kaikkialta Direct Trafficia esimerkiksi tulee:

1. Vierailija saapui sivuille kirjoittamalla ositteen selaimen osoitekenttään tai klikkaamalla selaimen kirjanmerkkiä.
2. Vierailija klikkasi linkkiä sähköpostiohjelmassa. Webmail-palvelut näkyvät usein toisella tavalla.
3. Linkki oli dokumentissa.
4. Lähtösivusto on salattu, https-alkuinen osoite.
5. Vierailija käyttää IE-selainta ja linkki sivustolle oli toteutettu Javascriptillä tai Flashillä, kuten moni mainosbannerin linkki.
6. Sivustosi kohdesivulla on 301 permanent redirect.
7. Linkki oli intranetissä tai muulla proxyn tai vastaavan takana olevalla sivustolla.
8. Vierailija on tehnyt muutoksia selaimeensa estäen sitä kertomasta lähdesivua.
9. Jokin toinen sivusto on laittanut sivustosi sisältöä iFrameen ja estänyt lähdesivun paljastumisen koodin avulla.

Ainakin nämä edellä mainitut tekijät aiheuttavat siis sen, että Google Analyticsissä näkyy liikenteen lähteenä suora liikenne, eikä todellista lähdettä. Vaikuttavia tekijöitä on varmasti myös lisää ja jos joku tietää, niin täydentää listaa kommenttiosioon.

Jos haluat vähentää suorana liikenteenä näkyvien määrää, kannattaa liikenteen lähde merkitä suoraan linkkiin, jolloin Analytics rekisteröi se halutulla tavalla. Googlelta löytyy URL Builder Tool, jolla voit lisätä linkkiisi tietoja, jotka välittyvät Analyticsille. Tämä on hyödyllistä esimerkiksi halutessasi lisätä linkin uutiskirjeeseen, jolloin saat selville kuinka moni kävijä saapui sivuillesi juuri kyseisen uutiskirjelinkin kautta.

Halutessasi voit testata itsekin, mikä on jonkin tietyn sivun lähde kirjoittamalla seuraavan koodin selaimeen:

javascript:alert(document.referrer)

Popupin pitäisi tämän jälkeen kertoa lähde, mikäli sellainen on tiedossa.

Verkkokauppaopas.comin Twitteröintiä pääset seuraamaan osoitteesta http://twitter.com/Verkkokaupaopas tai vaihtoehtoisesti näet tweetit myös blogin vasemmasta reunasta erikoisartikkeleiden yläpuolelta.

Lisäksi suosittelen kaikille hiemankin enemmän sosiaalisia medioita seuraaville ja hyväksi käyttävälle esimerkiksi TweetDeck-nimistä ohjelmaa, jolla pystyy seuraamaan esimerkiksi Twitterin, Facebookin ja LinkedInin feedejä.

www.proverkkokauppa.fi

Ajattelin auttaa verkkokauppiaan uraa pähkäileviä muutamalla suomenkielisellä ja maksuttomalla oppaalla, jotka onnistuin löytämään netin syövereistä.

Alla on linkkejä niin verkkokaupan perustamisoppaisiin kuin sähköpostimarkkinoinnin oppaaseenkin. Osa oppaista on tilaustavaraa ja ne saa käyttöönsä, jos uskaltaa luopua yhteystiedoistaan.

Oppaita verkkokauppiaalle

Vilkas Group, joka tunnettiin aiemmin Gagarina (Omaverkkokauppa), on julkaissut 30-sivuisen PDF-oppaan nimeltään “Pienten- ja keskisuurten yritysten menestys verkkoliiketoiminnassa”.

Tilaa Vilkas Groupin opas

Apilaratas Oy, joka tunnetaan Clover Shop -verkkokauppaohjelmistostaan, on julkaissut “Näin onnistut verkkokaupan perustamisessa” -opassivuston.

Tietoyhteiskunnan kehittämiskeskus ry on julkaissut “Sähköisen kaupankäynnin aapisen“, jossa on peräti 104 sivua. Oppaan voi ladata PFD-muotoisena TIEKEn sivuilta.

Myös Itellalta löytyy opas verkkokauppiaan uran aloittamista helpottamaan. Itellan “Verkkokaupan opas” löytyy niin HTML kuin PDF -versioina.

Sähköisen kaupan palvelukeskus E-Commerce Finlandin sivuilta löytyy viisiosainen opas verkkokaupan perustamiseen.

Ideacafe-blogista löytyy Samuel Hovin kirjoittaman “Verkkokaupan perustaminen” -opas.

Koodiviidakko Oy on julkaissut 43-sivuisen sähköpostimarkkinoijan PDF-oppaan, josta on varmasti hyötyä kaikille verkkokauppiaille. Uutiskirjeiden oikeanlaisessa hyödyntämisessä suomalaiset verkkokaupat antavat ikävä kyllä liian usein tasoitusta ulkomaisiin kauppoihin verrattuna.

Tilaa Sähköpostimarkkinoijan käsikirja

Näillä oppailla verkkokauppias pääsee ainakin alkuun verkkokaupan perustamisen suhteen. Englanninkielisiä oppaita löytyykin sitten varmastin vino pino, joten niistä ehkä enemmän joku toinen kerta.

Kieliversioita saa käyttöönsä tietyn määrän riippuen kauppiaan valitsemasta MyCashflow-versiosta. Ilmainen versio sisältää yhden kieliversion, Small-versiolla voi toteuttaa kaksikielisen kaupan, Medium-versiossa kieliversioita voi olla jo viisi ja Max-paketin hankkineita hemmotellaan kymmenen eri kieliversion käyttömahdollisuudella.

Ilmeisesti versioita voi käyttää myös muuhun kuin eri kielisten kauppojen toteuttamiseen, joten nähtäväksi jääkin, millaisia eri versioita kauppiaat kaupoistaan uudistuksen myötä tarjoavat.

Edellä mainittujen uudistusten lisäksi luvassa on paljon muutakin. Uusia komentoja tulee vino pino ja mm. tilaus-osion muokattavuus paranee huomattavasti, sillä esimerkiksi kaikki kaupan sähköpostit ja kuitit voi suunnitella jatkossa itse Interface-tageilla. Kuitit tarjotaan verkkokauppiaalle PDF-tiedostoina, joten tulostus tulee olemaan jatkossa helpompaa.

Yksi huomionarvoinen, ja kaivatuin, uusi ominaisuus on “Tämän tuotteen ostaneet ostivat myös nämä tuotteet” -listaus. Kyseinen ominaisuushan on käytössä monissa hyvin menestyvissä verkkokaupoissa.

Uudistus tarjoaa myös tukun laajennuksia, joiden avulla kauppaansa voi yhdistellä moniin eri palveluihin. Esimerkkeinä mainittakoon Matkahuollon palvelut, Fruugo, Hintaseuranta, RunToShop ja vaikkapa ProCountor-taloushallintaohjelmisto. Luvassa on myös paljon muita laajennuksia.

Tarkkaa julkistuspäivämäärää ei vielä ole kerrottu, mutta mitä ilmeisimmin julkistus tapahtuu aivan lähiaikoina, sillä beta-versio on ollut joidenkin kauppiaiden testissä jo pidemmän aikaa.

Usein web-suunnittelu etenee jokseenkin tätä rataa:

1. Tehdään HTML-koodit jollain koodieditorilla (joku hullu saattaa käyttää notepadiakin)
2. Tallennetaan HTML-tiedosto
3. Siirretään HTML-tiedosto palvelimelle ftp-ohjelmalla
4. Tehdään CSS-koodit
5. Tallennetaan CSS-tyylitiedosto
6. Siirretään CSS-tiedosto palvelimelle ftp-ohjelmalla
7. Avataan sivu Firefoxiin ja tarkistetaan lopputulos
8. Avataan sivu IE:hen ja tarkistetaan lopputulos
9. Avataan sivu IE6:een (tai IETester) ja tarkistetaan lopputulos

Tämän jälkeen aloitetaan lähes päättymätön looppi kohtien 4-9 välillä ja joskus jopa kohtien 1-9 välillä, jotta sivuston ulkoasu saadaan hiottua kuntoon. Jokaisessa syklissä ei tietenkään jaksa tarkistaa tilannetta aivan kaikilla selaimilla, joten työskentelyn lopussa törmää hyvin suurella todennäköisyydellä ongelmiin ainakin IE6:n tapauksessa. Hommaan liittyy siis huomattava määrä vaiheita, jotka poistamalla suunnittelija pystyisi säästämään elämänsä aikana rutkasti työaikaa.

Stylizer

Törmäsin muutama viikko sitten täysin sattumalta CSS-editoriin nimeltään Stylizer, joka tarjosi 14 päivän maksuttoman kokeilujakson. Odotukset eivät itseasiassa olleet kovin korkealla, koska erilaisia, toinen toistaan huonompia editoreita on tullut testattua jonkin verran aikojen saatossa.

Parin viikon testijakson jälkeen Stylizer lopetti toimimasta täydellä teholla ja olin aivan hukassa. Ohjelma oli onnistunut nipistämään monta tuskaista rutiinivaihetta pois työprosessistani. Paluuta menneeseen ei ollut, joten ei auttanut kuin ostaa 59 euron hintainen lisenssi.

Siinä missä esimerkiksi Dreamweaver mahdollistaa sekä HTML-koodin että CSS-koodin muokkaamisen, Stylizer keskittyy siis ainoastaan CSS-koodin muokkaamiseen. Mutta se ei haittaa, sillä se tekee CSS-muokkaamisesta vaivatonta.

Kuten alla olevasta kuvasta näkyy, Stylizer näkyy vasemmalla selainikkuna ja oikealla tyylitiedot. Kun ohjelman selaimeen lataa jonkin www-sivun, lataa se automaattisesti kaikki sivuun liittyvät tyylitiedostot, jotka tulevat näkyviin listaksi oikeaan ylänurkkaan. Kuvan selainkuva näyttää siniseltä, koska elementtivalitsimellä on tehty valinta yhteen yläosan linkkiin.

Stylizer CSS-editori

Välilyöntiä painamalla saa selainikkunaan elementtivalitsimen, jolla saa näppärästi näkyviin elementtiin liittyvät tyylimääritykset.

Uusien elementtikohtaisten tyylien määrittäminen käy näppärästi valitsemalla elementtivalitsimella haluamansa elementin selaimesta, klikkaamalla haluamansa valitsimet valituiksi ja klikkaamalla lopuksi Make rule -painiketta. Tämän jälkeen voi siirtyä säätämään kyseisen elementin tyylitiedot kohdilleen. Tyylimuutokset näkyvät välittömästi ohjelman selainikkunassa. Stylizer tukee Firefoxia ja IE:tä ja siinä pystyy avaamaan näppärästi molemmat selaimet eri välilehtiin.

Kun tyylit on määritelty ja ne näyttävät hyvältä ohjelman selaimessa on aika painaa ctrl-s ja tiedosto tallennetaan automaattisesti palvelimelle, kunhan on määrittänyt ftp-yhteyden ja tiedostopolun oikein.

IE6

Pienenä puutteena joudun edelleen tarkistamaan tilanteen erikseen IETesterillä IE6:sta varten, sillä ohjelmisto ei ilmeisesti sitä tue. En ole tosin varman kuinka homma menee, jos koneessa ei ole muita IE-versioita kuin IE6. Mutta hei, IE6 taitaa olla jo kahdeksan vuotta vanha selain, joten joku roti hommaan. Ainoa syy miksi se on vielä hengissä on se, että web-suunnittelijat ovat jaksaneet tehdä sille sivuista oman version, eikä IE6-käyttäjien ole tarvinnut päivittää selaimiaan. Okei, osa ei osaa päivittää selaintaan, mutta heidänkin lapset tai viimeisteään lastenlapset osaavat. Niissä yrityksissä, joissa IE6 on vielä käytössä, ainoa syy päivittämättä jättämiseen on se, että sivut edelleen toimivat sillä. Tilanne muuttuisi kyllä välittömästi, kun tyytymättömät työntekijät urputtaisivat riittävästi toimimattomista sivustoista käyttötukeen. Onneksi tilanne alkaa jo näyttämään paremmalta ja kyseinen selain alkaa pikkuhiljaa hautautumaan muumioituneena sinne minne se kuuluukin eli historian lehdille. Olen itse kuluttanut lukemattomia tunteja korjaamalla ja selvittämällä IE6:een liittyviä ongelmia. Mittani alkaa olla täynnä, kuten varmaan huomaa.

Säästöä työajassa

Sitten takaisin asiaan eli Stylizer. Oma työni nopeutuu ainakin merkittävästi, kun osa vaiheista jää kokonaan pois. Alkuvaiheen HTML-vaiheet teen edelleenkin Programmer’s Notepadilla ja heitän palvelimelle WinSCP-ohjelmalla. Siirto hoituu automaattisesti tallentamalla.

Alla nykyinen suunnitteluprosessini:

1. Tehdään HTML(/PHP)-koodi Programmer’s Notepadilla
2. Tallennetaan HTML-tiedosto (sirtyy palvelimelle samalla)
3. Avataan sivu Stylizerin selaimella ja muokataan CSS-tyylit kohdilleen (lopputulos näkyy heti silmieni edessä Firefoxilla ja yhden klikin kautta IE:llä)
4. Tallennetaan tyylitiedosto (siirtyy automaattisesti palvelimelle)
5. Tarkistetaan sivun ulkoasu IE6:lla

En tiedä välittyykö tämän tekstin kautta ajansäästö, mutta voin oman kokemukseni perusteella sanoa, että työaikaa ja hermoja säästyy rutkasti.

Toki samankaltaiseen lopputulokseen saattaa päästä muillakin ohjelmistoilla, kuten Firefoxin lisäosalla Firebugilla ynnä muilla. Firebugille on edelleen oma käyttönsä ja sitä tarvitsen myös usein, mutta senkin käyttö on vähentynyt Stylizer myötä selvästi.

Kertokaapa te, arvon lukijat, omista työskentelytavoistanne ja käyttämistänne ohjelmistoista.

Oma hiljaiseloni johtuu erittäin kiireisestä syksystä ja hommia täytyy hieman priorisoida. Priorisoinni seurauksena blogien ylläpito on hieman kärsinyt, mutta eiköhän tämä tästä aikaa myöten taas piristy.

Kirjoittajille voisin suositella erinomaista Dark Room -tekstiedotoria, jonka full screen -tilassa kaikki turha poistuu ruudulta häiritsemästä. Yksinkertaisuudessaan loistava työkalu, jolla tämänkin juttu on kirjoitettu.

Kannattaa pysyä jatkossa kuulolla, sillä lähiaikoina on luvassa mm. MyCashflow-verkkokauppapalvelun uuden beta-version käyttökokemuksia. Uudessa versiossa on paljon lisäominaisuuksia, kuten esimerkiksi niin monesta verkkokauppaohjelmistosta puuttuva monikielisyyden tuki.

Täytyy myös yrittää jossain välissä löytää aikaa kirjoittaa jotain Magento-verkkokauppaohjelmistosta, sillä minulla oli kesällä harjoittelija hommissa tutkimassa Magenton soveltuvuutta suomalaisen verkkokaupan tarpeisiin.

Nämä siis tulossa, joten pysykää kanavalla ja tilatkaa vaikkapas Verkkokauppaopas.comin syöte. Syötteenlukuohjelmaksi suosittelen Google Readeria.