Dags för comeback av Swatch beat tid?

HTC-Desire-Beat-time23e oktober 1998, dvs snart tolv år sedan föddes en ny tidsräkning, @beat. Tidsräkningen lanserades av klockmärket Swatch, dels som en gimmick och för att sälja nya klockor, men även för att de tyckte att konceptet med timmar, minuter, tidszoner etc var föråldrat. Ett dygn består istället av 1000 beat och uttrycks som tex @927. Läs mer om @beats på Wikipedia.

1998 var ju lång för internets mognad – kan det finnas möjlighet till comeback nu eller är det omöjligt för oss att tänka på ett annat sätt?

Fungerar din logga även på en (Gr)Avatar?

Viking_Line-logo

En bra logotyp ska fylla många behov. Varumärket ska fyllas med ett värde som bland annat anknyter till företagets verksamhet, visa företagets historia eller bakgrund samt uttrycka dess värderingar. Samtidigt måste en bra logotyp vara särskiljande från konkurrenter inom samma bransch samt inte inkräkta på andra varumärken. En kombination av en symbol (ett äpple) och en text (Apple) är vanlig och antingen används symbolen och texten var för sig eller förekommer tillsammans.

För en designer finns det några saker att tänka på tekniskt när man tar fram en logga, en kort checklista som är ganska allmän och som kan kompletteras:

  1. Den ska fungera i stort och i smått, på en banderoll såväl som på en penna
  2. Den ska finns i ett vektoriserat original så den kan skalas upp och ner utan att tappa i kvalitet
  3. Den ska fungera såväl som i fyrfärg för tryck (CMYK), digitalt (RGB) och i svartvitt

Till detta vill jag lägga till ytterligare en punkt. Ett krav eller åtminstone ett övervägande – den bör fungera i ett fyrkantigt kvadratiskt format.

Skärmavbild 2010-02-01 kl. 21.19.23Det fyrkantiga kvadratiska formatet anses som lite besvärligt att jobba med. Ett fyrkantigt kvadratiskt foto brukar anses som “dött” och svårt att skapa liv i men för logotyper används det numera mer och mer framförallt i avatarer, dvs minatyrbilder som symboliserar personen/företaget. Avatarer används på olika sociala sajter som Flickr, Twitter, Facebook, LinkedIn, Foursquare, Gowalla etc etc.

Skärmavbild 2010-02-01 kl. 21.43.17En fyrkantig kvadratisk bild, som dessutom är jätteliten (16×16 pixlar) används även till favicons, dvs uppe i adressfältet på en sida, och som även används i bokmärkesfältet eller ibland i RSS-läsare, tex Google Reader. I iPhone används fyrkantiga kvadratiska bilder (57×57 pixlar) till både programikoner och som bokmärken på hemmaskärmen.

Privatpersoner kan använda sig av en Gravatar för att tex en minatyrbild av sig själva när de kommenterar på bloggar.

Nu skulle jag ha några riktigt dåliga exempel på loggor som inte fungerar i fyrkantigt kvadratiskt format. Eller ännu hellre där loggan får en annan betydelse när den autobeskärs till en fyrkant kvadrat.

Det har jag inte, men däremot ett riktigt bra, Viking Lines logotyp som “finns” i en fyrkantig kvadratisk version av den vanlig logotypen. Bakgrunden till Viking Lines “NG LI” logotyp ska vara intressant, men tyvärr hittar jag ingen källa på det. Kanske stämmer det att någon på byrån tittade ut genom ett fönster när en båt från Viking Line passerade förbi, såg de röda bokstäverna “NG LI” och insåg att det räcker för att identifiera den som en färja från Viking Line.

Edit: Det var tydligen Rönnberg & Co som i mitten på 80-talet skapade den berömda “NG LI” loggan. Dessutom menar jag kvadratiskt format, inte fyrkantigt, rättat posten. Tack till @menskoppen

Sökmotoroptimera WordPress på 10 minuter

WordPress är ett publiceringssystem som har blivit väldigt populärt under senaste året och används även av många byråer som till exempel Great Works, Farfar, More Mobile Relations, Daytona med flera. Anledningen är såklart att det är gratis, enkelt att bygga på och vidare med, det finns massor av färdiga plugins etc. En annan styrka med WordPress är att det är bra byggt för sökmotorer. Trots detta finns sidor där man inte utnyttjat detta till fullo eller krånglat till det, som till exempel för Jung Von Matt’s nya sajt och problemet med permalänkar. Just hur Jung Von Matt kan förbättra sin sajt ur ett -perspektiv har Walter Näslund tagit upp i en utmärkt post.

