Blogi Haltuun.Net

Bloggerin uusia ominaisuuksia

noreply@blogger.com (Unknown) — Sat, 25 Aug 2012 20:16:00 +0000

Koska pidin pitkähkön tauon blogin kirjoittelusta on blogger ehtinyt taas uudistua. Siksi on aika kertoa siitä mitä uutta on jo olemassa ja mitkä ominaisuudet ovat vasta rantautumassa perus käyttäjille.

blogger.fi

Muutos iski kuin varkain jokin aika sitten, enkä edes itse noteerannut tätä kyseistä muutosta aluksi, sillä käytössäni ei ole blogger osoite vaan oma domain tunnus. Tämä tietenkään ei perus bloggaajan arkeen vaikuttanut millään tavalla, tai näin olisi ainakin syytä toivoa...

Muutos ei tietenkään tarkoittanut etteikö tästä uudistuksesta tullut harmaita hiuksia monille hakukoneoptimoinnista kiinnostuneille blogger bloggaajille, sillä domain osoitteet muuttuivat aivan tyystin. Vanhasta bloginnimi.blogger.com osoitteesta löytyneet blogit alkoivat yhtäkkiä löytyä monista maakohtaisista osoitteista, riippuen sivustolle sattuneen surffailijan omasta kotimaasta. (suomalaisille .fi ruotsi .se jne... )

Hakukoneoptimointi "gurut" järkyttyivät tästä ominaisuudesta ja osa pelkäsi heidän blogger blogiensa sijoituksen romahtavan hakukoneessa. Tämä ei ole täysin turha pelko sillä muutoksen jälkeen blogger blogisi löytyy lukuisista maakohtaisista blogger osoitteista. (blogger.com, blogger.fi, blogger.se jne..) Hakualgoritmit on rakennettu rankaisemaan ns. duplicate content sivustoja ja tämä saattaa vieläkin johtaa siihen että blogger blogeja rankaistaan sellaisesta joka ei ole heidän itsensä aikaansaannosta.

Mainittakoon sellainenkin seikka että me jotka käytämme omaa domaintunnusta vältyimme näiltä ongelmilta kokonaan. Onneksi.

Hakukuvaus ja Pysyvä linkki

Nämä kaksi ominaisuutta ovat olleet jo hyvän aikaa itselläni käytössä, sillä kuulun blogger testaajiin jotka pääsevät käsiksi uusiin ominaisuuksiin ennen perus blogger käyttäjää. Nyt nämä ominaisuudet alkavat rantautua myös koko kansan huviksi joten on aika kertoa hieman siitä mistä on kysymys.

Pysyvä linkki

Blogger blogeissa on iät ja ajat ollut kirjoituksen url rakenne seuraava: blogisinimi.blogger.fi/vuosi/kk/kirjoituksen-otsikko.html Tämä on kuitenkin jäämässä eräällä tavalla historiaan, sillä tulevaisuudessa voit aivan itse määritellä minkä niminen pysyvä linkki blogger kirjoitukselle asetetaan. Tämä on odotettu ja erittäin mieluisa ominaisuus jonka ansiosta oman blogger bloginsa hallinta parantuu entisestään. Ominaisuuden ansiosta blogger ottaa jälleen yhden askeleen lähemmäs WordPress alustan monipuolisuutta ja parantaa hakukoneoptimointi mahdollisuuksia blogger alustalla entisestään.

Pysyvä linkki määritellään kirjoitusta kirjoitettaessa viestiasetukset palkista (kirjoitusalueen oikealla puolella).

Hakukuvuaus

Blogger blogien toinen erittäin positiivinen uutuus on mahdollisuus määrittää hakukuvaus jokaiselle kirjoitukselle erikseen. Tämä julkaistaan hakukoneissa ja mm. silloin kun kirjoituksesi jaetaan facebook tai vaikkapa google+ palveluun. Kannattaakin miettiä mahdollisimman myyvä ja mielellään myös kuvaava hakukuvaus omille blogikirjoituksillee, tällöin oman blogisi tekstit jatkavat itse markkinointiaan sen jälkeen kun ne on jaettu sosiaalisen median eri palveluihin.

Ennen kirjoituksen hakukuvaus oli periaatteessa muutama ensimmäinen sananen blogikirjoituksesta ja tämä johtikin moniin ongelmiin, varsinkin omalla kirjoitustyylilläni ja asettelulla hakukuvaus vastasi vain harvoin itse blogikirjoituksen sisältöä. Tämän avulla on siis helppoa ja nopeaa varmistaa että kirjoitus saa tarvitsemansa huomion hakupalveluissa. Tämä kuten edellinenkin uudistus lisätään blogitekstiä jo kirjoitettaessa: oikealta sivupalkista kohdasta "Hakukuvaus".

Loppusanat

Blogger blogialusta jatkaa edelleen uudistumistaan tasaisen tappavalla tahdilla ja tämä tietenkin takaa töitä minulle sekä entistä monipuolisemman bloggaus kokemuksen kaikki blogger blogialustaa käyttäville. Toivottavasti nämäkin blogger uudistukset tulevat ahkeraan käyttöön sillä kun uudistuksista yleensä puhutaan ovat nämä parhaimmasta päästä mies muistiin.

Oma teema! -4-

noreply@blogger.com (Unknown) — Sat, 25 Aug 2012 11:07:00 +0000

Tapahtunut edellisissä osissa: Perus internetsivu muokattiin soveltuvaksi blogger blogialustalle. Tämän jälkeen tutustuttiin bloggerissa <div> elementit korvaavan <b:section> elementin toimintaan. Viimeisimmässä kirjoituksessa hyökkäsimme hieman syvemmälle blogin lähdekoodin sisuksiin ja otimme käsittelyyn <b:widget> elementin ja siihen käypät atribuutit. Nyt jatketaan siitä mihin edellisessä osassa jäätiin.

Voihan Widget

Kuten jo tiedetään b:section elementti käyttäytyy kuten div elementti perus html kielessä. Sama toimintaperiaate jatkuu myös b:widget elementissä. Tämä tarkoittaa sitä että CSS määrittelyt toimivat myös tässä elementti osassa. Sen lisäksi b:widget elementti toimii myös "säiliönä" tiedolle aivan kuten div elementti perus internetsivuissa tai b:section elementti bloggerissa. Nyt lähdemmekin lähemmin tutustumaan siihen mitä nämä b:widget elementit sisältävät ja samalla opimme hieman lisää siitä miten bloggeriin näitä kyseisiä widgettejä luodaan.

Widgettien tarkoituksena oli siis "hakea" tieto jostain ja esittää se asetusten mukaisesti halutussa muodossa. Tämä tiedon haku tulee kuitenkin määrittää itse b:widget elementin sisällä. Eli meidän tulee kertoa lähdekoodin avulla mitä tietoa* haetaan. (*esim blogikirjoitukset tai vaikkapa koko blogin otsikko).

Edellisen osan pelottava 'avattu' header widgetti sisälsi kaiken sen tiedon jonka blogger alusta tarvitsee jotta asetuksissa määritetty otsikkotieto näkyy oikealla paikallaan halutussa muodossa. Tietenkään header widgetissä ei lähdekoodin puolella määritelty otsikon asetuksia, vaan siinä ehtolauseiden avulla käskettiin bloggeria vertaamaan otsikko asetuksiin ja tuottamaan oikean näköinen otsikko.

Tästä lähdekoodi hirvityksestä voidaan kuitenkin oppia jotain widgettien toiminnasta. Lähdetään siis liikkeelle notepad++:n puolelta. Avaa uusi tyhjä sivu auki notepad++:n ja kopioi ja liitä tämä header osan 'avattu' lähdekoodi siihen.

Tämän jälkeen tallenna tiedosto haluamallasi nimellä. (Muista valita tiedostomuodoksi eXtensible markup language)

Include everything

Jokainen widget koostuu vähintään yhdestä osasta, joita kutsutaan nimellä includable <b:includable>. Tämä includable toimii määritteenä tiedolle jota widgetissä näytetään.

Jokainen includable määritelmä vaatii uniikin id:n (huom: yllä oleva b:includable 'main' on aina pakollinen jokaisessa widgetissä). Header osamme sisältää yhteensä kolme includable määritettä. Includable main määrityksen lisäksi löytyvät vielä includable: title ja includable: description.

Header widgetissä ensimmäinen <b:includable id:'main'> toimii säiliönä ehtolauseille jotka vertaamalla asetuksissa määritettyyn otsikkotyyppiin lopulta saavat aikaan halutun lopputuloksen. Ellei bloggerin otsikko -osassa olisi tarvetta ehtolauseille blogin otsikolle riittäisivät määrityksiksi pelkästään <includable id:'title'> (määritys näyttää blogin otsikko) ja <includable id:'description'> (määritys näyttää blogin kuvaus). (Tässä kappaleessa on pieni tahallinen asiavirhe, mikä se on?)

<b:includable>On määritelmä joka voitaisiin suomentaa myös 'sisällytettävä'. Sisällytettävä on siinä mielessä kuvaava sanamuoto sillä includable elementin sisälle tuleva määritys on muotoa <b:include>, joka voidaan suomentaa sisällytä.

Tarkastellaan hieman alinta includable määritystä blogin header widgetissä.

Tässä includable elementissä määritetään näytettäväksi, kuten jo id:stä voi huomata, blogin kuvaus (engl. description), joka näkyy blogissa jos se asetuksista on laitettu näkyväksi. Kuten jo yllä sanoin jokaisen <b:includable> elementin sisäisen tiedon määrittää <b:include> ja tämä tieto on muotoa <data:datannimi />. (<data:DatanNimi /> on sisin elementti koko bloggerin sisällössä.)

Koko komeus
Nyt alkaa olla aika pienen kertauksen ennekuin päämme lopullisesti räjähtää tästä kaikesta. Eli tältä näyttää bloggerin lähdekoodin perus rakenne että saadaan näkyviin yhden vaivaisen widgetin sisältö:

<b:section>
   <b:widget>
<b:includable>
    <b:include>
   <data:datannimi />
</b:include>
   </b:includable>
     </b:widget>
</b:section>

Tästä koko komeudesta puuttuvat tietenkin kaikki atribuutit joita on jo käsitelty ja haettavan datan tiedot. Tätä mahdollista "dataa" blogger tarjoaakin yli oman tarpeen. Tässä muutama esimerkki:

Datan-nimi	Käyttö
title (*)	Blogin otsikko
homepageUrl (*)	Etusivun osoite
pageType (*)	Sivun tyyppi
pageTitle (*)	Tämänhetkisen sivun otsikko
url (*)	Tämänhetkisen sivun osoite
dateHeader	Kirjoituksen päivämäärä
comments	Tämänhetkisen kirjoituksen kommmentit
feedLinks	Syötteiden linkit
olderPageUrl	Vanhemman kirj. osoite (linkit)
newerPageTitle	Uudemman kirjoituksen otsikko (linkit)

(*) merkityt ovat globaaleja data nimiä joita voidaan käyttää missä tahansa blogin osassa minkä tahansa widget tyypin (header, html, blog jne.) kanssa. Jokaisella widget tyypillä on vielä omia data tietojaan ja yhteensä näitä erilaisia data tietueita taitaa olla noin satakunta eli aivan varmasti riittävästi.

Loppusanat

Nyt kun tiedämme jo aika paljon blogger blogin rakenteesta on aika luoda jotain uutta omaan blogiimme. Eli luodaan sinne ikioma widget! Tämä kuitenkin tapahtukoon vasta seuraavassa osassa ettei kirjoitusten tietomäärä ylitä ns. järkeenkäypää rajaa. Jos sinulla on kysyttävää mistä tahansa tämän artikkelin kohdasta tai haluat arvata mikä asiavirhe tämän kirjoituksen kappaleesta löytyy jätä kommenttia!

Oma teema -3-

noreply@blogger.com (Unknown) — Fri, 17 Aug 2012 21:42:00 +0000

Nyt on aika iskeä lihaa luiden ympärille. Blogin runkona toimivien b:section elementtien sisälle laitettavien widgettien ja gadgettien määrä on huima. Pelkästään blogger koodin puolella widget tyyppejä on 13 ja erilaisia gadgetteja joita blogiinsa voi lisätä on paljon enemmän. Gadgettien määrä lasketaan todennäköisesti kymmenissä ellei sadoissa.

Widget tyypeistä

Blogin toiminnan kannalta merkittävimmät widget tyypit ovat 'Blog' ja 'Header' kaikki muu on ns. kuorrutusta kakun päällä. 'Blog' widgetti on toiminnaltaan hyvin yksinkertainen se toimii ikkunana kaikille julkaistuille blogikirjoituksillesi. Header widget puolestaan toimii blogisi otsikko -alueena ja saattapa se sisältää myös lyhyen kuvauksen blogistasi.

Kuten jo mainitsin blogger blogin lähdekoodi perustuu xml:n. Tämä tarkoittaa sitä että nämä lähdekoodissa olevat widgetitkin toimivat oikeastaan pelkkinä kehotuksina hakea jokin tieto jostakin ja 'tulostaa' se tietokoneen näytölle luettavassa muodossa. Tämän huomaa varsinkin blogikirjoituksista helposti: Kirjoitukset tallentuvat erilliseen xml tiedostoon josta tieto vain haetaan 'Blog' widgettillä esitettäväksi tiettyjen asetusten mukaisesti.

Siinä missä b:section elementti toimi kuten div-elementti html kielessä samanlaisia ominaisuuksia löytyy myös bloggerin widget elementistä b:widget. Bloggerin widget elementti b:widget sisältää kuitenkin vielä suuremman määrän erilaisia atribuutteja, joten erilaisia säätömahdollisuuksia on todella paljon. Tämän kaiken lisäksi b:widget elementti tottelee myös ehtolauseita sekä jossain määrin myös erilaisia css määrittelyjä joten aivan varmasti jokainen voi rakennella ihan oman näköisensä blogin.

Lähdetään kuten tavallista notepad++ ohjelmalla liikkeelle ja avataan blogimme lähdekoodin xml tiedosto. Etsi blogistasi jälleen kohta:

Tällä kertaa siirrymme hieman syvemmälle ja tarkastelemme header osan b:widget elementtiä. Kuten b:section elementissä, tulee myös widget elementissä olla määritettynä jokaiselle widgetille oma id. Tämän tulee olla uniikki jotta mahdolliset muokkaukset vaikuttaisivat ainoastaan haluttuun widgettiin.

ID atribuutin lisäksi widgetistämme löytyy kohta locked:'true'. Tämä on lähdekoodin puolelle lisättävä 'varotoimi' jolla estetään widgetin poisto liian helposti. (lukittuja widgettejä kun ei voi poistaa blogger asetusten ulkoasuvalikon kautta). Vastaavasti widgetit joissa atribuutti on asetettu muotoon locked:'false' voidaan poistaa muokkaamatta blogin lähdekoodia.

Header widgetin määrityksissä löytyy myös title joka toimii pelkästään widgetin 'nimenä' (ei pidä sekoittaa id tai type atribuuttiin), sekä atribuutti type:'header'.

Tyyppi atribuutti on id:n ohella toinen pakollinen määrittely joita b:widget elementistä tulee löytyä, näitä widget tyyppejä on yhteensä 13 ja tässä käytössä yksi niistä eli 'header'. Kaikki widget tyypit löydät alla olevasta listasta ( suurin osa widget tyypeistä on bloggerin omien gadgettien tarpeisiin tehtyjä ja ns. 3. osapuolen widgetit ovat usein tyyppiä HTML):

BlogArchive (bloggerin blogiarkisto gadget)
Blog (blogikirjoitukset)
Feed (syöte)
Header (Otsikkoalue / Ylätunniste)
HTML (mahdollistaa html:n ja javascriptien käyttämisen)
SingleImage (kuva)
LinkList (linkkilista gadget)
List (lista)
Logo
BlogProfile (Blogin profiili - ei sama kuin google+ profiili nykyään)
Navbar (normaalisti blogin yläosassa oleva blogger navi palkki)
VideoBar (video - gadget)
NewsBar (uutiset - gadget)

Widgetin atribuutit (määritykset)

Type, locked, title ja id eivät kuitenkaan ole ainoat atribuutit joita b:widget elementin määrityksiin voidaan asettaa. Siitä syystä olen koostanut listan kaikista b:widget atribuuteista selityksineen:

Pakollinen atribuutti
Tulee olla uniikki. Pelkistä numeroista ja kirjaimista koostettu id (ei ääkkösiä)
Käytetään esim css koodissa ulkoasua muokattaessa

Type

Pakollinen atribuutti
Jokin yllä mainitusta
Määrittää widgetin toiminnan

Locked

true tai false
Vaikuttaa widgetin poistamiseen blogger asetuksissa Ulkoasu välilehdellä

Title

Widgetin nimi
Voi olla mikä vain, vaikka yleensä käytetään kuvaavaa nimeä (esim Linkkilista)

pageType

Määrittää millä sivuilla ko. widget näytetään
Voi olla muotoa: all, archive, main tai item (esim. pageType:'main' näkyisi ainoastaan blogin etusivulla)

mobile:

true tai false
näytetäänkö ko. widget mobiililaitteissa

Widgettien salattu sisältö

Notepad++:ssa blogimme lähdekoodissa tämä kaikki näyttää kovin siistiltä ja yksinkertaiselta. Mutta ei hätää sillä onneksi saamme tästä kaikesta huomattavasti sekavampaa ottamalla lähempään tarkasteluun bloggerin puolella blogimme lähdekoodin. Meidän käyttämämme lyhyt header widget määritelmä muuttuu nimittäin varsinaiseksi hirviöksi 'avattuamme' sen sisällön kokonaan. (Laajenna widget-malleja)

Oma notepad++:n puolelta löytyvä header widgetimme on lyhyt ja ytimekäs:

Bloggerista löytyvä aivan sama koodi ns. avattuna:

Pelottavaa eikö totta. Onneksi meidän ei tarvitse kajota sen suuremmalti header osion toimintaan. Vaan voimme hoitaa itsellemme merkittävät muokkaukset blogger blogin css osassa. Eli vaikuttaa ainoastaan siihen miltä kyseinen widget näyttää blogissa vierailevan henkilön silmissä. Niitä joita nyt sattuu kiinnostamaan mitä tuo ylläoleva 'hirvitys' sisältää:

Ehtolauseiden avulla blogger määrittelee millainen blogin otsikkotyyppi on käytössä, eli näytetäänkö (asetusten mukaan) Blogin otsikon tilalla kuva, kuva otsikon takana, otsikko ja kuvaus, onko kyseessä mobiili-laite jolla selaillaan blogia jne. Perus bloggaaja asettaa vain blogin otsikkoasetuksista nämä itselleen mieluisaksi ja blogger alusta hoitaa loput. (katso alla oleva kuva).

Huomionarvoista tässä kaikessa on kuitenkin se että voisimme, jos kokisimme tarpeelliseksi, koodata myös alusta loppuun itse vastaavanlaisen blogin otsikkoalue widgetin. Eli jos sinulla on yhtäkkiä pakottava tarve saada bloggerin otsikkoalueen toiminta muutettua erilaiseksi kannattaa kysyä neuvoa, saatan jopa jotain osata kertoa asiaan liittyen.

Loppusanat

Tässä oli ensimmäinen pintaraapaisu widgettien ihmeelliseen elämään blogger blogeissa. Kommenteista olen voinut lukea että niitä ei ole, eli siitä voidaan vetää kaksi hyvin erilaista johtopäätöstä: Joko artikkelisarjani blogger teeman luomisesta on tähän asti ollut niin täydellinen että kysymyksiä ei vielä ole herännyt tai sitten aihe ns. ampuu yli hilseen ja kysyjä ei tiedä mistä aloittaa.

Kaikesta huolimatta niille jotka ovat onnistuneet vielä toistaiseksi seuraamaan tätä artikkelisarjaa: Seuraavassa osassa tutustumme widgettien maailmaan vielä hieman lisää. Mukavaa eikö totta?

Oma teema -2-

noreply@blogger.com (Unknown) — Thu, 16 Aug 2012 13:11:00 +0000

Aika palata taas oman teeman kimppuun. Ensimmäisessä osassa pääsimme jo hyvään vauhtiin, eli saimme oman teemamme näkyviin bloggerissa. Edellinen artikkeli jätti kuitenkin paljon kysymysmerkkejä, sillä siinä ei selitetty bloggerin lähdekoodin ominaisuuksista juuri sanastakaan vaan iskettiin vain blogger blogi normaalin internetsivun päälle. Siitä syystä onkin aika lähteä tutustumaan hieman tarkemmin siihen miltä uusi uljas blogimme näyttää lähdekoodin puolelta katsottuna.

b:section määritykset

