Avatar gravatar

Sambo Kristin var den første av oss som oppgraderte wordpress (publiseringsløsningen mange blogger er basert på) over kneiken versjon 2.5. Med dette dukket også avatarer opp i kommentarene, uten at noen spurte meg om det først. Dette resulterte i litt forskning i hvordan disse avatarene fungerer (se kommentarene).

I denne posten avslører jeg mysteriet om hvordan du får din egen avatar under bloggposter du kommenterer.

Avatar sa du? – Hva er det?

Noen ord er rett og slett ordnett.no ikke særlig god på. Ordnett er genialt, men ikke oppdatert på tekniske og nerdete ord fra digital kultur.

avatar subst.
1 (indisk mytologi) inkarnasjon, avatara (gudenes nedstigning på jorden)
2 fase, manifestasjon

Meningen som så selvfølgelig brukes i digitale kulturer finnes i denne oversettelsen, men du bør nesten vite hva det er først. Men andre ord: ikke godt nok.

OSX har en egen ordliste innebygget. Denne er på ingen måte sammenliknbar med ordnett, men på visse område glimter den til:

avatar |ˈavəˌtär|
noun chiefly Hinduism
a manifestation of a deity or released soul in bodily form on earth; an incarnate divine teacher.
• an incarnation, embodiment, or manifestation of a person or idea : he set himself up as a new avatar of Arab radicalism.
• Computing a movable icon representing a person in cyberspace or virtual reality graphics.

Denne forklaringen kommuniserer meningen betraktelig bedre; en digital representasjon i en virtuell omgivelse. Din sådan. Med andre ord er Mario din avatar i Super Mario Bros. Det er likevel når du selv har muligheten til å tilpasse denne representasjonen, at ordet avatar oftest brukes.

Så hvordan få din egen avatar i wordpress?

Her ser du et eksempel på en som har, og en som ikke har en avatar i wordpress

WordPress har nå bygget inne støtte for gravatar.com (globally recognized avatar). Gravatar er enkelt og greit; en tjeneste som lenker et lite bilde (avataren) sammen med en mailadresse. Når du så kommenterer en post, så må du skrive inn et mailadresse, og hvis denne er lenket opp mot et bilde på gravatar.com; så vises det lille bildet ved siden av kommentaren din. Dette er selvsagt med forbehold om at den som blogger har lagt opp til dette (noe jeg ikke har somla meg til enda).

1. Legg til epostadresse

Gå til gravatar.com, lag en konto, og legg til en epostadresse du bruker når du kommenterer rundt om på webben

På gravatar.com knytter du epostadresse opp mot et bilde. Her ser vi et skjermbilde der epostadresse legges inn

2. Knytt et bilde et til epostadresse

Så laster du opp et lite bilde som skal representere deg på alle nettsteder som støtter gravatar. Mange blogger, forum og nettsteder gjør det. Husk å velge et bilde som representerer deg på en god helhetlig måte, slik at du tørr stå får det du sier selv om du skulle velge å ha et bilde av deg selv. Ditt digtale selv, er fortsatt deg.

foto av Roar Stavelin (takker og bukker)

Slik ser hovedsiden til innloggede brukere ut på gravatar.com. Her kan du administrere apostadresser og bilder.

3. Kommenter i vei!

Og din nye avarar vil vises der det finnes støte for det.

Jeg lover å svært rask oppdatere stavelin.com til å vise avatarene i kommentarene under postene.

Fancybox, en god løsning?

For drøye to år siden testa jeg en lightbox-løsning for bilder her på bloggen, pga manglende støtte på tvers av nettlesere kastet jeg den ut, på tross av at jeg selv synes det er en god ide. Nå prøver jeg meg på nytt, med fancybox.

Fancybox er en plugin til jquery. Tidligere har jeg brukt prototype.js som bibliotek, og utvidet med script.aculo.us for effekter/GUI. Jeg har ikke gått over måte grundig til verks på disse to alternativene (prototype vs jquery), men har brukt begge til et utvalg oppgaver. Jquery er min utvilsomme favoritt.

Hvorfor jeg mener fancybox er et godt valg.

