AV Fixa-Anneli | 0 kommentarer |

Vad gör dina besökare på din blogg?

Är du nyfiken på hur dina läsare uppfattar din blogg? Vill du se hur de rör sig på din webbsida, var de klickar, hur länge de uppehåller sig på olika delar och till och med hur de hittade till din blogg?

Smartlook är ett enkelt och gratis verktyg som registrerar dina beökares färd genom din blogg. Du kan i efterhand följa varje musrörelse dina besökare gör via de skärmklippsvideos som programmet spelar in.

Du får inte veta vem din besökare är, mer än ett anonymt ip-nummer så du behöver inte känna att du spionerar på någon, däremot kan du lära dig mer om hur du bäst ger dina läsare ett trevligt besök. Genom att veta vad dina besökare klickar mest på och vad de dröjer lite extra vid kan du öka på de delar som är mest populära i din blogg.

Se gärna videon här nedan:



Du börjar med att registrera ett konto på Smartlook.

Här kan du lägga till din blogg och hämta spårningskoden du ska lägga till på bloggen.

Kopiera din kod:


Gå sen till din bloggs kodmall. (Mall - Redigera HTML)
Här ska du sätta muspekaren i kodmallen (för att markera att det är här du ska söka) och sen trycka Ctrl och F på ditt tangentbord. Då får du fram en sökruta.

I den rutan skriver du i/kopierar du in </head> och trycker Enter. Du kommer då direkt till rätt plats i din kodmall och kan klistra in Smartlooks kod. Du kan självklart leta efter platsen själv, utan sökruta, också om du föredrar det. Koden lägger du ovanför </head>

.

Spara din mall.

Nu kan du gå tillbaka till Smartlook och börja se vad dina besökare gör.


För att undvika att spåra dina egna sidvisningar kan du välja att blockera registrering av ditt ip-nummer. På Smartlook går du till Account (via kugghjulet uppe i högra hörnet) och väljer sen IP blocking. Här kan du klicka på Add my IP.



Ett sista tips. Hur man hittar videorna är inte helt självklart tycker jag så jag lägger in en extra bild med det. Håll musen över någon av de registrerade besöken så visar sig en pil. Tryck på den så kommer du till just det besökets inspelade bild-video.


»»  läs vidare

Bakgrund som täcker alla skärmar

När man lägger till en bakgrund i Bloggers Malldesigner, oavsett om det är en egen bild eller en av deras kommer bilden att visas i sin ursprungsstorlek och det kan innebära att man på större skärmar ser kanten på bakgrunden.
Visserligen kan du välja att upprepa bilden men det är ju kanske inte så snyggt.
Bättre vore att kunna få den bild du valt att anpassa sig efter storleken på den skärm din besökare har.

Som tur är finns det enkel kod att lägga till för att få detta att fungera.
(Koden fungerar även på andra bloggplattformar, som blogg.se och wp)

Gör så här:

Gå till din bloggs Malldesigner.



Här väljer du Avancerat - Lägg till CSS.


I kodrutan lägger du till följande kod:

body {
background-size: 100% 100%;
}


För att din bild ska ligga still och inte rulla med sidan och för att den ska hamna rätt är det ett par inställningar du behöver se över innan du stänger Malldesignern ifall du har laddat upp en egen bild.

Gå till Bakgrund - Bakgrundsbild, där du laddade upp din bild och titta på alternativen för placering av bild.
Här ska du välja Justering (centrerad bild är bra men inte nödvändig), Rotera inte och kryssa ur rutan för Rulla med sida. Så här:



 Klicka på Använd i blogg uppe i högra hörnet för att spara.

Nu täcker den bakgrundsbild du valt hela skärmen, oavsett vilken storlek din besökare har.

Visst blir det skillnad:



»»  läs vidare

Svart-vita bilder på bloggen

Har du en bloggdesign som skulle passa bättre med genomgående svartvita bilder?
Skulle du vilja ha ett enkelt sätt att testa hur det skulle se ut utan att behöva redigera varenda bild du har i bloggen?

Då är det här inlägget något för dig.

Med hjälp av en liten kodtagg du lägger i din bloggs Malldesigner kan du enkelt förändra alla bilder du har på din blogg.
Även om du bloggar via en annan plattform (blogg.se eller wp t.ex. fungerar den här koden eftersom img = bild är en universiell förkortning för klassen bild. Då får du lägga in taggen i din stilmall/css-mall)

Gör så här:

Gå till din Malldesigner




I rutan för kod (Välj Avancerat - Lägg till CSS ) lägger du till nedanstående kod.



img {
  -webkit-filter: saturate(0%);
  filter: saturate(0%);
}


Klicka på Använd i blogg uppe till höger. Nu är alla bilder på din blogg svartvita.

Vill du hellre bara minska på färgåtergivelsen, göra dina bilder lite blackare, kan du ändra lite på siffran i koden tills dess att du får ett resultat du är nöjd med. Öka på procenttalet tills du hittar en nivå du gillar.

Det finns flera andra filter du kan använda på bilder, i stället för saturate kan du använda bland annat:

filter: sepia(100%);

filter: contrast(110%);

Genom att kombinera sepia eller saturate med contrast kan du få en bild med två effekter samtidigt. Då kan koden se ut så här, först färgåtergivelsen och sen styrkan på kontrast (bilden ser lite skarpare ut, skillnaden på ljusa och mörka detaljer ökar) direkt efter utan kommatecken:

img {
  -webkit-filter: saturate(0%) contrast(110%);
  filter: saturate(0%) contrast(110%);

}

Visst var det enkelt!


Så här kan det se ut:


»»  läs vidare

Byt ägare på bloggen

Behöver du byta ägare till din blogg?

Kanske är ni flera som skriver på en blogg du startat, kanske har du hjälpt någon att starta upp en blogg eller kanske har du skaffat ett nytt Googlekonto och vill flytta över din blogg dit. Det finns många skäl till att vilja byta ägare på din blogg och det är riktigt enkelt när man vet hur man gör.

Gör så här:

Gå till din bloggs Inställningar - Basfunktioner - Tillstånd - Bloggskribenter.

Här hittar du ditt konto - ditt användarnamn och din mailadress. Under rutan med användare kan du lägga till författare.



Klicka på den och fyll i den nya ägarens mailadress. Klicka sen på knappen Bjud in skribenter under rutan.

I din lista finns nu en rad med "1 öppna inbjudningar" Så ser det ut tills personen du bjudit in svarat på det mail den får via Google. Det ser ut så här:

För att kunna ta över en blogg behöver den nya användaren ett Google-konto, så om den inte har det kommer den att få möjlighet att skapa ett via länken i mailet.

När personen tackat ja kommer du att kunna se denne i din lista över användare på bloggen.


Det nya kontot har till att börja med bara författarprivilegier, inget administrativt tillstånd.
För att gå vidare och flytta över kontot behöver du ge personen full kontroll genom att byta användargrupp på dennes konto.


När du har gjort det (via pilen brevid Skapad av) ser du att ett kryss har dykt upp brevid ditt eget konto och det innebär att du nu kan radera detta. Den nya adminen kan också göra det, dennes lista ser likadan ut.

När du har raderat ditt konto försvinner bloggen ur din blogglista och den nya ägaren står ensam kvar i listan över användare på bloggen.


Svårare än så var det inte.

Nu behöver du inte tveka att hjälpa dina vänner att skapa en blogg om de är osäkra på hur man gör!
»»  läs vidare

Använd din egen Favicon

Allt fler bloggar skaffar sig en egen favicon. Det är den där lilla bilden som ligger till vänster om websidans namn ovanför adressfältet på din webläsare.

Blogger har en egen bild, ett vitt B mot en orange botten, som du kan se på de flesta Blogspot-bloggar, men visste du att det är riktigt enkelt att byta ut den bilden mot din egen personliga?

Varför ska man göra det egentligen då, tänker du. Spelar det någon roll egentligen?

Ja, det kan det faktiskt göra, en egen faviconbild kan både locka nya läsare till din blogg och göra att redan bekanta läsare snabbare hittar din blogg i en lång blogglista.

Se själv, vilken blogg sticker ut mest i den här listan t.ex.? (tack Alliels för lånet av skärmklippet)

Det är inte svårt att lägga till en egen bild, däremot kan det vara rätt knepigt att hitta rätt bild!

En favicon är en liten bild, 16 x 16 px, så det är ingen mening att välja en bild med många detaljer som du förstår. Det går att använda foton, men de har en förmåga att mest bli ett blurr.
Desutom får din bild inte vara större än 100 kB, vilket vi återkommer till längre ner i inlägget.

Bättre då är att använda en ikon, en bild som är gjord för att visas i lite mindre format och som blir tydligare för din läsare.