Så, detta är ingen djuplodande post om SEO och hur du jobbar med det löpande, utan hur du anpassar en grundinstallation av WordPress så att du har en bra SEO-grund att stå på. Dessutom går de snabbt att fixa.

Anpassa grunden i ditt tema

Det första steget i att SEO-optimera din sajt är hur ditt tema är byggt. Oavsett om du bygger ditt tema från grunden eller bygger vidare på ett existerande så ska du se till att titlarna på dina poster är satta som <h1> då dessa “viktas som mest intressanta och relevanta” av tex Google.

Använd dig av “snygga” rubriker

Att använda sig av “snygga” rubriker och logiska adresser i WordPress är väldigt enkelt men något som många missar. Som förval har en adress till en post formatet http://www.doman.se/?p=123 men den adressen är varken beskrivande för besökaren eller bra för SEO eftersom den inte säger vad posten handlar om. På min sida har jag valt att ändra till http://www.doman.se/2009/10/19/namnet-pa-din-post men du kan välja en annan struktur bara namnet på posten skrivs ut i klartext (minus tecken som inte är webbsäkra som å, ä, ö, ” etc.

Permalänkar

Vissa webhotell tillåter inte att du byter struktur för permalänkarna (tex Surftown) så där måste du manuellt ladda upp en så kallad .htaccess fil. Läs mer om hur du gör på WordPress supportsidor.

Ett litet tips. Ladda ner och installera pluginet Top Level Categories så får du bort ordet /categories/ i adressen för dina poster. Så adressen till dina kategorier blir tex http://www.galveston.se/webb/ istället för http://www.galveston.se/category/webb/ Snyggare enligt mig.

Ett tips till. Byt till snygga adresser direkt! Det blir mycket krångligare att byta/ändra senare (se nedan).

Ladda ner och installera pluginet All In One SEO pack

SEO

I grundinstallationen har inte WordPress optimerad meta för dina poster som beskrivning (description) och nyckelord (key words). Å andra sidan säger Google nu själva att de inte använder sig av just keywords, men titlar är fortfarande intressant. Som tur var kan du enkelt fixa det genom att ladda ner och installera All In One SEO pack. Låt alla grundinställningar vara, det fungerar bra. Fyll en lämplig beskrivning på din sida.

Om du har en gammal sida – ta hand om gamla inlänkar

Om du byter från ett annat publiceringssystem (eller om du byter strukturen på permalänkarna) så bör du verkligen se till att alla nuvarande inkommande länkar leder till din nya sida. Det kan du göra på många olika sätt, och olika avancerat. Allt från att alla gamla länkar leder till din nuvarande startsida eller att respektive unik inkommande länk leder till den postens ny adresse (förutsatt att du flyttar med ditt gamla innehåll till din nya sida byggd i WordPress). Här kan du läsa lite mer om hur du löser detta med .htaccess.

Sådär, nu har 10 minuter gått (om du inte måste ändra alla inkommande länkar manuellt…) och du har sökmotoranpassat din sida i WordPress med några enkla knep. Resten är upp till dig och innehållet på din sida.

Vad har du själv för tips för att sökmotoroptimera din WordPressajt?

Skapa unika inkommande länkar för att få förbättrad statistik

I Google Analytics (och säkert i andra statistikverktyg) kan du se hur många inkommande länkar du har från den domänen, tex totalt från twitter.com Om du vill få en bättre överblick på var exakt dina besökare kommer ifrån kan du enkelt skapa specifika länkar på olika webbplatser, profiler etc. På det sättet kan du se exakt hur många besökare som klickat på den specifika länken.

Unik URLViktigt är att den specifika länken du skapar  är unik och att den inte skapar en errorsida, dvs att användaren inte möts av meddelandet “404 Sidan saknas”. För WordPress kan du enkelt lägga till /?ref=unikt_id till adressen, dvs adressen kommer bli http://www.galveston.se/?ref=twitter Du kan egentligen skriva vad du vill efter frågetecknet (som /?blahahaha) men det gör det lättare i Google Analytics att övervaka alla inkommande länkar om de är uppbyggda efter samma form. Som du ser nedan använder till exempel WordPress formen /?s=sökord vid sökningar på din sida.