Lähdetään siis jälleen liikkeelle Notepad++ ohjelman puolelta ja avataan blogimme ulkoasun xml tiedosto ja otetaan tarkasteluun blogin otsikko osa. Etsi siis lähdekoodista kohta:
Bloggerissa erilaiset elementit määritellään komennolla <b:section...></b:section> . Jokainen b:section sisältää erilaisia määritelmiä (attribute) joiden avulla kyseisen elementin toimintaa ja sisällön toimintaa määritellään.

Näitä määritelmiä ovat:

id atribuutti on pakollinen
id:ssä määritellään elementille nimi.
nimi tulee olla uniikki ja saa sisältää ainoastaan numeroita ja kirjaimia (ei ääkkösiä)

class

class on vapaaehtoinen määritelmä
määrittää blogin elementin luokan
blogger tunnistaa muutamia class määritelmiä: header, sidebar, footer, navbar ja main. Blogger myös osaa sijoittaa näiden avulla sisällön oikealle paikalleen teemaa vaihdettaessa jne.

maxwidgets

maxwidgets on vapaaehtoinen määritelmä
määrittää kuinka monta widgettiä kyseisen elementin sisälle voidaan asettaa.

showaddelement

showaddelement on vapaaehtoinen määritelmä
määrittää näytetäänkö blogger asetuksien ulkoasuvalikossa lisää gadget linkki elementin yhteydessä.
kaksi vaihtoehtoa (kyllä/ei): 'yes' 'no'

growth

growth on vapaaehtoinen elementti
määrittää kuinka elementin sisälle lisätyt widgetit sijoittuvat
kaksi vaihtoehtoa: 'horizontal' tai 'vertical'
horizontal: vierekkäin, vertical: päällekkäin

Näiden avulla siis määritellään miten elementti (b:section) käyttäytyy.

Katsotaan mitä oman mallimme header elementissä määritellään:

Eli class='header' määrittelee kyseisen b:section elementin header tyyppiseksi. Nimeksi tälle osalle on annettu header (id='header') vaikka se voisi yhtä hyvin olla vaikka 'otsake' (id='otsake'). Osion widgettien määräksi on asetettu yksi (maxwidgets='1') ja siihen ei voi yrittää lisätä uusia (showaddelement='no'). Joskus näkee blogeja joissa header osassa kaksi eri widgettiä. Blogin otsikon ja kuvauksen lisäksi saattaa niistä oikealle löytyä esim banneri tai jokin muu vastaava. Silloin jouduttaisiin muuttamaan header osion määritelmiä soveltumaan tälläiseen asetteluun. Esimerkiksi tähän tapaan:

Tämän kaltaisella asettelulla header osassa olisi tila kahdelle widgetille joiden asettelu on vierekkäin (growth='horizontal').

b:section: säiliö widgeteille

Nyt kun olemme päässeet vauhtiin lähdekoodin tarkastelussa on aika heittää lisää vettä myllyyn. Blogger asettelussa b:section on siis elementti jonka paikan voi itse määrittää blogin lähdekoodissa. Jokaisen b:section elementin sisälle voidaan asetella erilaisia widgettejä <b:widget.../> ja nämä widgetit ovat itseasiassa se blogin osa joka näkyy blogissa vieraileville ihmisille. Widget tyyppejä joita bloggerin lähdekoodissa voi määritellä on muutamia: BlogArchive, Blog, Feed, Header, HTML, SingleImag, LinkList, List, Logo, BlogProfile, Navbar, VideoBar ja NewsBar.

Näiden "widgettien" lisäksi on olemassa vielä toinen samankaltainen ryhmä erilaisia näytettäviä blogin osia, joita blogger kutsuu "gadgeteiksi". Lähdekoodissa nämä kuitenkin näyttävät aivan samalta (molempia kutsutaan koodilla b:widget). Gadgetteja voi itse asettaa helposti bloggerin Ulkoasu valikosta haluamiinsa kohtiin, olettaen että sinulla on määriteltynä b:section siihen kohtaa blogia johon ajattelit gadgetin asettaa. Tämä saattaa kuulostaa monimutkaiselta mutta itseasiassa ei sitä ole. Katsotaan hieman tätä seuraavaa kuvaa:

Harjoitus blogissamme on siis yhteensä 4 b:section elementtiä. Näistä kahdessa, eli sidebar ja footer, on mahdollisuus lisätä uusia gadgetteja. Jos tilanne olsi se että haluat lisätä gadgetin johonkin muualle joudut lisäämään uuden b:section määritelmän tähän kohtaa blogiasi.

Kannattaa kuitenkin ottaa huomioon se että internetsivuissa on rajallisesti tilaa lisätä uusia elementtejä ja ainoat järkevät tyhjät tilat sijaitsevat tässä mallissa b:section id="main" elementin vasemmalla ja b:section id="sidebar" oikealla puolella. Tilan puute saattaa iskeä etenkin silloin kun sivulla halutaan olevan paljon materiaalia esillä yhtäaikaisesti.

b:section & CSS

Joku on jo saattanut huomatakkin b:section elementti toimii hyvin samalla tavalla kuin normaali div elementti perus internetsivuissa. Tämä on viimeistään siinä kohtaa varmaa kun selviää: Selaimen törmätessä internetissä blogger blogiin blogger alusta "kääntää" kaikki b:section elementit selaimia varten div elementeiksi. Tästä syystä b:section elementtejä voidaan muokata käyttäen css muotoiluja aivan kuten tavallisia div elementtejä.

Samasta syystä emme myöskään joutuneet ensimmäisessä osassa tekemään minkänlaisia muutoksia omaan css koodiimme. Riitti ainoastaan kun kopioimme css määritykset blogin xml tiedostoon oikealle paikalleen. Tulevissa osissa tutustumme tarkemmin siihen millaisia css määritelmiä voidaan b:section elementeille sekä muille blogger blogin osille asettaa. Ennenkuin ehdimme css muotoiluihin asti pitää kuitenkin jatkaa koodin läpi kahlaamista ainakin vielä yhden kirjoituksen verran.

Loppusanat

Tässä oli siis lyhyt oppimäärä siitä mikä on bloggerin lähdekoodin mystinen b:section ja miten sen määrittelyt vaikuttavat blogiin ja toiminnallisuuteen. Seuraavassa osassa siirry askeleen syvemmälle ja lähdemme tutustumaan siihen mitä b:section elementin sisälle asetettavat widgetit ovat ja miten niitä määritellään.

Kuten tavallista, jos sinulla ilmenee kysyttävää mistään tämän artikkelin kohdasta tai haluaisit lisää tietoa jonkin kohdan toiminnasta omassa harjoitusteemassasi jätä kommenttia.

Oma teema! -1-

noreply@blogger.com (Unknown) — Mon, 13 Aug 2012 23:33:00 +0000

Tässä artikkelissa on käytössä uusi ominaisuus "Syntaxhighlight" joka helpottaa lähdekoodin jakamista. Viemällä hiiren kursorin lähdekoodipätkän yläpuolelle avautuu oikeaan ylänurkkaan pieni valikko josta valitsemalla "View source" (ensimmäinen vasemmalta) avautuu uuteen ikkunaan helposti 'maalattava' ja kopioitava muoto kyseisestä koodin pätkästä. Tätä ominaisuutta tullaan käyttämään myös myöhemmissä BlogiHaltuun.net kirjoituksissa.

Nyt on aika lähteä liikenteeseen siinä mitä jo edellisessä kirjoituksessani pohjustin eli oman teeman luomisessa. Kannattaa siis käydä ensin lukemassa pohjustus täältä, niin tiedät missä mennään.

Helpottamaan minun sekä kaikkien tähän projektiin osallistuvien lukijoiden elämää kaikki kysymykset ja vastaukset koostetaan erillisiksi artikkeleiksi tukemaan tätä pääasiallista artikkelisarjaa. Jos et halua omaa kysymystäsi artikkeliin mainitse siitä kysyessäsi.

Käyttöön otettakoon myös tällä ilmoituksella Dropbox palvelu. Kaikki artikkeleihin liittyvä oheis materiaali on ladattavissa Dropbox linkeistä. Ennenkuin kukaan pelästyy palvelu on ilmainen. Eli kukaan ei joudu repimään kukkaron nyörejä auki.

Dropbox palvelua hyödynnetään myös mahdollisissa ongelmanratkonta tilanteissa, koska on selkeämpää tarkastella tiedoston lähdekoodia verrattuna internetselaimen 'tulostamaan' lähdekoodiin. Ne kun lähdes poikkeuksetta blogger blogeissa eroavat toisistaan. Koska palvelu on muutenkin hyödyllinen kehotan kaikkia lukijoitani rekisteröitymään kyseiseen palveluun täällä.

Olen myös tehnyt pienen sivupohjan josta rakentaminen aloitetaan. Sivupohja on perus HTML kielinen internetsivu joka sisältää kuvan, sivu taustan, index.html tiedoston ja malli.css tiedoston. Tätä käytetään pohjana omalle blogger teemalle ja näin ensialkuun myös vertailukohtana siihen miten blogger blogi eroaa tavallisesta internet sivusta. Tiedoston voit ladata tästä Dropbox linkistä.

1. Teemalle alusta

Ensimmäinen vaihe ennen lähdekoodin kimppuun hyökkäämistä on tietenkin perustaa blogi. En ryhdy nyt neuvomaan miten uusi blogi bloggerissa tehdään vaan oletan sen jo olevan hanskassa. Tämä uusi blogi perustetaan siitä yksinkertaisesta syystä ettei tarvitse häiritä oman bloginsa lukijoita silläaikaa kun virittelee omaa teemaa kuntoon.

Tälläinen 'harjoittelu' -blogi tulee myös tarpeeseen myöhemminkin jos haluaa testailla uusia ominaisuuksia ennenkuin ottaa niitä käyttöön omassa blogissaan. Teeman malliksi voit valita perinteisen "Simple" mallin. Blogin luomisen jälkeen on aika poistua hetkeksi Bloggerista ja siirtyä Notepad++ ohjelmaan ja lähdekoodin kimppuun.

2. Notepad++ käyttöön

Nyt lähdekoodin kimppuun. Purettuasi tämän perus HTML pohjan jonka rakensin on aika avata index.html tiedosto Notepad++ ohjelmalla ja tarkastella hieman mitä se sisältää. Pyrin pitämään sen mahdollisimman yksinkertaisena ja sisällytin siihen ainoastaan muutaman osan. Sivusto koostuu siis neljästä pääosasta:

Reunus -osa
Otsikko -osa
Leipäteksti -osa
Alatunniste -osa

Tunnistamisen helpottamiseksi olen lisännyt <--! kommentteja --> tähän tiedostoon. Nämä kommentit eivät näy lopullisessa sivussa vaan internetselain ohittaa nämä automaattisesti. Kommentit ovat yleinen tapa ilmoittaa internetsivun sisällöstä ja siitä mitä kukin koodin osanen sisältää tai saa aikaan.

Internetsivussa tapahtuu kuitenkin jo paljon ennen kuin itse "näytettävä" osa koodista alkaa. Sivun osiossa joka alkaa tagilla <head> on oma tärkeä roolinsa internet sivuissa. Tässä "head" osassa voidaan esimerkiksi kertoa selaimelle muista tiedostoista joita tarvitaan sivun näyttämiseen selaimissa oikein. Näitä osia voivat olla erilaiset tyylitiedostot (.css), Javascript koodit (.js) jne.

Ainoa pakollinen head osaaan sijoitettava elementti on <title></title> Tämä on yksinkertaisuudessaan sivuston nimi/ nimi ja kuvaus. Tämä title elementin sisältämä tieto tulee tarpeeseen hakukoneille, lisästtäessä sivu kirjanmerkkeihin ja silloin kun surffaat internetsivulle näkyy title elementistä löytyvä tieto selaimen työkalurivillä.

Yksinkertaisuudessaan internetsivu voisi siis näyttää tältä:

Kuten huomata saattaa ei oma mallimme poikkea kovinkaan paljon yllä olevasta esimerkistä. Merkittävimmät erot ovat kosmeettisia, monessakin mielessä. Ensimmäinen merkittävä ero on se mitä löytyy head osasta. Tämä kun sisältää linkin tyylitiedostoon (malli.css).

Tyylitiedostoon palaamme hieman myöhemmin joten jatketaan tutustumista index.html tiedostoon vielä hetkisen ajan. Head osasta siirrytään eteenpäin eli <body> osaan. Body elementtien sisälle sijoitetaan kaikki se tieto ja elementit jotka halutaan näkyvän ihmisille jotka vierailevat internetsivuillasi.

Oman mallimme body elementti sisältää 4 pää osiota jotka on erotettu toisistaan. Helpoiten tämä onnistuu käyttämällä <div> </div> elementtiä. Yksinkertaistettuna voidaan kuvitella että jokainen DIV elementti on säiliö jonka sisälle voidaan asettaa sisältöä. DIV elementin sekä div elementin sisällön tyylit voidaan määrittää tyylitiedostossa minkä näköiseksi halutaan. Tämä siis muodostaa lopulta sivuston ulkoasun.

Omasta mallistamme body elementin sisältä löytyvät "container", "page-header", "page-body" sekä "page-footer" nimiset div elementit. Nämä on aseteltu tyylitiedoston avulla siten että ne muodostavat yhdessä järkevän kokonaisuuden ja helposti ymmärrettävän pohjan omalle sivullemme. (Kts alla oleva kuva)

"Container" osa on oikeastaan pelkkä reunus joka rajoittaa sivun sisältöosan leveyttä. Internetsivuissa ei ole tarpeellista läheskään aina käyttää koko sivun leveyttä hyödykseen. Vaikka poikkeuksiakin löytyy kuten BlogiHaltuun.net:in ylin valikko joka alkaa aivan vasemmasta reunasta jatkuen täysmittaisena oikeaan laitaan.

"Page-header" osa on tarkoitettu Blogin nimeä, lyhyttä kuvausta ja ehkä myös mahdollista valikkoa varten. Verrata voit esimerkiksi bloggerin valmiisiin mallipohjiin, joista löytyy juuri blogin nimi ja kuvaus header osasta.

"Page-Body" on leipäteksti osa johon sijoitetaan normaalisti kaikki kirjoitukset. Usein myös body osan oikealle tai vasemmalle puolelle sijoitetaan sivupalkki. Tätä ei kuitenkaan esimerkki mallissamme ole.

"Page-Footer" on alatunniste alue, johon asetetaan yleensä kopiointia koskevia merkintöjä sekä sivuston/ tekijän tiedot.

Nyt kun vihdoin pääsimme sivun lähdekoodin loppuun on aika siirtyä seuraavaan osioon, eli niihin pieniin mutta merkittäviin eroihin joita blogger blogilla on verrattuna normaaleihin internetsivuihin.

3. HTML vs. XML

On tehtävä selvä pesäero blogien ja perus internetsivujen välillä. Perus internetsivu on pahimmillaan staattinen täysin muuttumaton möhkäle jonka joku on voinut luoda 5 vuotta sitten. Blogi pyrkii olemaan alati muuttuva kokonaisuus joka päivittyy eli on 'dynaaminen'. Blogger blogi ei tee tähän kaavaan poikkeusta. Siitä syystä blogger blogi onkin rakennettu hyvin eri tavalla tavalliseen internetsivuun verrattuna.

Merkittävin Blogger blogissa vierailijalle näkymätön ero on se että Blogger blogien lähdekoodi on kirjoitettu xml kielellä. XML eli eXtensible Markup Language on tarkoitusperiltään hyvin erilainen verrattuna perinteiseen HTML:n (HyperTextMarkupLanguage) .

Se missä HTML keskittyy siihen miltä data (esim internetsivu) näyttää on XML kehitetty ohjelmisto ja 'rauta' riippumattomaksi työkaluksi datan siirtelyyn ja tallennukseen. Tästä syystä näillä kahdella on hyvin paljon eroa ja se aiheuttaakin usein päänvaivaa blogger bloggaajille.

Tässä vielä muutamia eroavaisuuksia:

HTML ei erota isoja ja pieniä (abc = ABC ) kirjaimia toisin kuin xml (abc ≠ ABC )
HTML:ssa on vain tietyt määritykset XML sallii käyttäjän luoda omia
HTML on staattinen XML dynaaminen (johtuen juuri käyttötarkoitus erosta)
XML kieli ei salli 'huonoa' koodia. HTML ei koodin pikku puutteista välitä

Ennenkuin saan vihaisia kommentteja nörteiltä: Vaikka puhunkin tässä tapauksessa HTML:n ja XML:n eroista en ole unohtanut nykyistä "standardia" internetsivuissa joka on kait jossain määrin xHTML. Se ottaa kyllä tehokkaasti mallia XML:stä muun muassa vaatien käyttäjältä puhtaampaa koodia lopetuksineen jne.

Näistä eroavaisuuksista johtuen emme voikkaan käyttää sellaisenaan luomaani sivupohjaa vaan se vaatii muutoksia toimiakseen blogger blogialustassa eli seuraavaksi lähdetään muokkaamaan pohjaa blogger ystävälliseksi.

4. Pohjasta Bloggeriin

Siirrytään takaisin index.html dokumentin alkuun. Blogger saisi sätkyn jos yrittäisimme vaihtaa blogin lähdekoodin tähän viritelmään. Blogger ei tajua että kyseessä on normaali internetsivu, koska sitä ei ole rakennettu sitä ymmärtämään. Siksi joudummekin muuttamaan omaa koodiamme pala palalta vastaamaan bloggerin xml vaatimuksia.

Ennenkuin tehdään yhtään muutosta lähdekoodiin pitää tehdä se merkittävin muutos eli tallentaa tiedosto xml muotoon. Tämä onnistuu suoraan Notepad++ ohjelmalla: eli valitse Tiedosto -> Tallenna nimellä -> eXtensible markup language file . (Nimeksi voit antaa minkä tahansa kunhan valitset oikean tiedosto muodon.) Tallennuksen jälkeen voidaan tuhota 'kaunis' internetsivumme ja tehdä siitä Blogger blogi.

Vaihe 1 - HEAD osa

Korvaa lähdekoodista:
Tällä:

Seuraavaksi avaa Notepad++ ohjelmaan auki myös malli.css tiedosto ja kopioi sen koko sisältö sille kuuluvaan kohtaan. Eli xml tiedostossasi kohtaan jossa lukee /* Aseta CSS osa tämän tilalle */. Vaikka blogger blogissa on mahdollista käyttää ulkoisia css tiedostoja on huomattavasti helpompaa liittää olemassaolevat css määrittelyt samaan tiedostoon. Tämän jälkeen tallenna xml tiedosto. Seuraavaksi palataan hetkeksi bloggeriin.

Vaihe 2 - Kuvat kuntoon

Siirry luomaasi blogger blogiin ja laadi uusi kirjoitus. Tähän kirjoitukseen lisää harjoitusteemasta löytyvät 3 kuvaa. Aivan normaalisti kuten lisäisit minkä tahansa kuvan käyttäen bloggerin omaa kuvien lisäys nappia. (footer-rule.png, lgrey023.jpg, rakennus.jpg) lisättyäsi kuvat siirry kirjoitus osiossa html puolelle ja kopioi kuvien osoitteet talteen. (src='kuvanosoite.com/kuva.jpg') joudumme nimittäin lisäämään kuvien oikeat osoitteet teemaan.

Kuten jo sanoin seuraavaksi lisäämme oikeat osoitteet blogiteemamme CSS osaan. Tähän tapaan:

Korvaa:

Tällä:
Vaihdettuasi kaikkien kolmen kuvan osoitteet on taas hyvä tehdä välitallennus. Ennenkuin laitetaan blogiteeman runko lopullisesti kuntoon.

Vaihe 3 - Runko kuntoon

!HUOM!Bloggerin käyttämät koodin osat eroavat toiminnaltaan ja ominaisuuksiltaan huomattavasti normaalista html kielestä. Emme kuitenkaan kiinnitä vielä huomiota niihin vaan pyrimme saamaan ensialkuun aikaan teeman joka latautuu blogger alustalla ongelmitta. Myöhemmissä artikkelisarjan kirjoituksissa tutustumme tarkemmin teeman rakenteeseen ja sen eri osien toimintaan. Nyt joudutte vain orjallisesti tekemään tarvittavat muutokset teeman toiminnan takaamiseksi.

Seuraavaksi vaihtoon menee blogin otsikko alue, jotta saamme näkyviin sen otsikon jonka määrittelimme harjoitusblogia luodessa.

Korvaa:

Tällä:

Otsikon jälkeen on aika laittaa bloggeriin sivupalkki. Vaikka omassa teemassamme ei ollutkaan erillistä sivupalkille tarkoitettua "lokeroa" (<div></div>) siihen oli syynsä. Nyt nimittäin saat aivan itse päättää asetetaanko sivupalkki vasemmalle vai oikealle puolelle blogikirjoituksia.Valinnastasi riippumatta joudut tekemään seuraavat muutokset blogisi lähdekoodiin.