Fancybox & Jquery krever ikke at xhtml’n er klargjort på noen måte. I den grad javascript ikke er skurdd på i nettleseren, så vil bildene vises som normalt, og lenkes til på en primitiv, men enkel måte. Koden vil se omtrent slik ut.

 

Så må fancybox aktiveres for disse, eller denne typen lenker.

$(document).ready(function() { 
	$("p#test1 a").fancybox();
});

Denne sier at a-er (lenker) inne i en p med id=test1 skal det aktiveres fancybox for.
For blogger kan det være lurt å skrive en mer generell regel, slik at framtidige bilde vill bli telt med.

	$("div.entry a[href*='.jpg']").fancybox({'overlayShow': true });

Her sier jeg ”alle lenker som går til .jpgbilder, som finnes inni diver med klassen entry”. Dvs alle bilder som havner inne bloggposter i wordpress.
Overlay er en av flere variasjoner denne pluginnen støtter, du kan se alle på fancy.klade.lv

Så til spørsålet; er dette brukervennlig? Overrasker vi brukere med slike løsninger? I den grad vi gjør det, er den en posivit eller negativ overraskelse?

Er det noen som har argumenter for at vi ikke bør bruke løsninger av lightbox/facybox typen?

Så en smaksprøve

Noen bilder fra en tur til London for noen år siden

Disse er ganske store fra før, men lat som om det er thumbnails vi ser her :)



Grupper

Noen ganger kan det være hensiktsmessig å gruppere bilder til sett, dette gjøres med ‘rel’ attributten på lenken. Under ser du jquerycoden for å gøre dette automatisk på alle, uten å faktisk skrive denne koden.
Nå vil alle lenker til bilder inni poster (alle poster på en pageload) bli samme galleriet

	$("div.entry a[href*='.jpg']").addClass("external").attr({ rel: "sammegruppe" });

(Her er det en innlysene svakhet i at bilder fra andre poster kommer med i gruppen, her er det tydelig at jeg må skrive om reglen som grupperer, men det kan vi ikke holde i mot selve pluginnen.
Plugin er btw et kipt ord på Norsk, jeg tror jeg fra nå skal bruke ‘innstikk’)

Flickr for mine øyne

Webben ble nettopp et hakke bedre for meg, og kanskje for deg også? – med PicLens strykes skillet mellom browsing av bilder lokalt på datamaskinen og på internett. Konklusjonen min foreløpig er at; ”nu går alt så meget bedre”.

Piclens - skjermbilde
Skjermbilde av piclens, i en av flere visningsmoduser

Jeg har tidligere blogget om SpaceTime, en nettleser for 3D visualisering av bildesøk, PicLens gjør dette som en plugin i firefox, og det føles så mye mye bedre. Browsing (ikke søking) er også en prisverdig feature.

Så hva er så fett?
Opplevelsen, den gode opplevelsen av at bilder på nett er lette å nå fram til, raske å navigere i og, ikke minst; store. Fullskjerm, hvis DU vil.

Klient vs webserver
Alle som har tatt bilder og lastet dem over på maskinen har sannsynligvis browset seg gjennom disse lokalt. Med Microsoft Picture and Fax Viewer, Preview, picasa, irfanview, filutforskere som explorer eller finder, eller mer proffe verktøy som adobe brigde, lightroom eller apperture osv. Opplevelsen av denne typen utforsking av bilder vil vanligvis oppleves som rimelig kjapp og grei. Jeg kan ikke si det samme om å browse bilder på nett. Flickr, photolog, foto.no, div webfotoalbum, osv bærer stort sett preg av at et bilde lastes med et klikk, som innebærer en nye webside (html-dokment & url). Dette er treig, og lite oversiktlig. Store mengder bilder tar lang tid.
Med PicLens kan du browse bilder på flickr, deviantart, google/yahoo-søk (+ noen til) som om bildene lå på din egen maskin. Med en lekker liten 3D-tilt/pan effekt fyker bildene over skjermen, lekrere enn hva de fleste lokale klienter gjør.

Jepp, browsing av bilder på flickr blir utvilsomt et mer trivelig affære framover.