Google Analytics

Enligt detta sätt har jag skapat unika länkar till galveston.se både på twitter.com och på Collected.at Ett annat tips är att lägga till en specifik länk till din mailsignatur för att se om du får några besökare den vägen, tex www.galveston.se/?ref=signatur

Collected.at samlar feeds i en collection

Collected.at

På Collected.at kan du samla ihop feeds/flöden från olika källor för att visa dem i ett gemensamt flöde. Som Yahoo Pipes för er som har erfarenhet av den, jag har det tyvärr inte själv.

På Collected.at kan du samla alla källor som publicerar sitt innehåll som RSS, det innebär att källorna kan vara nyheter, bloggar, tweets från Twitter och andra micro-bloggar, blider från Flickr etc etc. Perfekt om du vill bevaka ett nyhetsområde eller använda för att övervaka ditt varumärke/företag. Det samlade flödet av nyheter/bloggar/tweets publiceras i sin tur som en RSS som du kan prenumerera på i din RSS-läsare. Du kan välja att göra ditt flöde anonymt och att det inte listas, men om du vet/chansar på adressen så hittar du den ändå (bugg?)

Collected.at är en enkel, bra och fungerande tjänst, men som möjliga utvecklingar ser jag till exempel:

  • realtidsuppdatering – som jag inte tror finns idag
  • möjligheter till flera administratörer för en collection
  • möjlighet att föreslå ett flöde
  • göra något (övervaka) med sina egna favorit collections

Testade att sätta ihop en personlig collection på galveston.collected.at, en som samlar nyheter om surfing på surfing.collected.at och en som samlar nyheter om mobilmarknadsföring på mobilemarketing.collected.at

Collected.at är framtaget av Great Works och Geekboys.

Skapa djuplänkar i Flash med SWF Address – exempel Bonnier Baby

Läste just en intressant blogpost från Jesper Åström om SEO för webbsidor byggda i flash. Jesper skrev posten med anledning av två omdebatterade bloggposter från Walter Näslund, dels om Lowe Brindfors och dels om Forsman & Bodenfors. Även Resumé har skrivit om Walter Näslunds bloggposter.

I en kommentar på Jespers sida nämnde jag att man kan bygga flashsidor med djuplänkar, dvs att man i en och samma flash (.swf) kan få “logiska” adresser till olika delar av innehållet. Jesper bad mig lite hur jag gjorde för Bonnier Baby, en hemsida som jag tillsammans med Hallèn & Co och Manolito gjorde 2007.

Skärmavbild 2009-09-18 kl. 11.03.50

Varför man bör använda sig av SWF Address

SWF Address

För Bonnier Baby använde jag SWF Object för att publicera flashen och för själva djuplänkningen använde jag SWF Address. Fördelarna med att använda SWF Adress i en flash är att:

  • besökaren kan använda webbläsarens framåt- och bakåtknappar för att navigera (som man är van vid vid “vanliga” sidor byggda i html)
  • besökare kan bokmärka en länk till en specifik del på sajten
  • besökare kan skicka (via mail, Twitter etc) en länk till en specifik del på sajten
  • adresserna kan göras logiska så besökaren vet var i sajtens struktur man befinner sig
  • titlarna på sidan kan göras logiska och beskrivande vilket är bra ur ett SEO perspektiv

Förutom ovanstående är djuplänkar bra för att man kan skicka besökare till en specifik del på sajten. Ett av skälen till att vi använde SWF Adress på Bonnier Baby var att vi gjorde banners där besökaren valde ålder på sitt barn – klickade på bannern, hamnade på bonnierbaby.se och direkt kunde se böcker som passade för sitt barn.

Optimerade djuplänkar och sidtitlar

Forsman & Bodenfors

Jag vill inte klanka ner mer på Forsman & Bodenfors, men i denna post är de ett bra (eller snarare ett inte så bra) exempel. F&Bs hemsida använder nämligen SWF Adress för att skapa djuplänkar, men tyvärr inte logiska sådana. I en post från februari om Forsman & Bodenfors visade jag hur de hade kunnat gjort det bättre.

Sammanfattningsvis, ett case hos F&B har adressen

http://forsmanbodenfors.se/#/en/Work/254/367/

istället för till exempel det mer logiska (och ur SEO synpunkt bättre)