Nosta ensin rakennus.jpg kuvaa (pääkuva) hieman ylemmäs eli page-header (otsikkoalue) osaan asti. Etsi ensin kuvan lähdekoodi blogistasi ja kopioinni sijaan leikkaa kyseinen koodinpätkä.

Tämän jälkeen liität sen blogin page-header (otsikkoalue) osan loppuun tähän tapaan:

Nyt voidaan tehdä seuraava muutos eli korvata valikko linkkilista bloggerin Sidebar määrityksellä sekä asetella se oikeaan kohtaan blogin lähdekoodissa. Eli etsi xml tiedoston lähdekoodista:
Korvaa se tällä:

Seuraava vaihe on lisätä lokerikko sivupalkkia varten oikeaan kohtaan xml tiedoston lähdekoodia. Eli etsi blogisi lähdekoodista kohta: Ja lisää välittömästi tämän kohdan alapuolelle <div id="sivupalkki"> </div> tähän tapaan: Lisättyäsi tämän on aika siirtää muokattu sivupalkki koodi oikeaan lokeroonsa. Eli siirrä (leikkaa+liitä) hieman ylempää blogisi lähdekoodista juuri muokkaamasi Ja liitä se oikeaan paikkaan tähän tapaan:
Tämä lähdekoodin muotoilu saattaa jo kauhistuttaa mutta vielä muutama vaihe ja olemme valmiit julkaisemaan teeman koko maailman kauhisteltavaksi. Seuraavaksi määritellään blogin CSS osaan uusi muuttuja nimeltään "Sivupalkki".

Voit lisätä tämän mihin tahansa kohtaa blogisi lähdekoodia, mutta itse yritän pitää asiat "järjestyksessä" ja lisään muutoksen kohtaan "Pää sisältö" tähän tapaan (Jos haluat sivupalkin olevan vasemmalla muuta float:right -> float:left): Lisättyäsi css osaan tämän uuden muuttujan muuta vielä kohtaa main-content seuraavasti (jos haluat blogin sivupalkin olevan vasemmalla muuta float: left -> float: right):
Vielä yksi CSS muutos johtuen siitä että siirsimme pääkuvaa. Eli Etsi ja muuta:
täksi:

Vaihe 4 Footer osa ja julkaisu

Tehdään blogin xml lähdekoodiin vielä yksi muutos. Etsi blogin lähdekoodista kohta: ja muuta se:

Tallenna tiedosto

Vihdoinkin! Nyt on tullut se maaginen hetki julkaista ihka ensimmäinen itse tehty blogger teema! Siirry siis bloggeriin ja mene luomasi harjoitus blogin malli osaan, ja valitse kohta muokkaa HTML-koodia. Tämän jälkeen siirry pikaisesti Notepad++ puolelle valitse koko luodun teeman teksti (ctrl+a) kopioi tämä. Sen jälkeen siirry takaisin bloggeriin. Valitse bloggerissa koko lähdekoodi (ctrl+a) ja liitä kopioitu itsetehty teema tämän tilalle. Tämän jälkeen vain klikkaat "Tallenna malli.

Eteesi lävähtää vihoviimeinen varoitus. "uusi mallisi ei sisällä seuraavia widgettejä:". Ei hätää, sillä emme niitä ole sinne teemaan asettaneetkaan. Paina vain "Poista widgettejä" nappia ja olet valmis.

Jos kaikki onnistui niinkuin piti teema tallentui widgettien poiston jälkeen ilman virheilmoituksia. Nyt on oma uusi uljas teemasi kaiken kansan ihailtavana. Voit itsekkin huokaista helpotuksesta ja siirtyä ihailemaan uutta teemaasi.

Loppusanat

Täytyy sanoa heti ensialkuun että ei se nyt maailman kaunein teema ole, mutta ainakin se on itse tehty. Ei kuitenkaan kannata pelästyä sillä vaikka tilanne päällisin puolin näyttää toivottomalta tulemme seuraavissa artikkeleissa huomattavasti kohentamaan teeman ulkoasua sekä tietenkin tutustumaan kaikkeen siihen mitä ja miten voi omaa blogger blogiaan ja omaa teemaansa parantaa.

Jos et onnistunut tämän artikkelin avulla saamaan omaa teemaasi alkuun eli törmäsit ihmeellisiin virheilmoituksiin ei hätää! Kuten tavallista vastaan kyllä mielelläni kaikkiin kysymyksiin ja autan selvittämään mikä mahtaa olla vialla. Otan myös vastaan ehdotuksia siitä mitä asiaa haluatte tulevissa Oma teema! artikkeleissa lukea. Teeman rakennus intoa kaikille.

Alustus: Oma teema?

noreply@blogger.com (Unknown) — Sat, 11 Aug 2012 21:17:00 +0000

Nyt kun on lomat lomailtu ja keihästä heitetty on aika uuden blogikirjoituksen. Kuten sivustosta näkyy ulkoasu päivittyi. Se sai minut ajattelemaan: En ole koskaan neuvonut kuinka blogger blogin teema itseasiassa kokonaisuudessaan luodaan. Siispä härkää sarvista ja homma haltuun. Eli tämä artikkeli on "Alustus" artikkelisarjaan: Oma teema? - Temppu ja miten se tehdään.

Artikkelisarja tulee siis totuttuun tapaan neuvomaan hyvin seikkaperäisesti sen miten luodaan oma blogger teema. Tämä artikkelisarja vaatii kuitenkin laajuutensa takia alustuksen. Projektiksi tämä syö jonkinverran aikaa. Varsinkin jos ei ole valmis tyytymään ihan millaiseen teema-viritelmään tahansa, eli jos sinulla on tulenpalava kiire saada uusi ulkoasu blogiisi kannattaa valita jokin väliaikainen teema siksi aikaa kun uutta teemaa rakentelet.

Oma teeman luominen on kuitenkin erittäin palkitsevaa, sillä samalla kun rakennat teemaasi opit sen mistä mikin asia muokataan ja miten homma lopulta toimii. Luotuasi "tyhjästä" oman teeman tulevien muokkausten, ulkoasumuutosten jne tekeminen on tuhat kertaa helpompaa ja nopeampaa kuin ennen.

Artikkelisarjassa tulet törmäämään muutamaan ohjelmaan:

Ainoa maksullinen ohjelma näistä on PhotoShop, mutta tätäkään ei ole pakko käyttää vaan ohjelmalle löytyy ilmainen korvaava vaihtoehto Gimp. Oman teeman rakentaminen onnistuu siis aivan ilmaiselta pohjalta.

Ohjelmien esittelyn jälkeen on aika puhua tarkemmin siitä mitä olisi tarkoitus käsitellä itse blogin teeman rakentamisessa. Teeman rakentaminen aloitetaan aivan nollasta, eli tabula rasa periaatteella. Ensialkuun laitetaan hieman perustuksia kuntoon ja tutustutaan siihen mitä eroa bloggerin käyttämällä xml- merkintäkielellä on perus nettisivuihin. Tämän jälkeen ryhdytään kasaamaan itse teemaa. Laitetaan paikoilleen otsakkeet, leipäteksti osat ja alatunniste. Näiden pohjatöiden jälkeen siirrytään tarkempiin viilailuihin kunnes kasassa on mallikelpoinen teema.

Toivottavasti tämä artikkelisarja kiinnostaa mahdollisimman montaa henkilöä. Porukalla tekemisen riemua sen olla pitää....

Jos sinulla on kysyttävää tai ehdotuksia siitä mitä artikkelisarjan aikana on aivan ehdottomasti käsiteltävä kannattaa paiskata sitä kommenttia tuonne alas. Ei nimittäin vielä ole niitä selvännäkijän taitoja, harjoituksesta huolimatta.

KILPAILU

noreply@blogger.com (Unknown) — Sat, 11 Aug 2012 16:56:00 +0000

Voit voittaa huikean 6500 euron arvoisen APPLE tuote paketin osallistumalla tähän kyselyyn. Osallistumalla tuet myös BlogiHaltuun.net:in toimintaa. Onnea kilpailuun.

Väliaikaista

noreply@blogger.com (Unknown) — Thu, 09 Aug 2012 22:22:00 +0000

UPDATE BLOGIN ULKOASU ON PÄIVITTYNYT

Blogin ulkoasu on päivittymässä joten väliaikaisesti on käytössä hieman tavallisuudesta poikkeava teema. Pahoittelen.

Blogin visuaalisen ilmeen 6 käskyä

noreply@blogger.com (Unknown) — Tue, 17 Apr 2012 18:45:00 +0000

Internetin ihminen on visuaalisesti vaikuttuva eläin. Siitä syystä blogin visuaalinen ilme on harkittava tarkkaan. Blogikirjoitus, vaikka kuinka merkittävä olisikin, jää aivan varmasti vaille osaa sen ansaitsemasta huomiosta ellei blogin visuaaliseen ilmeeseen ole panostettu. Kirjoittaja voi toisaalta julkaista hieman keskinkertaisemmankin kirjoituksen ja koristella sen kauniiksi, ilman suuria seuraamuksia. Tämä kaikki johtuu siitä että ihmisen aisteista hallitsevin on näköaisti, ainakin silloin kun surffaillaan internetin ihmemaassa. Siksi BlogiHaltuun.net ryhtyykin nyt valottamaan niitä perusteita joita kannattaa ainakin kokeellisesti noudattaa.

Käsky 1: Älä varasta.

Tämä voi aloittelevasta bloggaajasta tuntua joskus lähes mahdottomalta, sillä kukapa ei haluaisi kopioida oman suosikkibloginsa visuaalista ilmettä. Älä kuitenkaan sorru tähän syntiin. Kyseessä on sinun oma blogisi, älä aliarvioi itseäsi ja tyydy pelkästään kopioimaan toisten tyyliä orjallisesti. Voit kyllä "lainata" jonkin osasen sieltä ja toisen täältä, luodaksesi oman tyylisi, sillä kaikki on jo nähty ainakin kerran.

Käsky 2: Brändää blogisi, edes pikana

Välittämättä siitä millaisia tavoitteita sinulla on blogisi suhteen et varmasti halua että kävijä poistuu sivultasi tietämättä missä hän juuri vieraili. Siitä syystä on ensiarvoisen tärkeää tehdä selväksi se jokaiselle vierailijalle heti ensimetreiltä. Suunnittele siis mahdollisimman vetoava blogisi "ylätunniste" tai banneri, kuten joissain yhteyksissä sitä kuulee kutsuttavan.

Miksi sivun yläosalla on mitään merkitystä?

Kun satunnainen surffailija eksyy blogiisi hänen silmiensä eteen aukeava kuva vaikuttaa sekunnin murto-osassa siihen millainen mielikuva blogista syntyy. Otetaanpa esimerkki ja tarkastellaan minulle niin kovin rakasta blogia, eli tätä jota juuri luet.

Siirryttäessä selailemaan si- vustoa aukeaa näytölle ainoastaan blogin yläosa. Tämä on se kriittinen vaihe jolloin sinun tulee napata lukijan huomio ja selvittää mahdollisimman nopeasti mistä oikeastaan on ky- symys.

BlogiHaltuun.net:in ylätunnisteesta ja bannerista selviää yhdellä vilkaisulla 4 merkittävää seikkaa. 1. Blogin Nimi 2. Blogin pääaiheet 3. Hakutoiminto 4. Sosiaaliset linkit. Näistä 3 on tarkoitettu ohjaamaan sivustolla vieraileva huomioimaan blogin sisältöä ja yksi eli nimi on tarkoitettu yhdistämään kaikki kokonaisuudeksi. Valikko joka sijaitsee blogin Header osassa on rakennettu siten että se tukisi "visuaalista tulkitsemista" (kuvat pelkkien linkkitekstien lisäksi).

Tällätavoin olen siis pyrkinyt "pika brändäämään" Blogihaltuun.net sivustoa sekä assosioimaan sisällön (2.) blogin nimeen ja verkko-osoitteeseen. (1.) Kannattaakin aina pyrkiä mahdollisimman nopeasti aikaansaamaan positiivinen mielikuva blogistasi sekä vahvistamaan tätä visuaalisten "avusteiden" kautta ja tekemään lukijalle selväksi mistä blogissasi on oikeastaan kyse. Internet sukupolvi ei ehdi käyttää aikaa miettiäkseen sitä mistä blogissasi oikeastaan on kyse, tämä on sinun tehtäväsi.

Banneristasi tulee siis käydä selväksi ainakin blogisi nimi, joka tulisi olla kuvaava ja aina sama kuin verkko-osoitteesi (URL).

Käsky 3: Kuvita teksti tai tekstitä kuvat, älä molempia.

Vaikka monelle saattaa tulla yllätyksenä blogin tarkoitus ei edelleenkään ole olla pelkkä valokuva-albumi. Tätä varten on olemassa paljon parmpia sovelluksia internet pullollaan, kuten vaikkapa flickr. Valokuvien ja minkä tahansa muunkin materiaalin on tarkoitus tukea kirjoitusta. Kirjoittamisestahan bloggaamisessa edelleen on kyse? Ai ei?

No leikki sikseen. Valokuva -bloggaus on hyvin suosittua ja ymmärrettävistä syistä: kuva kertoo enemmän kuin 1000 sanaa. Photoblog, tai Phlog on visuaalisuuden riemuvoitto joka kuitenkin usein kaatuu omaan näppäryyteensä.

Valokuvien laatu on valokuva-blogin merkittävin kriteeri. Hyvin usein kuitenkin törmää blogiin josta ei oikeastaan tiedä onko se kukko vai kana. Kaikki bloggaajat tietävät että kirjoittaminen on vaivalloinen tapa kuvata asioita ja siksi kirjoituksen joukkoon lisätty kuva onkin paikallaan, jos se toimii tekstin sisällön vahvistajana. Vastavuoroisesti valokuvablogissa kuvien yhteyteen lisätty pieni "selitys" kuvasta kuten valokuvaus paikka ja aika tuo kaivattua lisäsisältöä pelkkien kuvien joukkoon.

Sekavaa valokuva/kirjoitus blogia on joskus hyvin vaivalloista seurata, sillä usein lukijaa kiinnostavat joko kirjoitetut jutut tai valokuvat. Tästä syystä kannattaakin harkita kahden erillisen blogin ylläpitämistä ja ns. ristiin linkittämistä. Tällöin tarjotaan lukijoille vapaus valita kumpaa haluavat seurata vai seuraavatko kenties molempien sisältöä.

Käsky 4: Sovita ulkoasu sisältöön

Kauneus on usein katsojan silmässä ja siksi valinta runsauttaan pursuavan graafisesti ylimalkaisen blogin ja minimalistisen blogin välillä kulminoituukin usein siihen mikä on blogin käyttötarkoitus. Informaatiota tarjoava blogi, kuten tämä BlogiHaltuun.net joutuu usein tunkemaan hyvinkin paljon sisältöä rajalliseen määrään pikseleitä. Tämä tietenkin voi joidenkin minimalismiin ihastuneiden lukijoiden kohdalla toimia karkotteena.

Kannattaakin puntaroida visuaalista ilmettä myös sisällön kautta. Esimerkkinä voitaisiin ottaa jälleen kerran tekstipainotteiset vs. valokuvablogit. Valokuvablogeissa kannattaa usein pyrkiä minimalismiin blogin muun visuaalisen ilmeen kanssa, tämä tuo paremmin esille itse pääasian eli valokuvat joita blogissa julkaistaan.

Minimalismi toimii myös useissa muissa tapauksissa jolloin blogin ei ole tarkoitus tarjota muuta lisäarvoa kuin itse konkreettinen sisältö. Kirjoitetun sanan ja tehoste kuvien yhdistelmä toimii usein parhaiten tilanteissa joissa blogin sisältö on suunnattu opettamaan tai selittämään jokin asia hyvin seikkaperäisesti.

Käsky 5: Älä unohda sisältöä

Visuaalisella ilmeellä voidaan kyllä pelastaa paljon

Tämä on asia joka jokaisen bloggaajan tulee muistaa. Visuaalisella ilmeellä voidaan kyllä pelastaa paljon, mutta usein törmää blogeihin joiden visuaalinen ilme ei vastaa itse sisällön laatua. Olipa blogisi miten "kaunis" tahansa on lukijoillesi kuitenkin tärkeämpää itse sisältö. Jos taas pystyt yhdistämään laadukkaan sisällön tyylikkääseen visuaaliseen ilmeeseen on tulevaisuutesi bloggaajana vakaimmalla mahdollisella pohjalla.

Käsky 6: Kokeile, testaile ja viilaile maltillisesti

Blogin visuaalisen ilmeen kehittäminen ei ole nopea toimitus. Yhtenä päivänä saatat vain kyllästyä johonkin blogisi elementtiin ja laittaa sen vaihtoon. Tässä ei tietenkään ole mitään pahaa, päinvastoin. Sinulla on myös oikeus tehdä virheitä, sillä ilman virheitä ei kukaan opi yhtään mitään.

Kannattaa kuitenkin muistaa, että jatkuvasti "elävä" ulkoasu on usein hieman häiritsevää lukijan kannalta. Siitä syystä muutoksia ei kannata tehdä joka viikko, tai edes joka kuukausi. Kerran kaksi vuodessa päivittyvä ulkoasu ja visuaalinen ilme ovat aivan varmasti riittävä muutosvauhti eikä etenkään häiritse vakituisia lukijoitasi. Muistaa voi myös sen ei kannata korjata jotain mikä ei ole rikki.

Loppusanat

Visuaalinen ilme koostuu lukuisista asioista: Kuvat, värit, fontit, erilaiset rakenteelliset ratkaisut jne. ja nämä yhdessä muodostavat sen kuvan jonka lukijoillesi välittyy. Tehdessäsi väistämättömiä valintoja kannattaakin asettaa itsesi lukijasi asemaan ja pyrkiä rakentamaan blogisi ulkoasu siten että käyttökokemus ei kärsi "taiteellisesti" merkittävien ratkaisujen takia.

Toinen merkittävä seikka joka kannattaa pitää mielessä on se että jokainen ihminen nauttii visuaalisesti kauniista asioista. Ongelma onkin siinä että se mistä toinen pitää on toiselle kammotus. Siksi bloggaaja ei voikkaan koskaan miellyttää kaikkia omilla valinnoillaan. Valinta visuaalisten elementtien suhteen ovat aina tunteen ja järjen välinen liitto ja tavalla tai toisella kompromissi.

Blog Job 2012

noreply@blogger.com (Unknown) — Mon, 09 Apr 2012 21:30:00 +0000

First a short translation in Finnish:

Blogi Jobi 2012

Vuoden 2012 aikana perustettava uusi yhteisö -blogi etsii innokkaita kirjoittajia. Sinun tulee olla iältäsi vähintään 18 vuotias ja omata hyvät kirjalliset Englanninkielen taidot. Englanninkieliset hakemukset voi lähettää osoitteella: BlogJob2012@essentialalliance.net

Blog Job 2012

Essential Alliance network is in search for talented individuals. We currently have an exciting opportunity for any individual with a goal oriented mindset who is willing to invest their time in the pursuit of their own financial freedom.

Required:

- Ability to write in English, Finnish or any other Language is an advantage but not a requirement.

- A passionate and driven individual with a talent for written word

- Self motivated and willing to work under pressure

- Solid time management skills and the ability to work as a part of a team

Positions:

Fashion Writer

Do you live and breathe fashion? Have you always had a keen sense of future trends and the ability to astound your peers as the number one fashionista? We offer you a chance of becoming the head fashion writer for Essential Alliance network.

Required:

- Ability to summarize large amounts of information and compose articles that are both informative and interesting to a wide audience of fashion lovers.

- Photography skills are an advantage but not a requirement

- Ambition and drive to secure your own foothold in the world of fashion blogging and grow to become one of the leading authorities.

- Ability to travel

Entertainment Writer

Have you always wanted to be the next Perez Hilton or do things your own way, better than him? Now is your chance of becoming the entertainment expert of Essential Alliance.

Required:

- Ability to summarize large amounts of information and compose articles that are both informative and interesting to a very wide audience

- Understanding of the industry and the world behind the red carpet

- Ability to think and move fast. Always being ready to publish the latest and most relevant information possible.

- Ambition and drive to secure your own foothold in the world of entertainment blogging and grow to become one of the leading authorities.

- Ability to travel

Technology Writer

Do you have to have the latest gadgets and the biggest flat screen TV's? Do you always have to read the latest industry news and follow the scene religiously. Now is your chance of becoming the leading technology writer of Essential Alliance.

Required:

- Ability to summarize large amounts of information and compose articles that are both informative and appealing to a wide audience

- Profound understanding of the industry and the latest trends

- Ambition and drive to secure your own foothold in the world of Technology blogging and grow to become one of the leading authorities.

- Ability to create video reviews is an advantage but not a requirement.

- Ability to travel

Game/Music/Movie Reviewer