Du kan hitta ikoner (eng: icons) på många olika webbsidor, men googlar du på "free icons" hittar du bland annat den här webbsidan, iconfinder.com


Här kan du söka både via namn (house, dog, heart etc) och via kategori lite längre ner på sidan. Se till att välja Free (gratis) i söklistan så att du bara ser de ikoner som inte kostar något om du inte vill betala.

Oavsett vilken sida du använder ska du välja en av de lägsta storlekarna när du laddar ner din bild, gärna 16 x 16 eller strax över. Olika sajter har olika mått på sina bilder, men helst under 100 x 100px eftersom du då har störst chans att hämta hem en bild som Blogger godkänner som favicon direkt.
Ju större bild, desto mer måste den minskas innan den kan laddas upp.


När du har laddat hem en bild du gillar är det dags att kontrollera hur stor den är.

Gå till mappen där du har bilden och högerklicka på den  - välj egenskaper. Här kan du se hur stor din bild är.


Allt under 100 kB är godkänt så får du det resultatet är det bara att ladda upp.

Får du däremot en siffra över 100 kB behöver du komprimera din bild om du inte har möjlighet att hämta en mindre variant. Det kan du göra via olika online-sidor (googla: optimize image") men en av dem hittar du här:

Optimizilla

Nu var min bild helt okej storleksmässigt, men jag vill ändå visa hur du kan göra. Ladda upp din bild, välj hur mycket du vill minska dess "vikt" med genom att dra ner reglaget på höger sida och spar när du dels är nöjd och dels när din "previw-bild" hamnat under 100 kB.

När du är nöjd kan du ladda ner din bild med knappen Download All ovanför din bild.

Nå, så har du då slutligen din faviconbild på datorn. Nu vill du förstås ladda upp den på bloggen!

Gör så här:

Gå till Layout-läget och klicka på Redigera på Favikon-gadgeten.



Här väljer du vilken fil du vill ladda upp från din dator och spar sen. Svårare än så är det inte.
Nu kan du ladda om din bloggs sida och du bör kunna se din nya favikon i din webbläsares flik direkt.



Skulle du inte se din nya favikon direkt när du laddar om din blogg kan det bero på att du behöver rensa din webbläsares cache, alltså dess minne av vad den visade dig senast, det gör du genom att trycka på Ctrl + F5 på ditt tangentbord (om du har windows)

Hur ser din nya favicon ut? Lämna gärna en länk här nedan i kommentarerna så kan alla vi läsare se!

»»  läs vidare

Vem länkar till dig?

Ibland blir man lite nyfiken på vem som länkar till ens blogg där ute på internet.

I din bloggs adminpanel har du under Statistik en länk som heter Trafikkällor. Den visar några av de senast klickade inkommande länkarna till din blogg (så kallade backlinks) men långt ifrån alla.

Det finns många verktyg för att hitta backlinks, men en sajt jag hittat som verkar fungera bra och som är gratis heter Rank Signals.


Här kan du när du fyller i din bloggs länk få reda på många fler tillbakalänkar. Du får se de fem mest klickade länkarna utan motprestation, men för att få hela listan behöver du registrera dig. Det är gratis, men kräver en fungerande emailadress eftersom du måste bekräfta din mailadress via en länk i ett mail de sänder ut.

Tips!
Du kan använda en så kallad 10-minuters mail för att slippa få ev. skräppost till din egen mail.
Kopiera mailadressen du ser på sidan och använd den när du registerar dig. Ditt verifikationsmail sänds ut direkt från Rank Signals och du kan öppna det direkt på 10-minuters mails-sidan. Glömmer du däremot ditt lösenord i framtiden kan du inte återfå det eftersom du inte använde din egen mail, men du kan ju alltid skapa ett nytt konto.

För mig var det helt klart värt att registrera mig, i Fixabloggens länklista hittade jag sammanlagt 115 spännande tillbakalänkar!

När du har fyllt i din bloggs adress (glöm inte http:// och prova både med ändelsen .com och .se - de ger olika resultat beroende på hur folk länkat till dig) och klickat på Explore Links får du fram din länklista.



Här hittar du dels webbsidan/bloggen som länkat till dig, namn och adress på den och dels hur de länkat till dig. Med en textlänk, bildlänk eller i en blogglista. Det går inte att avgöra exakt hur personen gjort, men du får en bra fingervisning åtminstone.

Om du tittar i kolumnen till höger ser du att det står Link Anchor Text & URL.

Link Anchor Text är alltså den översta raden för varje länk. När det är din bloggs namn som står där (i mitt fall Fixa Din Blogspot) ligger länken antagligen i en blogglista men den kan också finnas i ett inlägg även om det är lite ovanligare.
På den andra raden ser du att det står Hem och min egen bloggadress. Det är alltså länken jag har i min meny på bloggen, den räknas ju också som länk och används tydligen rätt flitigt.
På den tredje raden står det Image och har en liten bildikon. Då är alltså länken en bild som någon länkat hit.
På den fjärde raden står det bara här och då har personen alltså länkat ett ord bara. "Den bloggen hittar du här" kanske det står i ett inlägg eller något liknande. Det hjälper dig att hitta din länk om du går till den här sidan och letar efter vart personen nämnt din blogg.



Nu kan du gå tillbaka ibland och se om dina inkommande länkar, dina backlinks, förändras över tiden. Vem skickar flest besökare till dig?
»»  läs vidare

Hjälp sökmotorer att hitta dina bilder

Har du någon gång funderat över hur sökmotorer som Google och Bing hittar dina bilder, hur de vet vad de föreställer och vilka de ska visa då någon gör en speciell bildsökning?

Visserligen har tekniken gått framåt och en del saker, som ansikten, kan programvaran urskilja rätt bra, men andra bilder kan vara mer svårförståeliga.

Det finns flera sätt för sökmotorer att hitta och indexera bilder, bland annat kan de gå på texten som finns runt om en bild. Ju närmre ord finns en bild desto mer sannolikt är det att texten handlar om bilden. Det här sättet ställer ju till lite problem som ni kan förstå, många bilder har inget alls med författarens text att göra och därför kan en bildsökning visa rätt konstiga resultat om man har otur.

Ett annat sätt som sökmotorer använder är att läsa av bilders så kallade alt-tagg, alt står för alternativ och är en liten kodsnutt man lägger till i bildens länkkod.
En alt-kod används inte bara av sökmotorer utan också av de skärmläsare synskadade använder för att läsa av en webbsida. En bild kan en skärmläsare inte "läsa upp" och därför förlorar den synskadade tillgången till den information en bild kan vara, men med en alt-tagg kan skärmläsaren läsa upp vad bilden föreställer. Smart!

En annan anledning att använda en alt-tagg är att om en bildlänk blir bruten av någon anledning kan din läsare ändå förstå vad du lagt upp en bild på.

Här har vi en vanlig bild:



Så här ser det ut om bildlänken bryts utan alt-tagg:


Med en alt-tagg ser läsaren istället det här:


Nu är det här inte det största skälet att lägga till en alt-tagg, men det hjälper till att förstå betydelsen av taggen. 
Främst gör vi det för att hjälpa sökmotorer att hitta våra bilder och på så sätt öka vår sökmotoroptimering (SEO) och få våra bloggar att hamna högre upp i sökningar. Ju fler inlänkar till vår blogg desto bättre ur SEO-synpunkt. 

Hur gör man då?

Det är riktigt enkelt!

När du laddat upp en bild i ditt inlägg du skriver klickar du på den. Du får då fram den här menyn. 


Klicka på Egenskaper. Du får då fram den här rutan, Bildegenskaper.


Titeltext kan du fylla i om du vill, det är den text som syns i vissa webbläsare om man håller musen över en bild, men det är inte lika viktigt. 

Däremot ska du fylla i Alternativ text. Välj själv om du vill använda en mening eller enstaka ord, men försök hitta ett bra sätt att beskriva din bild utan att dra iväg för mycket. 

Spara genom att trycka OK. 

Svårare än så var det inte! Din bild har nu en alt-tagg, vilket du kan se hur det ser ut i koden här nedan. 


Det är inget du behöver fundera över eftersom Blogspot har en sån enkel funktion för dig att lägga till taggen, men då vet du hur det ser ut. Det gula är hela bildtaggen och det oranga är alt-taggen. 

Du kan gå igenom bilder i gamla inlägg och redigera dem på det här viset om du vill förbättra din bloggs sökmotoroptimering och hamna högre upp i sökresultat. Tänk dock på att det tar lite tid innan sökmotorer som Google hinner indexera dina ändrade bilder, men den som väntar på något gott... 


»»  läs vidare

Flera bloggar i en

Bloggar du om flera olika ämnen?
Skulle du vilja ha en enda blogg där du samlar dina inlägg men separat från varandra så att de olika flödena blir lättare för dina läsare att särskilja?

Det kan du enkelt ordna genom att sortera dina inlägg med etiketter för att sen lägga upp de olika etiketterna/rubrikerna i din bloggs meny.


Det kan se ut så här:


I den här menyn visas alla inlägg som handlar om handarbete under den fliken, de om mat hittar man när man klickar på Recept och träningsinlägg finns under Träning.

Tips!
Vill du göra det extra tydligt kan du dölja ditt vanliga bloggflöde och göra om startsidan till en fast, statisk sida med information om dig själv eller din blogg. På så vis visas alla dina inlägg, men uppdelade på olika menyflikar. 
Läs mer om hur du gör i inlägget Gör en hemsida av din blogg

För att dela upp dina inlägg gör du så här:

Börja med att se till att dina inlägg har de rätta etiketterna. Om du har många olika etiketter idag kan det vara smart att fundera över hur du vill lägga upp de olika delarna av bloggen. Välj några stora, övergripande kategorier som du vill ha som fliknamn. Kanske vill du också ha en kategori för blandat eller övrigt. Det gör inget om du inte har etiketterna redan, dem skapar du lätt i din inläggslista.

Självklart kan du sortera ut enbart en kategori inlägg att ha under en speciell flik och ha alla inlägg osorterade i din vanliga blogg samtidigt, som vanligt.

När du bestämt dig för vad dina etiketter ska vara går du till din inläggslista.



Här markerar du vilka inlägg du vill ska ha en speciell etikett (höra till en kategori) och klickar sen på etikettsknappen ovanför inläggslistan. Välj den etikett du vill att dina inlägg ska tillhöra alternativt skapa en ny etikett om det är en ny kategori.
Dina inlägg kan ha många etiketter så du behöver inte radera gamla om du inte vill.



När du gått igenom alla dina inlägg är det dags att gå till Layout-läget och lägga till en Etiketter-gadget om du inte redan har en sån. Vi behöver den en stund för att skapa länkar till de olika flikarna i din meny.

Här kan du välja att visa enbart markerade etiketter om du har många fler än de du valt till dina flikar för att göra det lite enklare att hitta, men det är inte nödvändigt. Den här gadgeten kan du ta bort när du är klar med din meny sen.



Nu kan du gå vidare och skapa en Sidor-gadget som du lägger under din Rubrik-gadget.
I den gadgeten ska vi nu lägga till länkar till de olika kategorierna du skapat.



Klicka på Redigera. Här ska du strax lägga till dina etikettslänkar.

Öppna din blogg i en ny flik i din webbläsare så att du kan se framsidan på din blogg och den Etiketts-gadget du nyss la dit.

Högerklicka på den etikett du vill ha först i din meny och välj Kopiera länkadress



Gå tillbaka till redigeringsrutan du öppnade till din Sidor-gadget. Här ska du klicka på Lägg till extern länk.


I rutan som kommer fram fyller du i den rubrik du vill ha på fliken i menyn och sen klistrar du in webblänken du nyss kopierade. Klicka på Spara länk.

Upprepa det här steget från Lägg till extern länk tills du fått in de kategorier du vill ha. Spara sen din meny.

Avsluta med att ta bort din Etikettsgadget om du inte vill ha den kvar.

Nu har du fått en fin meny med olika inlägg under olika flikar.
Utseendet på din meny kan du ändra i Malldesignern (Mall - Anpassa). Bakgrundsfärg, flikkanter, teckensnitt och teckenstorlek t.ex.





Ta bort meddelande om etikettskategori

Kanske tycker du liksom jag att det ser lite tråkigt ut med den grå info-rutan ovanför dina inlägg?
Den kan du enkelt ta bort genom att lägga till ett litet stycke kod i din Malldesigner.

Öppna Malldesignern (Mall - Anpassa) och gå ner till alternativet Avancerat - Lägg till CSS

Här ska du lägga till följande kod i rutan för CSS:

.status-msg-wrap {
    display: none;
}


Så här:


Glöm inte att klicka på Använd i Blogg uppe i högra hörnet innan du lämnar sidan.

(Ser du ingen skillnad när du klistrat in koden eller vill inte sparaknappen bli aktiv? Det beror på att du klistrade in koden och inte skrev. Gör bara ett mellanslag efter det sista tecknet i koden. Nu ska det fungera. )
»»  läs vidare

Fixas egen anslagstavla

Lämna gärna en blogghälsning - skriv ditt namn och länka till din blogg.
Anneli