http://forsmanbodenfors.se/english/Work/Securitas/Aroundio-Home-Alarm

som talar om språkversion (English), vad sidan handlar om (Work), för vem Forsman & Bodenfors utfört arbetet (Securitas) och vad produkten är (Aroundio Home Alarm).

I F&Bs fall är vissa titlar bättre än andra, men i exemplet ovan är titeln på sidan: “Forsman & Bodenfors : Home Alarm : 1”. Mer optimalt ur ett SEO perspektiv hade såklart varit: “Aroundio Home Alarm : Securitas : Forsman & Bodenfors”.

Erfarenheter från Bonnier Baby

Bonnier Baby är den första (och enda) sajt jag byggt med SWF Adress. Det är en enkel sajt som är helt statisk, förutom att inköpsställen laddas in via XML. Det finns en fallback om man besöker sidan med javascript avslaget eller besöker sidan med en mobil. Dock saknas en komplett html version av sidan. Det hade varit bättre för tillgängligheten och för sökbarheten. Ett alldeles underbart exempel på en hemsida som använder SWF Address med logiska länkar, bra titlar och en nästan lika snygg html variant (besök sidan med javascript avstängt) av sidan är Volkswagen UK (se under “I want a new Volkswagen”).

Denna post fokuserade på hur du kan använda SWF Address och varför det är bra ur ett SEO perspektiv, hur du använder SWF Adress rent praktiskt i flash kan du läsa om på Gotoandlearn.comWebdesignerwall hittar du 20 andra exempel på sidor som använder SWF Address. Har du egna erfarenheter av att arbeta med SWF Address, kommentera gärna.

P o s t e n s o m i n t e h a m n a r p å G o o g l e

D e t  s k r i v s  o c h  d i s k u t e r a s  m y c k e t  n u  h u r  v i k t i g t  s ö k o r d s o p t i m e r i n g  ä r  o c h  h u r  f e l  m å n g a  (t i l l  o c h  m e d  e t a b l e r a d e)  w e b b y r å e r  t ä n k e r  n ä r  d e  b y g g e r  s a j t e r.  F ö r  a t t  s a m m a n f a t t a  h u r  m a n  g ö r  f ö r  a t t  i n t e  s y n a s  i  G o o g l e:

  1. B y g g  s i d a n  h e l t  i  f l a s h  u t a n  f a l l b a c k  i  h t m l.  S o m  e x e m p e l  F o r s m a n  &  B o d e n f o r s  e g n a  s i d a  o c h  S v e n s k a  K y r k a n s  n y a  k a m p a n j s i d a (ä v e n  d e n  f r å n  F & B).
  2. P o s t  i  f o r m  a v  e n  b i l d.  H a r  t y v ä r r  i n g e t  b r a  e x e m p e l  m e n  t . e x.  h a r U s t w o h e l a  s i n  “p r o g r a m f ö r k l a r i n g”  s o m  e n  b i l d.
  3. A n d r a  k r e a t i v a  l ö s n i n g a r.  S o m  i  d e n n a  p o s t  s o m  e n l i g t  G o o g l e  b  a r a  i n n e h å l l e r  e n  m a s s a  b o k s t ä v e r  o c h  i n g a  o r d.

Trevlig kundbevakare från Syrup Stockholm

sagt-om-swedbank_1246180103821

Efter mitt inlägg om Svenska banker i mobilen – en uppdatering hittade jag en inlänk dit från en sida som heter sagtom.syrupsthlm.com/swedbank vilket visade sig vara en enkel och trevlig sammanfattning om vad som sägs om Syrups kund Swedbank i de sociala medierna.

Sidan sammanfattar kort när, i detta fall Swedbank, nämns på Google Blog Search, Twingly, Knuff, YouTube och Flickr. Perfekt för en enklare bevakning om hur “snacket går” kring Swedbank och för att kunna bemöta kritik och svara på frågor. Kanske skulle man kunna lägga till Backtweets för att se tweetar till exempelvis www.swedbank.se

Syrup har även gjort liknande sidor för övriga kunder som Atava, Casall, Newsmill, Stadium och Trygg-Hansa.

Däremot hittar jag ingen bevakning på varken /syrup, /syrupsthlm eller /syrupstockholm. Får se om denna post hamnar i någon på Syrups bevakningslista och så fall får ni gärna kommentera syftet, tankarna och idéerna runt sidorna.