Do you know what is good, bad or simply ugly? Did you play Minecraft back in Alpha? Do you just have to go to the biggest gigs or see the latest blockbuster movie? Now we offer you a chance of becoming part of the Essential Alliance review team and a chance to tell the world what you thought about it!

Required:

- Ability to write unbiased informative articles

- Ambition and drive to secure your own foothold in the world of Review writing and grow to become one of the leading authorities.

- Ability to create video reviews is an advantage but not a requirement.

News Writer

Do you follow current events like a hawk? Do you have a deeper understanding of world politics and economy? We are offering you a position in our news team at Essential Alliance Network.

Required:

- Ability to write unbiased informative articles

- Ability to summarize large amounts of information

- Ability to conduct interviews and write editorials

- Ambition to publish only the most accurate information on day to day basis and secure your position as the number one news source.

- Ability to Travel

Sports news Writer

Do you follow sports like a hawk? Do you follow every sport imaginable from soccer to polo and from athletics to F1? We are offering you a position in our sports news team at Essential Alliance Network.

Required:

- Ability to write unbiased informative articles

- Ability to summarize large amounts of information

- Ability to conduct interviews and write editorials

- Ambition to publish only the most accurate information on day to day basis and secure your position as the number one news source.

- Ability to Travel

Columnist

Do you have a very special way with words? Do you always astound other people with your ability to find different and fresh perspective on wide variety of topics? Now is your chance of becoming the number one columnist of Essential Alliance network.

Required:

-Ability to write entertaining and informative articles about anything and everything

-Understanding of cultures, religions and current events around the world

How can I apply for a Blog Job?
That is easy, you have to send an e-mail to: BlogJob2012@essentialalliance.net
Please include the following information on

Subject line: Position you are applying to:aka. Columnist, News Writer...

Body of the e-mail:
Name, Age, Location and the Position you apply to, a short description of yourself and why Essential Alliance should consider hiring you. You also have to include a sample of your work: maximum length of 400 words. This can be done either by including a link to your writing or by writing a short sample on the body of the e-mail.

Essential Alliance network is always in search for talented individuals who have ambition and drive. If you think you have something to offer to our team outside of these positions please don't hesitate to contact us and send your open application.

Blogger uudistuksia, taas...

noreply@blogger.com (Unknown) — Thu, 05 Apr 2012 20:35:00 +0000

Blogger se uudistuu nopeammin kuin näin vanha edes vauhdissa pysyy. Siksi on taas aika kertoa uutuuksista joiden on tarkoitettu parantavan blogger alustaa entisestään. Google+ gadgetteja on ilmestynyt parikin kappaletta sekä ominaisuus joka nopeuttaa uusien kuvien ottamista ihmisestä jota eniten rakastaa, eli itsestään. Nyt kaikki blogger alustan ystävät saavat oman kuvansa blogikirjoituksen kylkeen vieläkin nopeammin ja helpommin.

Google+ Gadgetit bloggeriin

Halusitpa sitä tai et on Google+ tullut bloggerin kylkiäisiksi ihan jäädäkseen. Yhä tiukentuvassa sosiaalisen median kilpajuoksussa Google yrittää kampittaa kilpailijoitaan integroimalla palvelunsa tiukasti suosittuun blogger blogialustaansa. Tämä muutos ei ole voinut jäädä keneltäkään huomaamatta sillä uusi ulkoasu iskeytyi pakolliseksi vaihtoehdoksi muutama päivä sitten ja jo sitä ennen blogger alusta yritti vähän väliä ehdottaa kirjoitusten julkaisemista Google+ profiilin kautta. Tämä ei tietenkään itseäni niinkään haitannut mutta monet jotka halusivat pysytellä anonyymeinä tuskailivat tämän ongelman kanssa. Nämä gadget uutuudet eivät siis välttämättä ole sinua varten joka et halua omana itsenäsi blogiasi kirjoittaa. Teille kaikille muille tutustumisen arvoisia ovat sekä Google+ merkki, että +1 painike.

+1-painike on kätevä lisä aivan kaikkiin blogeihin. Omasta blogistani kyseinen painike on jo jonkin aikaa löytynyt, joten jos haluat voisit vaikka klikata sitä? Se löytyy tuosta koko ajan näkyvillä olevasta "valikosta" tuossa blogin oikeassa reunassa. Tähän saakka +1 painikkeet ovat löytyneet jokaisen blogikirjoituksen yhteydestä, tämä on tietenkin ollut mainio juttu mutta toisaalta hieman ongelmallinen. Aina kun joku on klikannut tätä plus painiketta on hän antanut plussan tietylle blogikirjoitukselle ei itse blogille. Tästä syystä blogger blogien gadget joukkoon onkin ilmestynyt uusi "+1 Painike" jonka avulla jokainen voi antaa plussaa myös koko blogille, ei pelkästään tietylle kirjoitukselle ko. blogissa! Tähän asti kyseinen painike on pitänyt vaivalloisesti asennella itse bloggerin lähdekoodiin, eli helpotusta on huomattavasti edelliseen verrattuna. Tarjolla on neljä eri kokovaihtoehtoa ja kaksi erilaista tyyliä, joista valita mieleisensä.

Google+ -merkki. Tämä nyt onkin jo jotain aivan erityistä. Merkki -gadget mahdollistaa helposti oman Google+ sivusi esille tuomisen omassa blogissasi. Sinun tulee vain lisätä gadget ja linkittää se omaan G+ profiiliisi/sivuusi. Tiesitkö muuten että blogihaltuun.net:llä on myös omat Google+ sivut joiden suosio ainakin tykkäysten määrässä kasvaa kiitettävää vauhtia joka päivä. Löydät blgihaltuun.net:in Google+ sivut helposti täältä.

Oma G+ osoitteesi

Ottaaksesi gadgetin käyttöön sinun tulee luoda ensin Google+ sivu tai voit vastaavasti yhdistää sen omaan Google+ profiiliisi. Tämän jälkeen kopioit vain oman linkkisi ja liität sen Google+ -merkki gadgettiin. Tunnistat helposti oman google+ osoitteesi sillä se on juuri se "erikoinen" numerosarja selaimen osoiterivillä vieraillessasi omassa profiilissasi/sivullasi. Vaihtoehtoina löytyy kaksi erilaista gadget mallia toinen tummalle ja toinen vaalealle blogille.

Pari sanaa jotka mahdollistavat Blogihaltuun.net:in toiminnan: Prime slots tarjoaa kaikille rekisteröityneille 5€ ilmaista pelirahaa, ilman talletusta! Eli voit pelata huoletta 5€ ja yrittää voittaa 1 000 000 Euroa etkä sitoudu yhtään mihinkään! Jos uhkapelit eivät ole sinun juttusi voit aina yrittää voittaa kattavan APPLE paketin sinulle ja ystävällesi!

Kuvasi nopeasti bloggeriin

Bloggeriin kuvien lisääminen saattaa joskus olla tuskallista, saatat joutua ensin kaivamaan kamerakännykän esille, kävelemään vessaan peilin eteen ja näppäämään kuvan itsestäsi. Tämä ei kuitenkaan ole enää ainoa vaihtoehto, nyt voit todella näppärästi lisätä kuvan itsestäsi istuskellessasi oman tietokoneesi ääressä kirjoittelemassa blogia. Valitse vain tavalliseen tapaan ensin bloggerin kirjoittelun yhteydessä "Lisää kuva". Tämä avaa ponnahdusikkunan johon jo tuttujen lisäysvaihtoehtojen lisäksi on ilmestynyt pari uutuutta. Voit nimittäin lisätä kuvan helposti omasta Android puhelimestasi tai näpätä tuoreeltaan kuvan webbikamerallasi!

Tämä jos mikä helpottaa huomattavasti muotibloggaajan arkea, kun ei enää tarvitse muuta kuin näpätä päivän pärstäkuva web -kameralla ja jatkaa kirjoittelua samalta istumalta. Myös Android sovellus helpottaa mukavasti liikkuvan bloggaajan arkea sekä mahdollistaa blogin kuvittamisen missä ja milloin tahansa. Kannattaa kuitenkin varata aikaa myös niille "oikeille kuville" eikä tyytyä pelkästään mobiili tai webcam kuviin, jos valokuvablogia haluaa pitää. Kaikesta huolimatta kuvauudistukset ovat mukava piriste hieman huonoa mainettakin niittäneelle picasa-blogger yhdistelmälle. En kuitenkaan menisi allekirjoittamaan sitä että ongelmat näiden kanhden palvelun yhteensovittamisessa olisivat tiessään näidenkään uudistusten jälkeen.

Lopuksi

Rauhallista pääsiäistä

Blogger blogialustaan tuli siis kuluneiden päivien aikana roppakaupalla uudistuksia, osa hyödyllisiä ja toiset vielä hyödyllisempiä. Ottakoon kukin omakseen ne jotka tuntuvat itselle tärkeimmiltä, sillä aina ei kannata yrittää pysyä kehityksen aallonharjalla. Kuten tähänkin asti Blogihaltuun.net kiittää ja kumartaa ja jää metsästämään uusia jutun aiheita sekä toivottaa kaikille lukijoilleen rauhallista Pääsiäistä.

Blogihaltuun.net lopettaa

noreply@blogger.com (Unknown) — Sun, 01 Apr 2012 08:08:00 +0000

Ajanpuutteen ja kävijöiden vähäisen kiinnostuksen vuoksi BlogiHaltuun.net lopettaa toimintansa. Kiitoksia kaikille jotka ovat vierailleet sivuilla.

Yrittäisit edes yrittäjä!

noreply@blogger.com (Unknown) — Sat, 24 Mar 2012 23:17:00 +0000

Bloggaaminen ei ole pelkästään harrastus. Yhä useammalle se on tapa hankkia ylimääräistä rahaa taskunpohjalle. Vaikkei bloggaaminen vielä kaikkia Suomalaisia elätäkkään se ei tarkoita sitä etteikö siitä voi hyötyä rahallisesti, tapauksesta riippuen jopa todella paljon. Tämän kirjoituksen on tarkoitus herättää viimeisetkin yrittäjät jotka lipuvat mahdollisen onnensa ohi autuaan tietämättöminä ja välinpitämättöminä mahdollisuudesta. Pahoittelen jo etukäteen, kielenkäyttöni loukkaa herkkänahkaisia.

Mikä helvetti siinä on että vaikka vääntäisit rautalangasta ja piirtäisit vielä kuvan ei viesti tahdo mennä perille. Se ei ole tyhmyydestä kiinni, enemmänkin välinpitämättömyydestä. Vuodesta 2007 olen joutunut kiertämään kuin laukkuryssä erilaisissa yrittäjien kekkereissä, joissa ylisanoja kuulee enemmän kuin Presidentin virkaanastujaisissa. Toinen toistaan kehuvat yrittäjät juovat nuppinsa turvoksiin kuunnellessaan samalla eri yritysvalmentajia ja "menestyjiä" joiden ainoa todellinen motivaatio on +15 000€ puhujapalkkio eikä mikään muu. Nimeltämainitsemattomat valmentajat puhuvat ympäripyöreitä 'totuuksia' ja viljelevät fraaseja joiden käyttökelpoisuus tosielämän tilanteissa on sama kuin hakkaisi päätään tiiliseinään. Omaan päähän se vain sattuu.

Pieni yksityisyrittäjä ei voi tuhlata aikaansa turhuuksiin tai heittää rahaa siihen pohjattomalta 'vaikuttavaan' kaivoon joka on yrittäjälle tarjottu "valmennus". Ei asiakastasi kiinnosta p*skan vertaa olitko A. Virtasen (toivottavasti tämän nimistä kouluttajaa ei ole olemassa) valmennuskurssilla vuonna 2011 tai Tyrvään yrittäjäpäivillä syksyllä 2007, Asiakasta kiinnostaa ainoastaan se että palvelu ja tuote on sitä mitä hän haluaa.

Maslow:in tarvehierarkia

Nyt tullaankin tähän maagiseen sanaan: Halu. Ihminen tuskin tarvitsee edes 5% siitä kaikesta krääsästä jota hän omistaa. Maslow jo aikoinaan kertoi harvinaisen selkeästi sen miksi "moderni" ihminen kerää ympärilleen tarpeetonta tavaraa; Pelkästään tyydyttääkseen itseään. Nyt jarrua! Mitä h*lvettiä tällä on tekemistä bloggaamisen kanssa? Ei yhtään mitään ja toisaalta aivan kaikki.

Blogi on työkalu

Ei mene päivääkään etteikö joku etsi internetistä tietoja tuotteesta tai palvelusta. Siis aivan kaikista tuotteista ja ihan jokaisesta palvelusta jota vain voit kuvitella. Kirjoittaessani tätä kirjoitusta pelkästään Google hakukoneeseen tehdään yli 120 miljoonaa hakua (1 tunti). Voidaan siis sanoa että on enemmän kuin tärkeää että yrittäjä näkyy internetissä.

No sehän nyt on ihan selvää! Meidän firmalla on jo WWW-sivut.

Se on mukava kuulla, mutta totuus on se että pelkät internetsivut ovat jo muinaisjäänne. Sinun tulee erottua. Harva yrittäjä pystyy puhtaalla omallatunnolla väittämään että he voivat erottua kilpailijoistaan ylivoimaisesti parhaalla hinnalla tai tuotteella. Erottuminen tuhansien kilpailijoiden joukosta on avainasemassa haalittaessa niitä kullanarvoisia maksavia asiakkaita.

Erottuminen blogin avulla on yksi helpoimmin toteutettavista ja taloudellisesti pienimmistä investoinneista joita voit tehä kilpailijasi kampittamiseksi. Sinun tulee rakentaa blogisi tukemaan yritystäsi tavalla joka on blogissa vierailevalle potentiaaliselle asiakkaalle miellyttävä. Et voi vain silmittömällä raivolla tyrkyttää tuotetta tai palvelua vaan sinulta vaaditaan hieman kieroiluakin. Ensinnäkin sinun tulee uskotella asiakkaallee ettet ole myymässä hänelle tuotetta vaan olet hänen paras uusi ystävänsä. Inhimillistä itsesi ja laskeudu siltä kultaiselta yrittäjän valtaistuimeltasi tavallisen kansan pariin.

Blogi ei ole tarkoitettu tuotteen tyrkyttämiseen viimeistä piirtoa myöden. Blogin avulla on tarkoitus tarjota lisäsisältöä yritys imagosi tueksi. Olitpa sitten minkä alan yrittäjä tahansa blogin käyttäminen paremman tunnettavuuden saavuttamiseksi ruohonjuuritasolla on erinomainen keino. Se ei kuitenkaan jää siihen, yhä useampi yritysasiakas tarkistaa internetsivujesi sisällön, luottokelpoisuuden ja protestilistan lisäksi, valitessaan uutta kumppania jolta tilata sen miljoona kappaletta uutta hilavitkutinta. Hilavitkutinkauppa saattaa syntyä juuri siksi että asiakkaasi ovat jättäneet blogiisi positiivista palautetta tai olet kyennyt hoitamaan kunnialla jonkin reklamaatio tapauksen ja dokumentoinut sen blogiisi.

Älä kuitenkaan yritä pettää meitä kuluttajia.

Älä kuitenkaan yritä pettää meitä kuluttajia sillä paskanjauhajan haistaa kilometrien päähän myös täälä internetin ihmemaassa. Paitsi tietysti se Nigerialainen prinssi joka lähettää aivan varmasti ihan kohta minulle 10 miljoonaa. Blogin työstäminen saattaa tuntua aivan typerältä ajatukselta, sillä onhan yrittäjällä nyt paljon parempaakin tekemistä. Näin on aivan varmasti mutta annan vielä yhden esimerkin, joka tulee elävästä elämästä.

Kertomus tai kuten hienosti sanotaan Case...

Yrittäjä perusti blogin jonka tarkoituksena ei ollut niinkään myydä omaa tuotettaan tai palveluaan vaan tarjota ihmisille ratkaisu ongelmaan joka piinasi monia. Yrittäjä sijoitti omaa rahaansa blogin perustamiseen ja samalla kuin vahingossa motivoi itseään kirjoittamaan blogia. (Mikään kun ei ole niin hyvä motivaatio kuin raha, varsinkin jos sitä pitää yrittää saada edes omiaan takaisin.) Vuoden kuluttua yrittäjä laittoi itsensä "tilille" eli mitä hän oli saavuttanut? Ihmiset olivat tyytyväisiä, yrityksen tunnettavuus oli paikallisilla markkinoilla teetetyn tutkimuksen mukaan räjähtänyt ja asiakastyytyväisyys oli noussut uuteen ennätykseen. Yrittäjä, mielissään tästä teki myös pikaisen laskelman. Verkkomyynti oli kasvanut blogin perustamisen jälkeisenä vuonna 540%.

blogista tulleet asiakkaat käyttivät yli 70% enemmän rahaa

Osansa näistä huikeista kasvuluvuista selittää yleinen kehitys, mutta ei läheskään kaikkea. Kun tarkasteltiin verkkokaupassa tehtyjen ostosten euromäärää liikenteen lähteisiin blogista tulleet asiakkaat käyttivät yli 70% enemmän rahaa ostoksiin, kuin verkkokauppaan muualta eksyneet. Kuten Lontoon murteella sanotaan 'Case in point'.

Loppusanat

Blogi ei ole itsessään ratkaisu yrityksen kaikkiin ongelmiin. Nykyisessä taloustilanteessa ei kuitenkaan yrittäjällä ole varaa jättää käyttämättä kaikkia mahdollisuuksia joita on tarjolla. Varsinkaan kun blogin taloudellinen panostus on hyvin pieni moneen muuhun vaihtoehtoon nähden. Blogi ja sen tuoma sosiaalinen kontakti yrityksen potentiaalisiin asiakkaisiin, yhdistettynä oikeaan sosiaalisen -median markkinointikäytäntöihin voi tuoda kaivatun piristysruiskeen ja etulyöntiaseman kilpailevaan yritykseen.

Ongelmaksi saattaa yrittäjälle muodostua tarvittavan tietotaidon puute, tämäkään ei kuitenkaan ole ongelma sillä BlogiHaltuun.net on täällä myös yrittäjiä varten. Kannattaakin ottaa yhteyttä tuo kysy bloggamista lomakkeen kautta niin laitetaan yrityksesi blogi asiat kuntoon, ihan selkokielellä ja ainoastaan hyvin pientä korvausta vastaan.

Olihan tauko paikallaan ja pari bloggerin uudistusta

noreply@blogger.com (Unknown) — Fri, 23 Mar 2012 00:50:00 +0000

Vaikkei se aina olekkaan itsestään selvää bloggaaminen vaatii energiaa. Jostain syystä bloggaaminen alkoi jäädä taka-alalle muiden projektien painaessa päälle ja päätin sitten hieman pitää taukoa, valitettvasti BlogiHaltuun.net oli yksi näistä sijaiskärsijöistä. En kuitenkaan unohtanut teitä rakkaat lukijani vaan vastailin edelleen kysymyksiinne joita ilmeistyi kiitettävästi "Kysy Bloggaamisesta" lomakkeen kautta.

Nyt on kuitenkin aika palata sorvin ääreen ja kirjoittaa blogia joka on ehdottomasti oma suosikkini. Haluan kuitenkin ensin käyttää sekunnin ehkä kaksi kiittääkseni siitä ettette hylänneet tätä blogia tämänkään tauon aikana vaan olette ahkerasti käyneet yhä suuremmalla joukolla tutustumassa blogin sisältöön. Tämän lyhyen kiittelyn ja anteeksipyytelyn jälkeen on aika tutustua siihen mitä bloggerissa on oikeastaan tapahtunut kuluneiden viikkojen aikana.

Dynaamiset näkymät

Dynaamiset näkymät eivät ole mitään uutta sillä ne lanseerattiin jo jonkin aika sitten. Google todennäköisesti tavoitteli modernilla ulkoasuvaihtoehdolla yhtenäisempää ilmettä joka sitoisi entistä tiukemmin Google+ palvelun sekä bloggerin toisiinsa. Dynaamisten näkymien suurimpiin ongelmiin kuului kuitenkin se että se ei tukenut minkäänlaisia Gadgetteja. Bloggerin tiimi on kuitenkin työskennellyt "taukoamatta" ja onnistunut lisäämään bloggerin dynaamisiin ulkoasuihin muutamia toimivia gadgettaja näihin kuuluvat:

Dynaaminen "Lukijat -Gadget"

Blogi Arkisto
Lukijat Gadget
Tunnisteet
Linkit
"Tilaa" -gadget (kokonaan uusi Gadget)

Ainoa mainittava asia tästä gadget joukkiosta on uutuus "Tilaa" -gadget joka dynaamisten näkymien puolella korvaa Sähköposti tilaus gadgetin sekä Tilaa syöte napin. Itse henkilökohtaisesti en vieläkään innostu siitä miltä Dynaamiset ulkoasut näyttävät mutta suunta on ehdottoman oikea. Jahka bloggerin työmyyrät vielä lisäävät käyttäjän vapautta muokata dynaamisen sivuston ulkoasua tai lisäävät rutkasti uusia dynaamisia malleja saattaa olla aika kokeilla myös niitä.

Hakuasetukset

Tämä on monelle www nörtille miellyttävä uudistus. Blogger antaa mahdollisuuden vaikuttaa Robots.txt:n sisältöön sekä tarjoaa mahdollisuuden omien 404 viestien sekä uudelleen -ohjausten tekemiseen. Tämä uudistus saattaa kieliä suuremmasta muutoksesta joka kytee blogger blogipalvelussa ja mielenkiinnolla jään ainakin itse odottamaan tulevia uutuuksia joita blogger tiimi kehittelee.

Lopuksi:Blogger entistä parempi

On olemassa kaksi koulukuntaa ne jotka vannovat blogger blogipalvelun nimeen ja ne jotka eivät voi sitä sietää. Yhä useammin olen kuitenkin törmännyt niihin ihmisiin jotka periaatteesta vastustavat bloggeria koska eivät ole valmiita uhraamaan sekuntiakaan tutustuakseen itse palveluun. Blogger (Blogspot.com) on yhä useammalle bloggaajalle paras vaihtoehto. Palvelun varmatoimisuus on aivan omaa luokkaansa, johon ei yksikään muu palveluntarjoaja maksullinen tai maksuton pysty.

Blogger blogia voi muokata siinä missä WordPress blogiakin, ainoana "heikkoutena" voidaan pitää sitä että blogger ei tarjoa tallennustilaa tiedostoille(muut kuin kuva tai video) vaan niille joutuu jokainen etsimään paikan jostain muualta. Tiedostojen tallentaminen ei kuitenkaan ole bloggaajalle perustarve vaan lisäominaisuus. Uskallankin palata tauolta näinkin rajulla väitteellä: Ei ole parempaa alustaa bloggaajalle kuin Blogger.

WordPress blogin tietoturva paremmaksi

noreply@blogger.com (Unknown) — Fri, 27 Jan 2012 00:05:00 +0000

Sain tuossa muutama päivä sitten videon teon lomassa joukon hätääntyneitä viestejä ihmisiltä joilla on ollut vakavia ja vähemmän vakavia tietoturva ongelmia. Ongelmat ovat lopulta selvinneet mutta tästä sain aiheen tähän uuteen kirjoitukseen. On nimittäin aika tutustua siihen miten voit lisätä oman WordPress blogisi tietoturvaa.

Vuosi 2012 ei tee poikkeusta siinä että tietoturva-asiat on syytä pitää kunnossa. Erilaiset hyökkäykset tulevat todennäköisesti vain lisääntymään, koska ilmapiiri kiristyy erilaisten lainsäätäjien sekä internetyhteisöjen välillä. Kannattaakin käyttää muutama minuutti oman WP bloginsa tietoturvan parantamiseen että blogissasi eivät vallitsisi niin sanotusti avoimet ovet.

Hakkerointi usein bloggaajan oma vika

WordPress on yksi suosituimmista CMS:stä (Content Management System). Siksi sen haavoittuvuuksia myös etsitään hakkereiden toimesta hyvin tiuhaan. Vaikka WordPress päivittääkin ohjelmistoaan vähän väliä ongelmia kuitenkin saattaa ilmetä, varsinkin jos bloggaaja itse on huolimaton tai välinpitämätön tietoturvansa suhteen. Ensimmäinen ja tärkein asia on muistaa aina päivittää ohjelmisto ja pluginit uusimpaan versioon. Suurin osa hakkeroinneista johtuu bloggaajan omasta välinpitämättömyydestä ja siitä että bloggaaja ei ole huolehtinut tarpeellisista päivityksistä.

Niin yksinkertainen asia kuin päivittäminen aina uusimpaan mahdolliseen versioon saattaa estää perus "script kiddien" käyttämästä hyväkseen jo havaittuja ja korjattuja tietoturva aukkoja. Suojele siis omaa WordPress blogiasi ja päivitä se sekä käyttämäsi pluginit välittömästi aina uusimpaan versioon.

WordPress Admin tunnus ja salasanasi

Toinen hyvin helppo tapa hankaloittaa WordPress blogin hakkerointia on käyttää jotain muuta tunnusta kuin "admin". Kannattaa ottaa ja valita siis WordPress:iin kirjautumiseen jotain ihan muuta. Luo toinen tili jota käytät ja poista WordPress:stä tämä "admin" tunnus tili.

Salasana ei myöskään saa olla mitään selkokielistä. Suurin moka salasanan suhteen johon olen törmännyt on se että edelleen ihmiset käyttävät ns. selkokielisiä salasanoja. Tai salasanoja jotka on "nopea" tai helppo kirjoittaa. Nyt kuitenkin kannattaa myös salasanojen suhteen ottaa itseään niskasta kiinni ja käyttää salasanana jotain joka on hieman haasteellisempi hakkeroida hyvä ja voimakas salasana on yli 8 merkkiä pitkä ja sisältää sekä erikoismerkkejä, numeroita sekä isoja ja pieniä kirjaimia. Tässä muutama esimerkki:

s#!tf@2rbV7Tup6T
#$-3+B%BW**F3_6D
)GX#-hhn+SkvQ7vc
JQMTsVcDXVf4Zxb6
Uj@4yFjGvYPD*82t
8bQH(_K^CtD=#cpz

Älä kuitenkaan kuvittele olevasi näppärä ja kopioivasi jotain näistä omaksi salasanaksesi sillä nythän kaikki ne jo tietävät.

Siirrä wp-config.php

Seuraava turvallisuus seikka jota voisit tehdä on siirtää kyseisen tiedoston. Tämä tiedosto on elintärkeä blogillesi, mutta myös hakkerin päästyä siihen käsiksi on blogisi muu tietoturva paperia. Et kuitenkaan voi siirtää tätä tiedostoa ihan minne sattuu vaan ainoastaan yhden kansion ylöspäin.

Eli normaalisti tiedosto sijaitsee palvelimellasi polussa: ~/home/user/public_html/wp-config.php

Voit siirtää sen kuitenkin: ~/home/user/wp-config.php ja blogisi toimii edelleen moitteetta.

Turvaa plugineilla

Näiden keinojen lisäksi on olemassa myös muutama plugini joita voit asennella jotta tietoturvasi olisi hieman parempi. WordPress bloggaajalle suosittelen ainakin tutustumista seuraaviin plugineihin:

Secure WordPress http://wordpress.org/extend/plugins/secure-wordpress/

WP Security Scan http://wordpress.org/extend/plugins/wp-security-scan/

BulletProof Security http://wordpress.org/extend/plugins/bulletproof-security/

Loppusanat

Vaikka tietoturva tuntuisikin tämän jälkeen olevan jo hanskassa kannattaa kuitenkin aina muistaa se tärkein työkalu, eli varmuuskopiointi sekä teemasta että kirjoituksista. Perus bloggaaja kun ei mitään valtion salaisuuksia blogissaan jakele (tai en ainakaan itse niin tee), niin ainoa todellinen itkun paikka tulee siitä kun hakkeri päättää tehdä kiusaa ja poistaa koko blogin.

Tämän lisäksi tarkkaavaisuus kannattaa myös muutenkin sillä pienimmätkin "epätavalliset" tilanteet saattavat olla merkki ongelmista sivustosi tietoturvallisuuden kanssa. Varsinkin jos olet yrittäjä jonka asiakkailla on omia tietojaan sinun palvelimellasi, sinun on vastuu ylläpitää tietoturvaasi. Välinpitämättömyys ei tule kysymykseen kun kyseessä ovat omat asiakkaasi.

Jos koet että bloggaajien tulee huolehtia bloginsa tietoturvasta niin tee ystävällinen teko ja jaa tämä kirjoitus facebookissa ja muualla sosiaalisessa mediassa ihan vain muistuttaaksesi heitä siitä.

Valokuvien retusointi - VIDEO

noreply@blogger.com (Unknown) — Thu, 26 Jan 2012 13:50:00 +0000

Muutama päivä sitten BlogiHaltuun.net:ssä käytiin äänestys jossa lukijat saivat päättää tulevan jutun aiheen.

Aiheeksi valkkautui video valokuvan retusoimisesta photoshop ohjelmistolla. Kuvan muokkaaminen ei sinällään liity blogi kirjoittamiseen mutta suurimmalle osalle bloggaajista valokuvat ovat aivan välttämätön osa omaa jokapäiväistä blogikirjoitusta. Siksi ei tullutkaan yllätyksenä että tämä valokuvan retusointi nousi kirkkaaksi voittajaksi äänestyksessä.

Ohjelma jota käytetään on PhotoShop

PhotoShop ohjelman voima piilee sen helppokäyttöisyydessä ja valmiiden työkalujen tehossa. Tämä tutoriaali ei ole tarkoitettu niille jotka jo osaavat tehdä PhotoShop ohjelmalla perus muokkauksia vaan tämä on tarkoitettu niille ihmisille jotka ovat vasta aivan alussa ja haluavat helposti ja nopeasti oppia muokkamaan valokuviaan.

Tutoriaalissa käydään läpi muunmuassa liquify työkalun ja clone stamp toolin käyttö sekä muutamia muita yksinkertaisia ja nopeita tapoja retusoida valokuvia. Toivottavasti tästä videosta on sinulle jonkinlaista lisäarvoa ja jos kiinnostus kuvien muokkaamista kohtaan heräsi kannattaa jättää kysymyksiä ja juttuvinkkejä kommenttina.

Tässä niille jotka eivät ole ihan valmiita luottamaan pelkkään videon voimaan lyhyehköt selostukset muutamista työkalusta ja miten niitä voisi hyödyntää omissa valokuvissaan.

Clone Stamp Tool

Erittäin helppokäyttöinen työkalu jos sinulle joskus tulee tarve poistaa kuvastasi jotain. Olipa kyseessä sitten ihminen tai eloton objekti on Clone Stamp Tool ehdottomasti paras valinta tähän tehtävään. Koko työkalun juju piilee siinä että valitset oikean kohdan jonka kloonaat ja vaihtelet kloonaus kohtaa tarpeen mukaan. Kloonaus kohta valitaan vasemmalla hiirennapilla pitäen samalla alt näppäintä pohjassa.

Healing Brush:it

Healing brush työkalut sekä Patch tool ovat omiaan kun on tarpeen retusoida hieman pienempiä alueita. Esimerkiksi kasvojen epäpuhtauksia vastaan voi hyökätä erittäin tehokkaasti käyttäen Spot healing brush työkalua, valitset vain ko. työkalun vasemmasta työkalupalkista ja klikkailet ongelmakohdat kadoksiin. Kuten aina mitä suurempi on kuvasi resoluutio sitä suuremmalla todennäköisyydellä PhotoShop pystyy hyvään lopputulokseen ja sinun ei tarvitse
huolehtia itse mistään.

Liquify työkalu

Kuten allekirjoittanut itsekkin on huomannut julkkisten valokuvat ovat hyvin usein rankasti photoshopattuja. Yksi yleisimmistä käytetyistä työkaluista tässä mielessä on nimenomaan Liquify, sillä pystytään hyvin nopeasti karistamaan kiloja, kiinteyttämään kasvoja ja poistamaan väsymystä.

Loppusanat

Toivottavasti tästä tutoriaalista oli hyötyä ja jos tulevaisuudessa olet kiinnostunut näkemään lisää videoita eri aiheista kannattaa ja pitää jättää kommentteihin ehdotuksia!

Jos mieleesi taas tuli uusia kysymyksiä kannattaa niitäkin jättää joko kysy bloggaamisesta lomakkeen kautta tai kommenttina.

7 harhaluuloa sosiaalisesta mediasta

noreply@blogger.com (Unknown) — Mon, 16 Jan 2012 14:48:00 +0000

Useinmiten kun bloggaaja hyökkää sosiaalisen median syövereihin ensimmäinen karilleajo tapahtuu jo alkumetreillä. Virheet kostautuvat usein hyvinkin karvaasti ja pahimmassa tapauksessa lukijat kaikkoavat blogista kokonaan.

Itsetarkoituksena ei pitäisi olla hukuttaa blogisi lukijoita Twitter viesteihin tai Facebook päivityksiin. Tarkoituksena on hyödyntää sosiaalista mediaa tavalla joka ei ole luotaan työntävä tai häiritsevä. Mitä vähemmällä ajankäytöllä saavutat halutut tulokset, eli kävijämäärän kasvun, sitä parempi. Jotta pääsisit alkuun sosiaalisen median hyödyntämisessä tässä on listattuna 7 yleistä harhaluuloa sosiaalisesta mediasta.

1. Liittyminen takaa suuren määrän kävijöitä

Ei ole olemassa mitään tapaa kasvattaa kävijämäärää räjähdysmäisesti ellet sitten pääse esille valtamediassa. Sosiaalinen media on todistetusti yksi nopeimmista tavoista kasvattaa kävijämäärää mutta edes se ei pysty takaamaan ilmiömäistä kasvua. Vaikka liittyisit Facebookiin ja Twitteriin tai vaikka Google+:aan tänään et saa suurta kävijämäärää heti seuraavana päivänä. Sosiaalinen media on ennenkaikkea työkalu jonka tarkoituksena on tehostaa blogisi markkinointia, eikä mikään yksittäinen työkalu takaa menestystä ilman että sen avulla tehdään "työtä". Aika ja kärsivällisyys ovat tässäkin asiassa avainasemassa.

2. 24h/vrk sosiaalista mediaa.

Sosiaalinen media on kätevä tapa jakaa tietoa. Usein kuitenkin törmää tilanteeseen jolloin bloggaaja yrittää hukuttaa seuraajansa päivityksiin. Tämä karkottaa aivanvarmasti viimeisetkin twitter seuraajasi ja aiheuttaa lähinnä ärtymystä. Useinmiten tälläinen mediaähky aiheutuu bloggaajan liian suuresta innostuksesta, eli kannattaa siis laittaa jäitä hattuun ja miettiä tarkasti se mitä jaat ja missä. Että tältä mediaähkyn aiheuttamiselta välttyy kannattaa asettaa itselleen selkeä raja viestien määrään esimerkiksi 1 viesti/vrk facebookiin, 5 twitteriin jne.

3. Numeroita

"Minun blogillani on 25 000 Facebook tykkäystä." Mitä sitten? Sinähän ostit ne intialaiselta palveluntarjoajalta 100 eurolla.

Joskus tuntuu siltä että ihmiset tuijottavat numeroita. Se ei tietenkään ole huono vaihtoehto, jos tarkastaa viikon lottorivin, mutta sosiaalisessa mediassa numeroiden tuijottaminen on virhe. Sosiaalisen menestyksen mittariksi alunperin tarkoitettu seuraajien, plussien ja tykkäysten määrä kun ei merkitse yhtään mitään. Internet on täynnä palveluita joista voit rahalla ostaa tätä egon kohotusta. Ainoa merkityksellinen asia on se että sinun lukijasi jakavat blogisi kirjoituksen jonka he katsovat tärkeäksi. Ansaittu tykkäys on aina merkityksellisempi kuin 10 000 ostettua.

4. Bloggaajan pitää ottaa koko sosiaalinen media haltuun.

Tähän ei voi muuta sanoa kuin onnea yritykseen. Tälläkin hetkellä internetissä toimii vähintään 1000 erilaista sosiaalista palvelua. Kuten varmasti jokainen tajuaa määrä ei korvaa laatua. Siksi Facebook, Twitter ja Google+ ovat ne verkostot joita bloggaajan kannattaa harkita. Ainoastaan yritysten kannattaa tämän lisäksi liittyä oman alansa verkostoihin.

5. Virheistä viis....

"Ketään ei kiinnosta jos teen pari pientä mokaa." Väärä luulo. On nimittäin niin että bloggaaja ei saisi tehdä virheitä. Ei edes (/varsinkaan) sosiaalisessa mediassa. Mikään ei karkota lukijoitasi nopeammin kuin virheellisen tiedon jakaminen. Kirjoitusvirheet, väärät faktat ja mokat ovat omiaan pilaamaan maineesi bloggaajana. Lopullisesti. Vaikka korjaisit virheesi myöhemmin on vahinko jo tapahtunut. Mokien tekeminen on inhimillistä, mutta verkossa tehdyt virheet ovat valitettavasti kaikkea muuta.

6. Sinun ei tarvitse välittää seuraajiesi viesteistä

Tämä on virhe johon bloggaaja usein sortuu, hän ei reagoi viesteihin joita lukijat hänelle jättävät. Blogisi lukijat ovat suurin insipiraatiosi lähde. Kirjoitathan kuitenkin juuri heille, joten kuuntelemalla sitä mitä seuraajillasi on sanottavaa saat arvokkainta mahdollista tietoa siitä mitä kirjoittaa seuraavaksi. Ideoiden syntyyn ei tarvita kuin yksi viesti jonka saat twitterissä tai facebookissa. Lukijasi voivat myös toimia porttina johonkin jota olet aina halunnut, ehkä he työskentelevät yrityksessä joka etsii sopivaa blogia jota sponsoroida?

On paljon parempi vaihtoehto sovittaa blogisi lukijoittesi mielenkiinnon mukaan kuin yrittää muuttaa lukijoittesi kiinnostuksen kohteita.

7. Suurin harhaluulo: Blogisi ei tarvitse sosiaalista mediaa

Jokainen blogi, pienimmästä suurimpaan tarvitsee sosiaalista mediaa. Olisi silkkaa typeryyttä jättää hyödyntämättä sitä valtaisaa potentiaalia joka sosiaalisessa mediassa on. Ajatellaanpa asiaa lukijan kannalta: Mitä vaivattomampi tapa seurata ja jakaa blogisi sisältöä löytyy sitä todennäköisemmin vierailija myös niin tekee.

Vuonna 2012 sosiaalinen media ei ole ainoastaan hyödyllinen vaan myös pakollinen osa jokaista blogia. Voi olla että blogisi menestyksen ainoa ratkaiseva tekijä on se oletko siellä missä lukijasikin ovat. Sosiaalisessa mediassa. Moni voi kuvitella että "hypetys" tästä aiheesta on turhaa ja perus bloggaaja tulee toimeen vallan mainiosti ilman omaa Facebook tai Google+ sivua, mutta totuus on kuitenkin se että ihmiset eivät halua tyytyä pelkkään kirjoitettuun sanaan, vaan he haluavat lisä-sisältöä. Miksi et tarjoaisi heille tätä sisältöä sosiaalisessa mediassa?

5 Asiaa jotka tulee tietää ennenkuin laitat mainoksia blogiisi

noreply@blogger.com (Unknown) — Sun, 08 Jan 2012 12:58:00 +0000

Yksi ensimmäisistä ajatuksista joita bloggaaja miettii mainoksista on se koska mainokset tulisi asettaa omaan blogiinsa. Yksinkertainen vastaus kuuluu: Heti, juuri nyt. Mutta miksi? Siitä yksinkertaisesta syystä että mainokseton blogi on tuottamaton blogi, riippumatta siitä kuinka monta kävijää tai sivunlatausta sinulla on päivässä. Nyt sinulla onkin hyvä hetki käydä laittamassa nämä mainokset päälle omassa blogissasi. Älä epäröi enää sekuntiakaan tämän asian suhteen sillä mitä enemmän sinulla on lukijoita mainoksettomassa blogissa sitä suurempi meteli nousee kun laitat lopulta yhdenkin mainoksen.

Lue kuitenkin ensin tämä kirjoitus loppuun sillä kerron 5 asiaa jotka sinun tulisi jo tietää mainosten ihmeellisestä maailmasta.

Harva bloggaaja alussa ajattelee tuloja, mutta raha on se mikä ratkaisee, joka muuta väittää valehtelee itselleen ja myös muille. "Mutta eihän kukaan pidä mainoksista?" Eikö? Minä ainakin rakastan mainoksia: suuria mainoksia, pieniä mainoksia, mainoksia jotka ovat hyvin tehtyjä. Ellen pitäisi mainoksista tulisin luultavasti hulluksi. Mainoksia kun on aivan kaikkialla.

Bloggaajalle mainokset ovat elinehto sillä ne tuovat voita leivänpäälle. Moni bloggaaja kuitenkin pettyy karvaasti aseteltuaan mainokset blogiinsa. Kannattaakin asettaa realistiset tavoitteet tässäkin asiassa ettei joudu nielemään pettymystään.

1. Lukijat ovat tulon lähde

Ensimmäinen asia joka sinun tulee tietää on se että ilman suurta määrää lukijoita ei ole suuria tuloja. Mainostajat maksavat siitä että heidän mainoksensa näkyvät. He eivät maksa siitä että laitat mainoksen blogiisi, sen tulee myös näkyä. Siitä yksinkertaisesta syystä lähes jokainen mainostaja perustaa maksunsa joko mainoksen näyttömäärään (CPM) tai mainoksen klikkausten määrään (CPC). Osa mainostajista haluaa näkyvyyden lisäksi tuottoja itselleen, nimittäin sen että mainosta klikannut ostaa tuotteen x heidän sivuiltaan.

2. Blogisi lukija on asiakas

Nyrkkisääntö onkin että tuloja on turha odotella ennenkuin blogissasi on potentiaalisia asiakkaita. Asiakas sana saattaa kuulostaa hieman erikoiselta, mutta lukijasi ovat asiakkaita mainostajillesi. Mainoksen tarkoituksena kun on haalia uusia asiakkaita ostamaan jokin tuote tai palvelu, ellet myös itse yritä ajatella blogisi lukijoita myös kuluttajina, potentiaalisina asiakkaina valitessasi mainostajia blogiisi saatat heittää hukkaan kaiken tekemäsi työn. Tämä onkin toinen seikka joka sinun tulee ymmärtää ennenkuin asetat mainoksia blogiisi. Lukija on asiakas.

3. Sijoita mainokset oikein

Mainos tulee asettaa mahdollisimman näkyvälle paikalle

Kolmas seikka on monille täyttä hepreaa, nimittäin mainoksen sijoittelu. Moni bloggaaja joka pelkää mainoksia, mutta on kuitenkin ottanut ensimmäisen askeleen ja sijoittanut blogiinsa mainoksen tekee sen tavalla joka takaa että tuottoa ei synny. Mainos sijoitetaan blogiin aivan väärään paikkaan. Mainos yritetään piilottaa jonnekkin blogin alaosaan pois silmistä. VIRHE! Mainos tulee asettaa mahdollisimman näkyvälle paikalle, jotta se huomataan ja sitä klikataan. Google on tässä asiassa auttaakseen tehnyt eräänlaisen lämpökartan josta saa jo hyvän käsityksen mihin mainos tulisi sijoittaa.

Tehokkain mainoksen paikka on blogikirjoituksen sisällä, Välittömästi kirjoituksen pääotsikon alla. Tämä mainospaikka toimii ja havaitaan parhaiten blogistasi. Toinen tehokas mainospaikka on blogisi sivupalkissa, sen yläosassa. Eli mitä vähemmän "työtä" lukija joutuu tekemään mainoksen havaitakseen sitä suuremmalla todennäköisyydellä siihen myös klikataan. Kaikki mainokset joita varten blogin lukija joutuu vierittämään sivua alaspäin ovat sellaisia jotka eivät tuota klikkauksia. Tälläiseen "kylmään" mainospaikkaan kannattaa sijoittaa mainos ainoastaan siinä tapauksessa että sen toiminta perustuu myynteihin. Eli vähemmällä määrällä klikkauksia saatat silti päästä kohtuulliseen tuottoon, koska myyntejä ei tarvita yhtä paljon.

4. Myynneillä tulosta

Suurin osa tälläisistä "affiliate" mainoksista perustuu tosiaan myynteihin. Saat % -osuuden siitä rahasta jota asiakas käyttää mainostajasi sivustolla. Affiliate mainokset ovat myös tehokkaampi ratkaisu blogeihin joissa on vielä vähänlaisesti lukijoita, juuri samasta syystä. Ei tarvita kuin 1 asiakas joka ostaa tuotteen kun saatat saada samat tulot kuin näyttämällä esimerkiksi Google AdSense mainoksia kuukauden tai kaksi. Siksi pienen kävijämäärän blogien kannattaakin ensisijaisesti keskittyä affiliate mainoksiin ja vasta kun kävijämäärä on suuri siirtyä erilaisten mainosverkostojen kuten Google AdSense käyttäjäksi. Tämä neljäs seikka kannattaakin pitää mielessä valitessasi omaa mainosratkaisuasi.

5. Määrä ei korvaa laatua

Mainosten laatu korvaa aina määrän

Viides asia, joka sinun tulee tietää mainoksista on niiden oikea määrä. Mitä vähemmän mainoksia blogissasi on sitä tehokkaammaksi yksittäinen mainos muuttuu. Jos kylvät blogisi täyteen mainoksia jokaisen mainoksen teho heikkenee. Mieti siis tarkkaan se mikä määrä tuntuu sopivalta, onko järkevämpää sijoittaa blogiisi 1 mainos vai kenties 3? Tämä on osittain makuasia, mutta mainosten laatu korvaa aina määrän. Oikean mainoskumppanin ja mainos-sijoittelun avulla voidaan päästä huomattavasti parempiin tuloksiin kuin kylvämällä koko blogi täyteen pelkkiä mainoksia ja unohdetaan itse sisältö. Laadukkaan sisällön ja tarkkaan mietityn mainoskampanjan avulla tuloksen tekeminen on huomattavasti helpompaa .

Blogi haltuun myös vuonna 2012

noreply@blogger.com (Unknown) — Sat, 07 Jan 2012 17:33:00 +0000

On saavutettu vuosi 2012. On siis aika laittaa myös blogisi kuntoon, tämä kannattaa aloittaa tekemällä suunnitelma siitä mitä blogillasi aiot tehdä tulevien kuukausien aikana. Kuten tämän blogin kohdalla toimin, laitoin ensiksi ylös niitä asioita joita haluan saavuttaa ja joihin haluan muutosta.Ilman selkeitä tavoitteita ei ole mitään syytä kirjoitella blogia.

Kannattaa kuitenkin tehdä asioita hieman eritavalla kuin viime tai sitä edellisenä vuonna. Uudistuminen on avain siihen että lukijoittesi mielenkiinto säilyy ja tavoitat uusia lukijoita. Jos aiot pelkästään jatkaa samaa vanhaa rataa, eivät tuloksesi ainakaan tule parantumaan viimevuotisesta.

1. Älä tee uudenvuodenlupauksia blogisi suhteen.

Tee pieni tarkastelu siihen millaisia lupauksia tutut bloggaajat tekivät vuoden 2011 alussa. Voin olla melkeinpä varma että nämä blogistit eivät saavuttaneet niitä lupauksia. Suurin osa bloggaajien tekemistä lupauksista ovat itseasiassa epä-realistisia ja hetken mielijohteessa kehiteltyjä. Voisinhan vaikka itsekkin luvata kirjoittavani vähintään 365 artikkelia vuonna 2012, mutta se tuskin pitää paikkansa. Lupaukset kannattaakin heivata romukoppaan ja laittaa mietintämyssy päähän.

Lupauksien sijaan kannattaa pyrkiä tavoitteittesi toteuttamiseen. Tavoitteiden jotka itseasiassa ovat realistisia. Tavoitteita joiden miettimiseen olet käyttänyt aikaa enemmän kuin 10 minuuttia.

Nyt kun kuitenkin on uusi vuosi ja tarvitset uuden lähestymistavan myös bloggaamiseen. Kannattaa heivata ajatus siitä että olisi sanojesi mittainen ja keskittyä olemaan "toiminnan mies". Tavoitteiden toteuttaminen on paljon tärkeämpää kuin lupaukset jotka kuitenkin rikkoontuvat jossain vaiheessa. Pyri toteuttamaan asiat yksi kerraallaan, pyri olemaan paras mahdollinen bloggaaja joka voit olla.

2. Tavoitteista tekoja

Älä kuvittele että pelkät tavoitteet riittävät menestymiseen. Älä kuvittele että blogisi menestyy jos käytät siihen aikaa viikosta muutaman tunnin, tai silloin kun se on sinulle mahdollista. Tee tänä vuonna jotain hieman eri tavalla.

Tee itsellesi selkeä aikataulu, aivan kuten koulun lukujärjestys, ota itseäsi niskasta kiinni ja aseta tarkat aikataulut milloin mikäkin kirjoitus on julkaistava. Koska otat yhteyttä uusiin mahdollisiin mainostajiin jne.

Luo itsellesi strateginen aikataulu jonka perusteella toimit.

Tämä saattaa kuulostaa rankalta, mutta ilman tälläistä "pakko" aikataulua et koskaan tule saavuttamaan mitään blogisi suhteen. Etkä muutenkaan elämässä. Päättäväisyys ja sitkeys ovat ne kaksi avainsanaa joihin jokaisen tavoitteen toteutuminen nojaa.

3. Markkinointi kunniaan

“Ei mun tarvi markkinoida“…”Ei mun blogi mitään markkinoinnista hyödy“…”En mä tiiä miten markkinoisin blogiani“…"Blogin markkinointi on hankalaa” jne.

Nuo lauseet ja sanat saat unohtaa välittömästi...

Jos haluat menestyä, saada lukijoita, kommentteja ja blogisi nousuun sinun tulee ottaa markkinointi haltuun. Ei typerästi hukkaamalla omat rahasi mainoskampanjaa jonka teho on mitätön, vaan käyttämällä järkeä. Pyrkiä tuomaan omaa blogiasi esille tavalla joka kiinnittää huomiota. Jokainen bloggaaja haluaa kävijöitä, kommentteja ja lukijoita. Ilman markkinointia et saavuta mitään näistä ja blogisi kuolee hiljaa pois.

Markkinoit blogiasi joka päivä, jok'ikinen kerta kun julkaiset uuden kirjoituksen on se samalla mainos joka vaikuttaa potentiaalisiin uusiin lukijoihin. Älä keskity pelkästään markkinoimaan blogiasi omassa pienessä piirissäsi vaan laajenna! Keskittymällä omien ystäviesi haalimiseen lukijoiksi teet vain itsellesi hallaa sillä ystäväsi kyllä lukevat blogiasi, vaikket heitä erikseen sitä pyytäisi tekemään.

Markkinointi ei vaadi suurta budjettia, tai edes minkäänlaista budjettia. Käytä aikaa kommentoimalla kirjoituksia toisten ihmisten blogeissa ja ennenkaikkea paras markkinointikeino on kirjoittaa toisten ihmisten blogeihin! Vuoden 2012 tehokkain markkinointikeino ovat ns. vierailija kirjoitukset. Saat oman kirjoituksesi esille toisten ihmisten blogeihin ja samalla kasvatat omaa lukijakuntaasi merkittävästi. Äläkä vain väitä ettet voi kirjoittaa toisten ihmisten blogeihin. Oletko edes kysynyt heiltä ? Suomessa on kymmeniä ellei jopa satoja blogeja jotka ovat samanlaisia ja samasta aiheesta kuin omasi. Miksi et sitten heittäisi heille kommenttia tai sähköpostia ja kysy aivan suoraan olisiko mahdollista kirjoittaa blogiisi artikkeli. Kirjoitathan omassa blogissasi sellaisen joka päivä.

Moni bloggaaja on enemmän kuin iloinen siitä että saa julkaista blogissaan laadukkaan kirjoituksen, johon ei ole itse tarvinnut käyttää aikaa. Tämä tarjoaa bloggaajalle mahdollisuuden viettää vapaapäivän tai vaikka kirjoittaa artikkelin ns. varastoon myöhemmin käytettäväksi. Teet siis itseasiassa toiselle bloggaajalle palveluksen tarjoamalla omaa artikkeliasi hänen blogissaan julkaistavaksi.

4. Älä saarnaa jostain mistä et tiedä.

Suurin virhe jonka voit tehdä on pyrkiä opettamaan tai kertomaan asiasta josta et itseasiassa tiedä yhtään mitään. Lukijasi kärsivät tästä kaikkein eniten ja menetät kaiken uskottavuuden jota blogillasi on ikinä ollutkaan.

Keskity kirjoittamaan aiheista joista tiedät, joista sinulla on kokemusta. Älä yritä esittää mitään mitä et ole sillä silloin kaivat itsellesi haudan josta et pääse pois ja saat heittää hyvästit koko bloggaamiselle. Ole aito ja rehellinen, oma itsesi. Ainoastaan ihmiset jotka ovat rehellisiä itselleen ja rehellisiä siitä mitä kirjoittavat tulevat menestymään vuonna 2012. Voit olla yksi heistä.

HYVÄÄ UUTTA VUOTTA

noreply@blogger.com (Unknown) — Sat, 31 Dec 2011 15:19:00 +0000

Hyvää uutta vuotta kaikille BlogiHaltuun.net:in lukijoille ja onnea sekä menestystä vuoden 2012 blogi koitoksiin!

Bloggaaminen vaarantaa terveytesi ja johtaa kuolemaan

noreply@blogger.com (Unknown) — Thu, 29 Dec 2011 11:31:00 +0000

On päivänselvää että lama ei vaikuta ainakaan yhteen asiaan, nimittäin siihen mihin tutkijat saavat apurahoja. Lähestulkoon kaikkien asioiden vaarallisuutta tutkitaan ja on jo tutkittu. Niin myös tämän asian kohdalla.

Saattaa olla että luen tutkimusta kuin piru raamattua aiheuttaakseni paniikkia, tai ehkä minua vaivaa joulu ähky kaikkien herkkujen syömisen jälkeen. Ajattelin kuitenkin kantaa "yhteiskunnallisen vastuuni" ja varoittaa teitä kaikkia. Varoittaa siitä että bloggaamalla vaarannat oman terveytesi.

Erään tuoreen tutkimuksen mukaan ihmiset nimittäin istuvat aivan liikaa. Istuvat television edessä, tietokoneella työskennellessään ja piru vieköön istuvat vielä ihan huvikseen, istumisen ilosta. Tämä niin viattomalta kuulostava ja jokseenkin yleinen aktiviteetti vaarantaa terveyttäsi tunti tunnilta.

Välittömästi istuuduttuasi kehosi alkaa kärsiä. Jalkojesi toimintaa säätelevät impulssit lakkaavat ja hitaasti mutta varmasti istuminen kasvattaa riskejä jotka saavuttavat pahimmassa tapauksessa fataalin lopputuloksen. Istuminen itsessään on jo uskomattoman vaarallista toimintaa mutta bloggaaja kasvattaa riskiä tuijottamalla näyttöpäätteeseen.

Istuminen on jo itsessään vaarallista, mutta jos istut tietokoneen edessä otat vielä suuremman riskin!

Keskiverto ihminen istuu 9,3 tuntia päivässä. Tästä ajasta yhä suurempi osa vietetään tietokoneen näyttöön tuijottaen ja bloggaajan kohdalla istuminen tapahtuu suurimmalta osin tietokoneen näytön edessä. Istuessasi tietokoneen edessä joudut useinmiten istumaan hieman etu-nojassa. Tämä on tietenkin vaarallisempaa kuin normaali istuskelu, sillä selkälihaksesi joutuvat voimakkaaseen rasitukseen. Silmistäsi puhumattakaan.

Näyttää siis siltä että bloggaaja ottaa suunnattoman riskin kirjoitellessaan blogia. Ehkä juuri siitä syystä kannattaisikin arvostaa sitä uhrausta jonka bloggaaja tekee tuottaessaan materiaalia ihmisten iloksi.

Mitä sitten voi asian hyväksi tehdä? Pitäisikö lopettaa koko riskialtis bloggaaminen kokonaan ja ryhtyä vain käveleskelemään päivät pitkät pitkin maita ja mantuja? Ehkei nyt sentään. Yksi vaihtoehto voisi olla vaikkapa ns. seisonta pöydän käyttäminen. Asetetaan vain läppäri korkean pöydän päälle ja kirjoitellaan blogi kuulumiset seisaaltaan. Näin ainakin pienennät hieman sitä riskiä joka istumatyöstä aiheutuu.

Seisoskelu ei kuitenkaan kuulosta kovinkaan mukavalta. Varsinkin kun vierestä löytyy uutuuttaan kiiltelevä työtuoli tai vaikkapa pehmoinen sohva. Onneksi myös istuma-asentoa muuttamalla voi pienentää pelottavaa kuoleman riskiä, kuten alla olevasta kuvasta selviää.

Muuttamalla sitä kulmaa jossa istuskelet helpotat erilaisia ongelmia joita pitkään paikallaan istuminen saattaa aiheuttaa.

BlogiHaltuun.net suosittelee myös yhtä vaihtoehtoa, nimeltään "Levytys Maximus*" tämä jo antiikin ajoista tunnettu keino rentouttaa niin kehoa kuin mieltä ja helpottaa bloggaajan arkea. Jos et tiedä miten tämän toteutat helpoiten kokeile asettaa läppärisi sängyn päälle ja sen jälkeen asettua itse miellyttävään horisontaali asentoon siten että kykenet vielä näppäilemään tekstiä.

*Varoitus: "levytys maximus" saattaa aiheuttaa unenomaisia harhatiloja jotka voivat vaikeuttaa työn loppuun saattamista.

Vaikka tutkijat tutkivatkin välillä mitä sattuu piilee tässäkin totuuden siemen. Erilaiset selkä ja silmä ongelmat ovat lisääntyneet ja yksi suurimmista pää syyllisistä on nimenomaan tietokoneiden edessä istuminen. Ei kuitenkaan kannata pelästyä tämänkään tutkimuksen tulosta vaan luottaa omaan maalaisjärkeensä, sekä pitää taukoja, myös bloggaamisesta.

Kannattaa opetella pitämään taukoja, aivan kuten koulussa aikanaan 45 minuutin välein ja mennä välitunniksi ihan ulos asti. Haukkaamaan happea. Rentouttavat tauot sekä tarpeellinen uni takaavat sen että pysyt terveenpänä etkä kärsi ikävistä pääkivuista ja säryistä selässä. Kunnolla nukuttu yö myös helpottaa silmiäsi ja antaa niille mahdollisuuden levätä näyttöpäätteeseen tuijottelun aiheuttamasta rasituksesta.

Loppusanat

Tässä kirjoituksessa käsiteltyä tutkimusta ei kannata ottaa niin kovin vakavasti, mutta siinäkin piilee totuuden siemen. Pelkän näyttöpäätteen takaa maailma saattaa näyttää joskus hieman harmaalta. Kannattaakin välillä raahata itsensä ulos katsomaan miltä maailma ikkunan toisella puolella näyttää.

Toivottavasti tämä kirjoitus herättää myös sinut ajattelemaan sitä, mitä voit tehdä parantaaksesi omaa oloasi kirjoitellessasi sitä ah niin rakasta blogiasi.

Blogi terveisin, Mikko....

noreply@blogger.com (Unknown) — Fri, 23 Dec 2011 22:46:00 +0000

Aikuisviihde bloggaajaksi ?

noreply@blogger.com (Unknown) — Sat, 10 Dec 2011 11:44:00 +0000

Tämä kirjoitus on tarkoitettu ainoastaan 18 vuotta täyttäneille sillä siinä käsitellään aikuisviihde -bloggaamista. Pahoittelut kaikille jotka kokevat aiheen olevan loukkaava, kukaan ei pakota sinua tätä artikkelia lukemaan. Niille jotka kuitenkin ovat kiinnostuneita Aikuisviihde -blogin ylläpitämisestä suosittelen tutustumaan artikkelin sisältöön.

Sitä on turha kiistää: internet sisältää pornoa ja paljon. Mistä tämä kaikki sinne oikeastaan ilmestyy? Suurin osa aikuisviihteestä on itseasiassa yksityisten ihmisten sinne lisäämiä kuvia ja enenevässä määrin myös videoita. Miten tämä sitten liittyy aikuisviihde bloggaajaan ?

Itsetuottamansa materiaalin julkaiseminen on varmasti aikuisviihde bloggaajalle hieman harvinaisempaa, eikä pelkästään siitä syystä että materiaalin tuottamiseen editoimiseen jne kuluu aikaa, joka on muutenkin kortilla. Useinmat bloggaajat valitsevatkin toisen lähestymistavan, he hankkivat materiaalinsa 3. osapuolilta. En tarkoita tässätapauksessa piratismia joka piinaa myös tätä alaa, vaan tilannetta jossa bloggaaja käyttää ilmaista promootio -materiaalia tai videoita / kuvia joihin bloggaajalla on oikeus.

Aikuisviihde alaa vaivaa tuskallinen taistelu piratismia vastaan. Moni yrittäjä onkin romahtanut tässä taistelussa ja siirtynyt muihin tehtäviin. Aikuisviihde kuitenkin tuottaa edelleen uskomattomat määrät rahaa ja on takuuvarmasti internetin suurimpia rahasampoja. Tähän kelkkaan on myös moni bloggaaja valmis hyppäämään.

Erotiikasta ja pornosta bloggaaminen on puhtaimmillaan Niche bloggaamista. Siitä syystä aikuisviihde blogiin pätevätkin aivan samat säännöt.

Esimerkki: Pera perustaa blogin johon hän ryhtyy lisäämään materiaalia tytöistä ja kumisaappaista (älkää kysykö miksi). Hän ryhtyy julkaisemaan kerran päivässä kuvia ja videoita. Jatkettuaan tätä pari viikkoa Pera törmää maksulliseen sivustoon joka myös käsittelee kumisaappaiden käytännöllisyyttä nudistirannalla. Tämä kumisaapas sivusto tarjoaa myös mahdollisuutta kumppanuuteen. "Jos joku liittyy linkstäsi saat 100£$€." Tästä riemastuneena Pera läväyttää mainokset blogiinsa. Kuluu kuukausia ja Peran sivuston kävijämäärä kasvaa päivä päivältä, rahaa virtaa uusiin kumisaappaisiin ja Perasta on tullut Aikuisviihde -bloggaaja.

Kaikki eivät tietenkään ole yhtä onnellisessa asemassa Peran kanssa, Pera tajusi jo alusta alkaen että on syytä rajoittaa blogin aihepiiri mahdollisimman tarkasti käsittelemään tiettyä "nicheä". Sen jälkeen sinun tulee jatkaa valitsemasi aiheen parissa, levittää linkkejäsi mahdollisesti aihetta käsittelevissä keskustelupalstoissa sekä pyrkiä kasvattamaan blogisi kävijämäärää. Sisällön säännöllinen lisääminen on aikuisviihde bloggaajalle ehkä vielä tärkeämpää kuin perus bloggaajalle sillä "vaativat" vierailijasi siirtyvät kyllä aivan varmasti toiseen blogiin jos uutta materiaalia ei ilmesty.

Miten sitten aikuisviihde bloggaaja tekee rahaa? Myymällä. Myymällä mainostilaa blogistaan, affiliate myynnillä, myymällä oheistuotteita jne. Aivan samaan tapaan kuin perus bloggaaja. Pornoteollisuuden rattaat pyörivät samalla periaatteella kuin minkä tahansa muunkin. Suurimpana erona voidaan pitää sitä että aikuisviihde on vähemmän herkkä suhdannevaihteluille, eli seksi myy.

Mistä sitten lähteä liikkeelle?

Hosting, eli se mistä aikuisviihde löytää majansa. Yksi aikuisviihde -bloggaajan ongelmista on se että kotia sivuille ei tahdo löytyä. Ei kuitenkaan kannata lähteä merta edemmäs kalaan sillä blogger palvelu tarjoaa myös aikuisviihteestä kiinnostuneille mahdollisuuden perustaa oma blogi. Kunhan vain muistat asettaa bloggerin asetuksista K18 merkinnän päälle, etkä julkaise mitään laitonta materiaalia.

Mistä kävijöitä? Vanhaan hyvään aikaan riitti että perustit aikuisviihde sivuston. Nykyään kilpailu on niin kovaa että tarvitaan työtä sen eteen että sivustosi menestyy. Myy siis sivuasi. Aikuisten keskustelupalstat ja chatit ovat yksi parhaimmista keinoista jakaa tietoa uudesta sivustostasi. Älä kuitenkaan jaa linkkiä ennenkuin materiaalia on tarpeeksi*. (*lue: paljon)

Mistä rahaa? Yksi varteenotettava vaihtoehto on esimerkiksi JuicyAds, moneen kertaan palkittu aikuisviihde mainoksiin keskittynyt mainosverkosto. Maksut tulevat ajallaan ja voit olla varma että et tietämättäsi levitä viruksia tai muuta epäilyttävää.

Muita ansaintavaihtoehtoja voivat olla erilaiset FileHost palvelut kuten FileSonic. Jonka avulla voit ansaita helposti satoja euroja päivässä.

Miten aikuisviihde blogin pitäminen poikkeaa tavallisesta blogista? Suurin ero on tietenkin se että kävijämäärä on suuri. BlogiHaltuun.net pääsi tutustumaan erään Suomalaisen aikuisviihde bloggaajan kävijätilastoihin ja ei voi muuta sanoa kuin bravo! Kateutta voi kasvattaa esimerkiksi tälläisillä tilastoilla:

Yli 500 000 sivunlatausta / kk
Yli 70 000 uniikkia kävijää / kk
Yli 3900 € tulot /kk
Yli 10 000 kävijää = päiväennätys (tuloja 562,90€)

Toinen merkittävä ero on päivityksien määrä, ei ole ollenkaan poikkeavaa että aikuisviihde blogia päivitetään kymmenenkin kertaa päivässä. Eli työtä riittää huomattavan paljon enemmän kuin kirjoitettaessa perinteistä blogia.

Onneksi olkoon menestyksestäsi "Pera" ja kiitoksia siitä että BlogiHaltuun.net pääsi tutustumaan Aikuisviihde bloggaajan arkeen.

Valikot kuntoon blogissa

noreply@blogger.com (Unknown) — Sat, 26 Nov 2011 15:18:00 +0000

06-12-2011, jossain päin Suomea....

Nyt on itsenäisyyttä jälleen juhlittu ja ei kun asiaan. Kuten aikaleimasta näkyy tätä kirjoitusta on koostettu jo pidemmän aikaa ahkerasti ja olen yrittänyt koota tähän mahdollisimman kattavan otoksen erilaisia keinoja rakentaa valikko blogissa. Kirjoitin tämän blogin alkutaipaleella artikkelin joka käsittelee blogin valikoiden perusteita ja sitä miten saat nopeasti ja helposti tehtyä blogiisi valikon. Kannattaakin käydä ensin tutustumassa siihen ja sitten hyökätä tämän hieman pidemmälle viedyn artikkelin pariin.

Yhtä paljon kun on blogeja maailmassa löytyy myös erilaisia blogin navigointeja. Navigoinnilla tarkoitetaan yleensä joko sivuston yläosassa tai sivupalkissa sijaitsevaa listausta blogin sisäisistä linkeistä, jonka avulla sivustolla vieraileva pääsee helposti tutustumaan koko sisältöön ja löytää etsimänsä mahdollisimman nopeasti. Juuri siksi kannattaa sivuston navigointiin ja sitä kautta valikkoihin panostaa erityisen paljon, sillä mitä lukijaystävällisempi sivustosi on sitä suuremmalla todennäköisyydellä vierailija palaa sivustollesi uudelleen.

Monelle kuitenkin navigointi on itsestäänselvyys jolloin esille nousevat ennenkaikkea esteettiset seikat, eli se miltä valikko itseasiassa näyttää ja miten se on toteutettu. Erityisesti blogin ulkoasu on monelle bloggaajalle usein sisältöään tärkeämpi ja siksi valikon tulisi myös näyttää mahdollisimman hyvältä, eikä ainoastaan "olla toimiva". Tämä kirjoitus tarjoaa myös vinkkejä siihen miten voit muokata itsellesi juuri sellaisen valikon kun haluat, eikä sinun tarvitse tyytyä esimerkiksi bloggerin omaan pelkistettyyn "sivut" navigointiin. Vaikka se onkin täysin toimiva ratkaisu.

Valikoista yleensä:

Normaalisti blogin navigointi toteutetaan blogin ylä-osassa horisontaalisesti, kuten tässä blogissa, tai valikko on blogin sivupalkissa. Vaikka blogit tarjoavat monia muitakin keinoja löytää haluamansa artikkelit kuten kirjoitusten "arkisto" tms. perinteinen valikko-navigointi pitää yhä pintansa. Ehkä juuri siitä syystä että se on erittäin toimiva.

Valikkojen toiminta on yksinkertainen. Valikko sisältää vain normaalin linkin, mutta linkki viittaa johonkin blogin sisäiseen sivuun, kuten vaikkapa etusivu. Usein valikkoa kuitenkin "kaunistellaan" käyttämällä erilaisia kuvia valikon taustalla tai valikoon on koodin puolella lisätty efektiä, esimerkiksi silloin kun hiiren kursori on valikon jonkin osan päällä.

Valikon kuten kaiken muunkin blogin visuaalisen puolen muotoilu tapahtuu käyttämällä CSS määrittelyjä. CSS:n avulla voidaan nykyisin rakentaa uskomattoman tyylikkäitä navigointi ratkaisuja ja ulkopuolisen scriptin käyttö ei ole enää pakollista. Edelleen on kuitenkin hyvin yleistä että valikko rakennetaan kolmesta eri osasta: HTML-osa (määrittää missä valikko sijaitsee) CSS-osa (määrittää miltä valikko näyttää) ja J.Query-osa (määrittelee valikon toiminnan).

Valikko bloginsa näköiseksi

Vaikka sisältö onkin tärkeintä blogin antia, tulisi sen myös näyttää mahdollisimman hyvältä. Valikot eivät ole poikkeus vaan blogin navigoinnin tulisi sulautua muun blogin ulkoasuun saumattomasti.

Blogin valikko tuleekin rakentaa siten että sen ulkoasua on helppo muokata, tässä kohtaa CSS astuu mukaan kuvioihin ja rakentamalla CSS-koodi oikein voidaan taata että valikon ulkoasu miellyttää varmasti silmää ja se että valikon ulkoasua on helppo muuttaa.

CSS- osassa voidaan määrittää valikossa käytettävät fontit, erilaiset värit sekä varjostukset, valikon "solujen" muoto ja koko jne.

Nyt kun olen saanut päkistyä valikoista ja niiden koostumuksesta tarpeeksi on kai aika siirtyä itseasiassa siihen kiinnostavaan osaan eli valikoihin itseensä esittelyssä on 4 erityyppistä navigointi ratkaisua jotka jokainen on toteutettu käyttämällä HTML:ää ja CSS:ää ja edustavat jokainen hieman erityyppisiä valikko ratkaisuja.

1. Vaaka navigointi

Vaakatasoon sijoitettu navigointi on yleisin vaihtoehto, mutta moni ei ota täyttä mahdollisuutta irti tästä navigoinnista.

Tälläisen navigoinnin aikaansaaminen bloggerissa ei vaadi mitään tietämystä HTML:stä tai CSS:stä sillä voit luoda tämäntapaisen navigoinnin vaivatta käyttämällä bloggerin omaa "Sivut" ominaisuutta. Ennen bloggerin uudistusta tällaisen navigoinnin käyttäminen johti siihen että saatoit linkittää ainoastaan bloggerin omia "sivuja". Erikseen luotuja sivuja joille blogger määritteli oman url osoitteen. Päivityksen jälkeen voi bloggerin "omaan valikkoon" voi lisätä myös ns. ulkoisia url osoitteita, eli linkittää esimerkiksi kirjoitusten eri tunnisteisiin jne.

Näin lisäät perus- navigoinnin:

Kirjaudu bloggeriin ja mene "Sivut" välilehdelle, sieltä valitset uusi sivu. Voit joko luoda uuden "staattisen" sivun kuten vaikkapa info sivun kirjoittajasta tai kirjoittaa tietoja omasta blogistasi. Tämän vaihtoehdon lisäksi voit myös linkitää ulkoiseen URL-osoitteeseen. Eli minne tahansa internetissä. Voit myös linkittää tämän avulla tiettyihin blogisi kirjoituksiin tai blogisi tunnisteisiin.

Tunnisteen url osoitteen selvität seuraavasti:

Tunnisteiden (labels) url-osoitteet saat helpoiten klikkaamalla blogissasi tunnitetta jonka osoitteen haluat tietää ja sen jälkeen kopioit vain selaimen osoite kentässä olevan osoitteen. (Tunnisteiden osoitteet ovat muotoa: http://www.omablogisi.com/search/label/TunnisteesiNimi).

Lisättyäsi haluamasi linkit blogisi valikkoon on aika hieman muokata sen ulkoasua:

Tämä onnistuu helpoiten käyttämällä bloggerin omaa "Mallin suunnittelu työkalua" joka löytyy Malli sivulta kun valitset kohdan "Mukauta".

Suunnittelu työkalussa siirry kohtaan lisäasetukset ja etsi sieltä kohta "välilehtien teksti" / "välilehtien tausta", joiden avulla voit muuttaa valikon linkkien fonttia ja taustaväriä.

2. Sivupalkki navigointi

Aivan kuten normaali horisontaali valikko, toimii yhtä usein sivupalkkiin asetettu navigointi loistavasti. Perus sivupalkki-navigoinnin asettaminen on aivan samanlainen prosessi kuin edellä ollut vaakaatasoon asetettu navigointi. Voit siis lisätä linkit samaan tapaan. Kun haluat että navigointi sijoittuu sivupalkkiin valitset sen vain "Sivut" välilehdeltä löytyvistä asetuksista.

Nyt kun on käyty läpi perus valikkojen rakentaminen blogger blogissa on kait syytä siirtyä hieman erikoisempien ratkaisujen pariin. Kuten jo kerroin blogin valikko on tärkeä osa blogin käytettävyyttä ja jokainen bloggaaja haluaa blogistaan mahdollisimman helppokäyttöisen.

Tätä käytettävyyttä voi yrittää parantaa myös hieman erilaisilla ratkaisuilla:

3. Drop down valikko

("Vie hiiren kursori tämän päälle" sivulla: http://blogihaltuunshowcase.blogspot.com/ )

CSS-osa

.drop-menu {
position:absolute;z-index:100;
display: block;
margin-right: auto;
margin-left: auto;
text-align: left;
padding: 10px 10px;
font-size: 22px;
height: 25px;
max-height: 25px;
width: 400px;
background: #fff;
cursor: pointer;
border: 1px solid #f6f0e4;
} .plus {
display: inline-block;
-webkit-transition: .3s ease-in-out;
-moz-transition: .3s ease-in-out;
-o-transition: .3s ease-in-out;
} .drop-menu:hover {
border: 1px solid #fff;
} .drop-menu:hover .sub-menu {
display: inline-block;
}
.drop-menu:hover .plus {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
}
.sub-menu {
display: none;
width: 400px;
background: #fff;
padding: 10px 10px;
margin-left: -11px;
margin-top: 10px;
border: 1px solid #fff;
-webkit-box-shadow: 0px 13px 25px rgba(0,0,0, 0.2);
-moz-box-shadow: 0px 13px 25px rgba(0,0,0, 0.2);
box-shadow: 0px 13px 25px rgba(0,0,0, 0.2);
}
.sub-menu li {
list-style-type: none;
display: block;
border-bottom: 1px dotted #eaeaea;
font-size: 19px;
height: 22px;
padding: 8px 0;
}
.sub-menu li img {
margin-right: .5em;
}
.sub-menu li:hover {
border-bottom: 1px dotted #bababa;
}

HTML-osa

<div class="drop-menu">
<span class="plus">+</span> Vie hiiren kursori tämän valikon päälle <br />
<ul class="sub-menu">
<li>
<a href="">
<img alt="rss" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIPoHcKqUrqkGniXJ7-H5SLKzV9Ue3y3G8OJPxPk7eZl15x93zGn8Si1q_trr6rqBHribshEly4yeQrOe7xt-l0z6q3fjiwweeCYpm4XyuW5w4y6LX2x0sEypF_30QCYUrwvGF91W90EDi/s1600/rss.png" /> Tilaa RSS-syöte </a>
</li>
<li>
<a href="">
<img alt="email" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIPoHcKqUrqkGniXJ7-H5SLKzV9Ue3y3G8OJPxPk7eZl15x93zGn8Si1q_trr6rqBHribshEly4yeQrOe7xt-l0z6q3fjiwweeCYpm4XyuW5w4y6LX2x0sEypF_30QCYUrwvGF91W90EDi/s1600/rss.png" /> Tilaa kirjoitukset sähköpostiin </a>
</li>
<li>
<a href="">
<img alt="twitter" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcuyabycNX_xTRgYCFwbQfYyud9qrRlEzh-NwjWKEfT3bMDCm7xwrDcrwOPjUw5zkAuQFoCBkudMynAvN3j3RD9ecjH5ylfE980sYC0Mkrj58Uw2hG-4geSQZnt3nu94ctA73TGlhgmXYR/s1600/twitter.png" /> Seuraa Twitterissä
</a>
</li>
</ul>
</div>

4. Laajennettava valikko

Tämä valikkoratkaisu on hieman erilainen ja toimii parhaiten blogeissa jotka pyrkivät minimalismiin.
(Valikkomalli1 sivulla: http://blogihaltuunshowcase.blogspot.com/)

J.Query-osa: Lisää blogisi lähdekoodiin heti header tagin jälkeen kaksi j.query:n latauksen määrittävää osaa tähän tapaan:

<head>

<scriptsrc='https://sites.google.com/site/lolztube2011/jscript/menu.js' type='text/javascript'/>

CSS-osa

ul.menu, ul.menu ul {
list-style-type:none;
margin: 0;
padding: 0;
width: 15em;
}
ul.menu a {
display: block;
text-decoration: none;
}
ul.menu li {
margin-top: 1px;
}
ul.menu li a, ul.menu ul.menu li a {
background: #333;
color: #fff;
padding: 0.5em;
}
ul.menu li a:hover, ul.menu ul.menu li a:hover {
background: #000;
}
ul.menu li ul li a, ul.menu ul.menu li ul li a {
background: #ccc;
color: #000;
padding-left: 20px;
}
ul.menu li ul li a:hover, ul.menu ul.menu li ul li a:hover {
background: #aaa;
border-left: 5px #000 solid;
padding-left: 15px;
} ul.menu ul.menu li a:hover {
border-left: 0;
padding-left: 0.5em;
}
ul.menu ul.menu {
border-left: 5px #f00 solid;
}
ul.menu a.active, ul.menu ul.menu li a.active, ul.menu a.active:hover, ul.menu ul.menu li a.active:hover {
text-decoration: underline;
background: #c00;
}
div.panel {
border: 1px #000 solid;
padding: 5px;
margin-top: 1px;
}
ul.menu div.panel a, ul.menu div.panel li a:hover {
display :inline;
color: #666;
background: none;
margin: 0;
padding: 0;
border: none;
font-weight: bold;
}
ul.menu div.panel a:hover {
color: #000;
text-decoration: underline;
} .code {
border: 1px solid #ccc;
list-style-type: decimal-leading-zero;
padding: 5px;
margin: 0;
}
.code code {
display: block;
padding: 3px;
margin-bottom: 0;
}
.code li { background: #ddd;
border: 1px solid #ccc;
margin: 0 0 2px 2.2em;
}
.indent1 {
padding-left: 1em;
}
.indent2 {
padding-left: 2em;
}
.indent3 {
padding-left: 3em;
} .indent4 {
padding-left: 4em;
}
.indent5 {
padding-left: 5em;
}
.indent6 {
padding-left: 6em;
}
.indent7 {
padding-left: 7em;
}
.indent8 {
padding-left: 8em;
}
.indent9 {
padding-left: 9em;
}
.indent10 {
padding-left: 10em;
}

HTML-osa:

<ul class="menu noaccordion">
<li>
<a href="#">Blogityökalut </a>
<ul class="acitem">
<li><a href="">PivotX</a></li>
<li><a href="">WordPress</a></li>
<li><a href="">Textpattern</a></li>
<li><a href="">Typo</a></li>
</ul>
</li>
<li>
<a href="#">Ohjelmointi kielet</a>
<ul class="acitem">
<li><a href="http://www.php.net/">PHP</a></li>
<li><a href="http://www.ruby-lang.org/en/">Ruby</a></li>
<li><a href="http://www.python.org/">Python</a></li>
<li><a href="http://www.perl.org/">PERL</a></li>
<li><a href="http://java.sun.com/">Java</a></li>
<li><a href="http://en.wikipedia.org/wiki/C_Sharp">C#</a></li>
</ul>
</li>
<li><a href="http://www.blogihaltuun.net">BlogiHaltuun.net</a></li>
<li>
<a href="#">Lisää kaikkea</a>
<ul class="acitem">
<li><a href="">Bookalicious</a></li>
<li><a href="">Apple</a></li>
<li><a href="">Nikon</a></li>
<li><a href="">XBOX360</a></li>
<li><a href="">Nintendo</a></li>
</ul>
</li>
<li>
<a href="#">Hakukoneet </a>
<ul class="acitem">
<li><a href="http://search.yahoo.com/">Yahoo!</a></li>
<li><a href="http://www.google.com/">Google</a></li>
<li><a href="http://www.ask.com/">Ask.com</a></li>
<li><a href="http://www.live.com/?searchonly=true">Live Search</a></li>
</ul>
</li>
</ul>

5. Megavalikko (Bonus)

Kun mikään ei riitä valikosta voi tehdä suuren. Voit käydä katsastamassa tämän valikon täältä: http://blogihaltuunshowcase.blogspot.com/

(valikko on sivun ylä-osassa)

Megavalikko on vaaka-valikko joka on kasvatettu mahdollisimman suureksi, ja siinä pyritään valikkoon sisällyttämään mahdollisimman paljon informaatiota.

Megavalikko CSS:

body, ul, li {
font-size:14px;
font-family:Arial, Helvetica, sans-serif;
line-height:21px;
text-align:left;
}
#menu {
list-style:none;
width:940px;
margin:30px auto 0px auto;
height:43px;
padding:0px 20px 0px 20px;

/* Pyoristetyt kulmat */

-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;

/* Taustavarit */
background: #014464;
background: -moz-linear-gradient(top, #0272a7, #013953);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0272a7), to(#013953));

/* Reunukset */
border: 1px solid #002232;
-moz-box-shadow:inset 0px 0px 1px #edf9ff;
-webkit-box-shadow:inset 0px 0px 1px #edf9ff;
box-shadow:inset 0px 0px 1px #edf9ff;
}
#menu li {
float:left;
display:block;
text-align:center;
position:relative;
padding: 4px 10px 4px 10px;
margin-right:30px;
margin-top:7px;
border:none;
}
#menu li:hover {
border: 1px solid #777777;
padding: 4px 9px 4px 9px;

/* Taustavarit ja variliut */

background: #F4F4F4;
background: -moz-linear-gradient(top, #F4F4F4, #EEEEEE);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F4F4F4), to(#EEEEEE));

/* Pyoristetyt reunat */

-moz-border-radius: 5px 5px 0px 0px;
-webkit-border-radius: 5px 5px 0px 0px;
border-radius: 5px 5px 0px 0px;
}
#menu li a {
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color: #EEEEEE;
display:block;
outline:0;
text-decoration:none;
text-shadow: 1px 1px 1px #000;
}
#menu li:hover a {
color:#161616;
text-shadow: 1px 1px 1px #ffffff;
} #menu li .drop {
padding-right:21px;
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjycmDbMkcTTWVGVG4AuVyx7HRwT3-UA7eT-hU_qbYEEEp-Wn9rd5CGh7KcNW01kB_JI3Pr8PULiBn4PiVSNipCHYfDWuGnu4Yhkz-YiUXRAfCpXehYd7NqNWUYYwppLrm1b22c9U27S2tp/s1600/drop.png") no-repeat right 8px;
}
#menu li:hover .drop {
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipBNQ9rMb3Xw_gbaVsYdTsvnY2IEQhC9yc1t-G_s8uqBKwsLdGNZLoxVJvx468VmqIpEDXNlItpC4MIK2wwXEHwwAB_7dMOvzqAc_r21JYdS5wYMg3ea5X4m4CMAszod9TLFndDdlfQo9j/s1600/drop.gif") no-repeat right 7px;
}
.dropdown_1column,
.dropdown_2columns,
.dropdown_3columns,
.dropdown_4columns,
.dropdown_5columns {
margin:4px auto;
float:left;
position:absolute;z-index:100;
left:-999em; /* Piilottaa valikon */
text-align:left;
padding:10px 5px 10px 5px;
border:1px solid #777777;
border-top:none;

/* Gradient tausta */
background:#F4F4F4;
background: -moz-linear-gradient(top, #EEEEEE, #BBBBBB);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#EEEEEE), to(#BBBBBB));

/* Pyoristetyt reunat */
-moz-border-radius: 0px 5px 5px 5px;
-webkit-border-radius: 0px 5px 5px 5px;
border-radius: 0px 5px 5px 5px;
}

.dropdown_1column {width: 140px;}
.dropdown_2columns {width: 280px;}
.dropdown_3columns {width: 420px;}
.dropdown_4columns {width: 560px;}
.dropdown_5columns {width: 700px;}

#menu li:hover .dropdown_1column,
#menu li:hover .dropdown_2columns,
#menu li:hover .dropdown_3columns,
#menu li:hover .dropdown_4columns,
#menu li:hover .dropdown_5columns {
left:-1px;
top:auto;
}

.col_1,
.col_2,
.col_3,
.col_4,
.col_5 {
display:inline;
float: left;
position: relative;
margin-left: 5px;
margin-right: 5px;
}
.col_1 {width:130px;}
.col_2 {width:270px;}
.col_3 {width:410px;}
.col_4 {width:550px;}
.col_5 {width:690px;}

#menu .menu_right {
float:right;
margin-right:0px;
}
#menu li .align_right {
/* Pyoristetyt reunat */
-moz-border-radius: 5px 0px 5px 5px;
-webkit-border-radius: 5px 0px 5px 5px;
border-radius: 5px 0px 5px 5px;
}

#menu li:hover .align_right {
left:auto;
right:-1px;
top:auto;
}
#menu p, #menu h2, #menu h3, #menu ul li {
font-family:Arial, Helvetica, sans-serif;
line-height:21px;
font-size:12px;
text-align:left;
text-shadow: 1px 1px 1px #FFFFFF;
}
#menu h2 {
font-size:21px;
font-weight:400;
letter-spacing:-1px;
margin:7px 0 14px 0;
padding-bottom:14px;
border-bottom:1px solid #666666;
}
#menu h3 {
font-size:14px;
margin:7px 0 14px 0;
padding-bottom:7px;
border-bottom:1px solid #888888;
}
#menu p {
line-height:18px;
margin:0 0 10px 0;
}

#menu li:hover div a {
font-size:12px;
color:#015b86;
}
#menu li:hover div a:hover {
color:#029feb;
}

.strong {
font-weight:bold;
}
.italic {
font-style:italic;
}
.imgshadow { /* Parempi tyyli vaalealle taustalle */
background:#FFFFFF;
padding:4px;
border:1px solid #777777;
margin-top:5px;
-moz-box-shadow:0px 0px 5px #666666;
-webkit-box-shadow:0px 0px 5px #666666;
box-shadow:0px 0px 5px #666666;
} .img_left { /* Kuva vasempaan reunaan */
width:auto;
float:left;
margin:5px 15px 5px 5px;
} #menu li .black_box {
background-color:#333333;
color: #eeeeee;
text-shadow: 1px 1px 1px #000;
padding:4px 6px 4px 6px;

/* Pyoristetyt reunat */
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;

/* Varjostus */
-webkit-box-shadow:inset 0 0 3px #000000;
-moz-box-shadow:inset 0 0 3px #000000;
box-shadow:inset 0 0 3px #000000;
}

#menu li ul {
list-style:none;
padding:0;
margin:0 0 12px 0;
}
#menu li ul li {
font-size:12px;
line-height:24px;
position:relative;
text-shadow: 1px 1px 1px #ffffff;
padding:0;
margin:0;
float:none;
text-align:left;
width:130px;
}
#menu li ul li:hover {
background:none;
border:none;
padding:0;
margin:0;
}
#menu li .greybox li {
background:#F4F4F4;
border:1px solid #bbbbbb;
margin:0px 0px 4px 0px;
padding:4px 6px 4px 6px;
width:116px;

/* Pyoristetty reuna */
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
}
#menu li .greybox li:hover {
background:#ffffff;
border:1px solid #aaaaaa;
padding:4px 6px 4px 6px;
margin:0px 0px 4px 0px;
}

Megavalikko HTML:

(Huom tätä HTML osaa ei voi lisätä bloggerissa HTML/javascript gadgettiin vaan se on asetettava suoraan blogin lähdekoodiin.) Hyvä paikka tälle jättivalikolle löytyy esimerkiksi kohdasta: <b:includable id='main'> lisäät vain html koodin välittömästi tämän jälkeen. MegaValikko sijoittuu silloin aivan blogin yläosaan, kuten esimerkissä.

<ul id='menu'>
<li><a class='drop' href='#'>Etusivu</a>
<div class='dropdown_2columns'>
<div class='col_2'>
<h2>Tervetuloa !</h2>
</div>
<div class='col_2'>
<p>Hei ja tervetuloa, tämän tarkoitus on esitellä Mega-valikon toimintaa ja sitä millaisia mahdollisuuksia valikoissa oikeastaan on.</p>
<p>Valikon voi rakentaa tärkeimmäksi osaksi koko blogia, jos käyttää siihen hieman aikaa.</p>
</div>
<div class='col_2'>
<h2>Tämä valikko toimii useissa selaimissa:</h2>
</div>
<div class='col_1'>
<img alt='' height='48' src='img/browsers.png' width='125'/>
</div>
<div class='col_1'>
<p>Tämän valikon toimivuus on testattu useissa selaimissa.</p>
</div>
</div>
</li>
<li><a class='drop' href='#'>5 kappaletta</a>
<div class='dropdown_5columns'>
<div class='col_5'>
<h2>Tämä osa sisältää yhteensä 5 kappaletta leveän tilan kaikenlaiselle tekstille!</h2>
</div>
<div class='col_1'>
<p class='black_box'>Tällä tummalla laatikolla on helppo korostaa tekstiä, joka on tärkeä. Voit vaikka laittaa tietoa blogistasi tähän. </p>
</div>
<div class='col_1'>
<p>Kirjoitustila ei ihan heti lopu tästä valikosta vaan voit lisätä vaikka tietoja itsestäsi, blogistasi tai vaikka viimeisimmistä artikkeleista.</p>
</div>
<div class='col_1'>
<p class='italic'>Voit käyttää mitä tahansa tekstin muotoilua, kuten kursiivia tai lihavointia, sillä valikko on koostettu normaalilla HTML-koodilla. </p>
</div>
<div class='col_1'>
<p>Tässä vielä hieman lisää täyte tekstiä. Oletko muuten tiennyt että BlogiHaltuun.net on myös Google+:ssa?</p>
</div>
<div class='col_1'>
<p class='strong'>Kannattaa käydä tutustumassa Google+ sivuihin sillä sinne ilmestyy materiaalia, jota ei muualla julkaista..</p>
</div>
<div class='col_5'>
<h2>Voit myös käyttää valikossa erilaisia kuvia lisänä.</h2> </div>
<div class='col_3'>
<img alt='' class='img_left imgshadow' height='70' src='https://ssl.gstatic.com/images/icons/gplus-64.png' width='70'/>
<p>BlogiHaltuun.net Google+ sivuilla esitellään kiinnostavia blogeja. Voit vierailla G+ profiilissa.<a href='https://plus.google.com/105961333715860193693?prsrc=3'>täällä</a></p><br/><br/>
<img alt='' class='img_left imgshadow' height='70' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1fGnwjfq1y6yHlKg4yaMNRJEntDXxRm5zkEFNRwAxtQlfLTENgYxEqhqeUhPK-RLyOl52MuvjOygk-lwW7XPf56xLqbNN5ZaQO91HmC_cLJaCjAQn4Yn3LNoMtOQmgTEnPMGy2sKwEM2U/s1600/facebook_button.jpg' width='70'/>
<p>Google+:n lisäksi BlogiHaltuun.net löytyy tietenkin Facebookista. Kannattaa myös käydä katsastamassa facebook sivut ja klikata sitä tykkäys nappia. Facebookin kautta voit myös helposti kysyä bloggaamisesta!<a href='http://www.facebook.com/pages/BlogiHaltuunnet/210174815673570'>Täältä...</a></p>
</div>
<div class='col_2'>
<p class='black_box'>Tiesitkö muuten että BlogiHaltuun.net sisältää jo yli 100 artikkelia bloggaamisesta ja lisää on luvassa!</p>
</div>
</div>
</li>
<li><a class='drop' href='#'>4 kappaletta</a>
<div class='dropdown_4columns'>
<div class='col_4'>
<h2>Kiinnostavia artikkeleita:</h2>
</div>
<div class='col_1'>
<h3>Blogger vinkit</h3>
<ul>
<li><a href='#'>BlogiHaltuun.net</a></li>
<li><a href='#'>BlogiHaltuun.net</a></li>
<li><a href='#'>BlogiHaltuun.net</a></li>
<li><a href='#'>BlogiHaltuun.net</a></li>
<li><a href='#'>BlogiHaltuun.net</a></li>
</ul>
</div>
<div class='col_1'>
<h3>Aloittelijalle</h3>
<ul>
<li><a href='#'>BlogiHaltuun.net</a></li>
<li><a href='#'>BlogiHaltuun.net</a></li>
<li><a href='#'>BlogiHaltuun.net</a></li>
<li><a href='#'>BlogiHaltuun.net</a></li>
<li><a href='#'>BlogiHaltuun.net</a></li>
</ul>

</div>
<div class='col_1'>
<h3>Hieman lisää</h3>
<ul>
<li><a href='#'>BlogiHaltuun.net</a></li>
<li><a href='#'>BlogiHaltuun.net</a></li>
<li><a href='#'>BlogiHaltuun.net</a></li>
<li><a href='#'>BlogiHaltuun.net</a></li>
<li><a href='#'>BlogiHaltuun.net</a></li>
</ul>
</div>
<div class='col_1'>
<h3>Ja vielä lisää</h3>
<ul>
<li><a href='#'>Tämän</a></li>
<li><a href='#'>avulla</a></li>
<li><a href='#'>vain</a></li>
<li><a href='#'>esitellään</a></li>
<li><a href='#'>ominaisuuksia</a></li>
</ul>
</div>
</div>
</li>
<li class='menu_right'><a class='drop' href='#'>1 Kappale</a>
<div class='dropdown_1column align_right'>
<div class='col_1'>
<ul class='simple'>
<li><a href='#'>Valikkoon</a></li>
<li><a href='#'>voi</a></li>
<li><a href='#'>rakentaa</a></li>
<li><a href='#'>millaisen</a></li>
<li><a href='#'>listauksen</a></li>
<li><a href='#'>kirjoittamistaan</a></li>
<li><a href='#'>artikkeleista</a></li> <li><a href='#'>haluaa.</a></li>
<li><a href='#'>Lista</a></li>
<li><a href='#'>voi</a></li>
<li><a href='#'>olla</a></li>
<li><a href='#'>miten</a></li>
<li><a href='#'>pitkä</a></li>
<li><a href='#'>tahansa</a></li>
<li><a href='#'/></li>
</ul>
</div>
</div>
</li>
<li class='menu_right'><a class='drop' href='#'>3 kappaletta</a>
<div class='dropdown_3columns align_right'>
<div class='col_3'>
<h2>Erilaisia listauksia voi myös laittaa laatikoihin</h2>
</div>
<div class='col_1'>
<ul class='greybox'>
<li><a href='#'>Linkit</a></li>
<li><a href='#'>Mahdollisesti</a></li>
<li><a href='#'>Huomiota</a></li>
<li><a href='#'>Erillisiin</a></li>
<li><a href='#'>Takaamiseksi</a></li>
</ul>
</div>
<div class='col_1'>
<ul class='greybox'>
<li><a href='#'>Joihin</a></li>
<li><a href='#'>Kiinnitettävän</a></li>
<li><a href='#'>Voidaan</a></li>
<li><a href='#'>Laatikoihin</a></li>
<li><a href='#'>Tähän</a></li>
</ul>
</div>
<div class='col_1'>
<ul class='greybox'>
<li><a href='#'>Halutaan</a></li>
<li><a href='#'>Enemmän</a></li>
<li><a href='#'>Asettaa</a></li>
<li><a href='#'>Huomion</a></li>
<li><a href='#'>Tapaan...</a></li>
</ul>
</div>
<div class='col_3'>
<h2>Voit myös yhdistellä kuvia valikkoon lisää</h2> </div>
<div class='col_3'>
<img alt='' class='img_left imgshadow' height='70' src='https://ssl.gstatic.com/images/icons/gplus-64.png' width='70'/> <p>Google plussan puolelle on suunnitteilla myös kilpailu. Eli kannattaa ottaa Google+ ja BlogiHaltuun. <a href='https://plus.google.com/105961333715860193693?prsrc=3'>Täällä...</a></p> <br/><br/>
<img alt='' class='img_left imgshadow' height='70' src='http://tweepi.com/blog/wp-content/uploads/2011/04/t12.jpg' width='70'/>
<p>Blogihaltuun.net on myös twitterissä, jonka avulla on helppo pysyä kärryillä siitä mitä BlogiHaltuun.net:ssä tapahtuu juuri nyt. <a href='http://twitter.com/#!/BlogiHaltuun'>Twitteriin...</a></p>
</div>
</div>
</li>
</ul>

Tämä valikko on tarkoitettu esimerkiksi siitä millainen voi valikko olla kun sen kaikki ominaisuudet otetaan käyttöön. Harvempi perus bloggaaja tarvitsee tämänkaltaista valikko "hirviötä" mutta toisinaan tälläinen "Mega valikko" on paikallaan tuomaan huomattavaa lisäarvoa sivustolle.

Varsinkin tietystä aiheesta kuten muoti, elektroniikka jne bloggaavan kannattaakin miettiä aivan varteenotettavana vaihtoehtona tälläistä megavalikkoa. Jos kiinnostusta löytyy iskeä omaan blogiinsa tälläinen valikko siitä saattaa olla arvaamaton apu blogin suosion kasvattamisessa sillä tällaisen valikon avulla on todella helppo tuoda esille omia kirjoituksiaan.

Loppusanat

Valikoissa on mistä valita. Kannattaakin miettiä tarkkaan millaisen navigaatioratkaisun haluaa omaan blogiinsa luoda. Valikon onnistunut rakenne ja käytettävyys voivat ratkaista sen menestyykö blogisi kilpailussa lukijoista. Valikkoa ei varsinkaan kannata karttaa esteettisistä syistä sillä muokkaamalla CSS-koodia voit helposti tehdä aivan oman näköisesi valikko ratkaisun.

Jos sinulla on kysyttävää valikoista tai bloggaamisesta yleensä kannattaa ottaa yhteyttä kommenttina tai kysy bloggaamisesta lomakkeen kautta.

Efektiä kuvaan CSS:llä

noreply@blogger.com (Unknown) — Mon, 14 Nov 2011 14:00:00 +0000

Vie kursori kuvan päälle

Halusin kirjoittaa pikavinkin, koska kysymysten tulva koskien tätä yhtä ja ainoaa kuviin liittyvää muokkausta on ylittänyt ns. kipukynnyksen. Kyseessä on yksinkertainen CSS- koodi jossa määritellään kuvan "näkyvyys". Tälläinen fade efekti on useista valokuva- ja muotiblogeista tuttua kauraa ja luultavasti juuri siksi hyvin kysytty.

Onneksi tämänlaisen efektin tekeminen on hyvin helppoa ja annankin kaksi erilaista vaihtoehtoa ko. efektien tekemiseen.

Vaihtoehto 1: Kaikki blogissa julkaistavat kuvat

Kuten usein tilanne on, haluaa bloggaaja tälläisen kuva- efektin käsittävän kaikki bloginsa kuvat. Tämän saavuttamiseksi ei tarvita muuta kuin 2 riviä CSS-koodia.

Koodi tulee lisätä blogisi CSS-osaan

img { filter: alpha(opacity=80); opacity:.80; -webkit-transition: all .3s ease-out; -moz-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .3s ease-out;}

img:hover { filter: alpha(opacity=100); opacity:1.0; -webkit-transition: all .9s ease-out; -moz-transition: all .6s ease-out; -o-transition: all .6s ease-out; transition: all .7s ease-out;}

Koodin ensimmäinen rivi määrittelee että kuvan näkyvyys on 80% alkuperäisestä ja toinen rivi taas sen että kuva tulee 100% näkyväksi kun hiiren kursori viedään kuvan päälle.

Vaihtoehto 2: yksittäiset kuvat

Melkein yhtä usein kun käyttäjä haluaa kaikkiin kuviinsa tälläisen efektin halutaan että vain tiettyihin kuviin voitaisiin asettaa tämä fade efekti. Tämä onnistuu lähes yhtä helposti. Ainoana erona on tietenkin se että kirjoittaessasi blogikirjoituksia sinun täytyy muistaa määritellä ne kuvat joihin haluat ko. efektin. Blogin CSS-osaan tulee ensin lisätä seuraavat koodin osat:

#kuvaefekti img {
filter: alpha(opacity=80);
opacity:.80;
-webkit-transition: all .3s ease-out;
-moz-transition: all .2s ease-out;
-o-transition: all .2s ease-out;
transition: all .3s ease-out;
}

#imghover img:hover {
filter: alpha(opacity=100);
opacity:1.0; -webkit-transition: all .9s ease-out;
-moz-transition: all .6s ease-out;
-o-transition: all .6s ease-out;
transition: all .7s ease-out;
}

Tämän jälkeen aina kun haluat lisätä kuvaan tämän efektin tulee sinun kirjoituksen yhteydessä siirtyä HTML puolelle ja lisätä kuvan ympärille seuraava koodi:

Loppusanat

Jos mieleesi tulee lisää kysymyksiä kuvista tai muusta bloggaamiseen liittyvästä ei muuta kuin härkää sarvista ja ota yhteyttä, joko käyttäen kysy bloggaamisesta lomaketta, kommenttina tai nyt myös Google+:aa! Ellet ole sattunut huomaamaan BlogiHaltuun.net on Google+ palvelussa ja sinne voi myös tästä päivästä lähtien jättää kysymyksiä koskien mitä tahansa bloggaamiseen liittyvää.

Google+:n puolella tullaan myös julkaisemaan materiaalia jota et muualla tule näkemään. Tarkoituksena on myös esitellä kiinnostavia blogeja, eli nyt kannattaa hyökätä tuonne G+:aan.

BlogiHaltuun.net:in Google+ sivuihin pääset tutustumaan klikaamalla G+ logoa!