Jag har provat Philips Sonicare HealthyWhite eltandborste.

”Välj mellan de tre lägena Clean and White (som är effektivt mot fläckar som kaffe, te, tobak och rödvin), standardläget Clean för överlägsen rengöring samt Sensitive som rengör på ett skonsamt och noggrant sätt. Ett fulladdat batteri räcker i cirka två veckor och en belyst ikon blinkar när det är dags att ladda.”

1. Första intryck

• Tandköttet blev väldigt ömt efter första tandborstningen, dock antar jag att det är för att tandköttet var ovant.
• Obehagligt att borsta, särskilt på överkäken då vibratorn är väldigt stark.

2. Efter några dagar

• Rena tänder självklart, dock kan jag inte berätta om tänderna blivit vitare eller inte eftersom jag inte fick tid till att prova tillräckligt länge.
• Gillar den långa borsten som skakar istället för att den roterar, det känns på något vis som att det blir renare.
• Bra ljudnivå, det är inte samma höga surrande ljud som andra vanliga el-tandborstar.
• Bra med timer, dock glömmer jag av mig ibland och då blir inte tandborstningen så regelbunden. Dock är det ju mitt fel.

3. Helhet

Det är en bra och lättanvänd eltandborste, sambon vaknar inte om han sover då jag använder den och tänderna blir rena och de känns väldigt lena även vid läggdags. Dock kan den kännas lite väl obehaglig och stark, blir ibland lite rädd för att jag ska borsta bort emaljen på tänderna. Dock tror jag nog det bara är hjärnspöken som ställer till det för mig på den biten.

Jag är nöjd med tandborsten men jag skulle nog inte betala fullpris för den, kanske om jag kunde se om jag fått vitare tänder men det kan jag tyvärr inte svara på idag.

Rent allmänt…

Detta får bli min buzzning eftersom jag inte har haft tid att buzza mina vänner då jag väl har haft tandborsten. Då jag fick tid till att beställa tandborsten så fanns den inte i lager, då jag väl beställde den fick jag vänta i 2 veckor på att komma och jag har inte ens haft den i 2 veckor så jag har kunnat prova ut den ordentligt. Jag är besviken på att jag inte fått ordentlig tid till provning och buzzning och de borde ha förlängt även ännu mer, med tanke på oss som fick tandborsten så sent. Buzzador borde ha sett till att Philips har haft tillräckligt med tandborstar i lager så att man har kunna fullföljt detta utförligt med gott om tid.

Lite info

Jag är alltså en Buzzador, med det innebär det att jag får chansen att prova på saker (oftast produkter) som jag får hem gratis, eller som du kan köpa hem för ett kraftigt reducerat pris. Då man fått hem produkten kan jag samla på mig ett gäng vänner och berätta om produkten och dela ut prover så att de kan berätta för mig vad de tycker om produkten.

Senare skickar jag in en rapport på vad jag och de som provat produkten tycker om den.

Vill du också bli en buzzador, det är gratis och du behöver inte betala någon frakt. Klicka här » [länk]

Det första jag någonsin ville lära mig då jag skulle designa om min blogg var hur man ändrade bakgrundsfärg, det är en del som ger ett stort intryck på andra. Varesig det är en färg eller en bild man valt.

body {
margin: 0px;
padding: 0px;
background: #fff;
}

Om ni vill ändra bakgrunden så ska ni leta efter ”body” i stilmallen, det är den första delen som vi kan se. Margin och padding * vill ni ha på 0 i detta sammanhang eftersom vi idag inte ska göra något avancerat med det.

Det vi ska fokusera på är själva färgen, ”background” eller ”background-color” är det man skall ändra på. Färgerna skriver man oftast i hexadecimala koder (#FFFFFF = vit), dvs att man skriver färgerna i 6 tecken i antingen bokstäver och/eller siffror.

Vill du istället ha en bild som bakgrund kan du istället skriva in.

background: url(bildens url-adress);

”URL” måste anges för att webbläsaren ska förstå att det är en url-adress som skall läsas av och därefter skriver man in sin url-adress (bildens adress, du hittar den i adressfältet då du har endast bilden uppe) innanför två paranteser ( såhär ), sedan skall man alltid avsluta med ett semikolon ; för att webbläsaren skall veta att denna rad är slut.

Ännu är vi inte klara, ibland kan bilder bli väldigt stora så för att spara tid till att ladda upp sidan så kan vi istället göra små bilder som repeteras.

background: url(bildens url);
background-repeat: repeat-x eller repeat-y;

Repeat-x – repeteras bilden horisontellt, dvs på ”bredden”
Repeat-y – repeteras bilden vertikalt, dvs på höjden.

Detta är ett jättebra tips som man skall ha i bakhuvudet, att använda så små bilder som möjligt och istället repetera dem.

Exempel på repetition av bild:

Ni ser den lilla bilden till vänster kan repeteras på ett vis så att bilden egentligen ser ut att vara stor. Vill man göra på detta vis på exempelbilden så repteras den som ni ser horisontellt och då använder man ”repeat-x”.

* Vad margin och padding är kan ni se här [länk].

Fråga:
Jag vill också börja med att ge ut gratis bloggdesigner i min blogg, vad ska jag tänka på?

Svar:
Det ni bör ha klarhet över är att du ger ut designer för att du kan och inte för att få fler besökare till bloggen. Det är ett tillfälle för dig att hjälpa andra människor som själva inte kan någonting samtidigt som du marknadsför din blogg. (vilket inte alls är så fel som många tycker, klart du ska ha någonting tillbaka om du så vill)

Nyckeln är att skapa en snygg inbjudande design till dig själv, den design du har ger alla andra intryck över dig och dina kunskaper. Det är din design som ska du skryta med för att få besökarnas uppmärksamhet och bli nyfikna på hur dina gratisdesigner ser ut.

Validera - Efter att du har skapat din design så kan du skapa din första gratisdesign(er), en grundregel är att validera dina stil- och kodmallar (om du även ger bort kodmallar). Om det är fel på dina mallar ger det ett oproffsigt intryck och de vill inte komma tillbaka igen.
Du kan validera din stilmall här [länk] och din kodmall här [länk]

Leta svar – Om det är något du är osäker på eller inte kan, googla. Vet du inte hur du får en ruta att lägga koden i (om du vill använda den metoden) så får du leta dig till svaret. Fråga inte någon annan designer, de vill svara på frågor lika lite som du. Dessutom låter du dig själv utvecklas om du söker svaret själv och du lär dig på samma gång än att får en färdig kod.

Marknadsför din blogg - När du fått upp din första design som är färdig att användas är det dags att marknadsföra dig själv. Här får du göra lite jobb själv, vänd dig till sidor som riktar sig in till designer. Exempelvis bloggdesign.nu dit många vänder sig för att få eller köpa en design, eller få hjälp ang designer. Vet du inga sidor så googla, visa upp din blogg genom att besöka och kommentera andras bloggar (INTE SPAMMA, sannoliken är större att din kommentar hamnar i papperskorgen) men genom att du kommenterar hos en annan så är det inte bara ägaren till bloggen som ser kommentaren utan andra besökare, vilket är ett sätt att marknadsföra dig själv. Sedan finns det ju massvis med andra ställen du kan marknadsföra dig, bloglovin kan du betala 10 kr för att synas i 5 minuter, se till att göra det bra tider på dygnet då du vet att många sitter vid datorn.

Ta emot kritik och önskemål - Fråga gärna dina besökare vad de gillar för slags designer, färger, mönster osv. Då får du en bättre översikt över hur de vill ha de kommande designerna och på så sätt får fler som använder dina designer. Alla negativa kommentarer behöver inte vara något dåligt, låt dig ta åt dig, utveckla och förbättra, oftast finns det något bra de påpekar.

Många kan ofta klaga över att det kommer nya designer för sällan, låt dig inte pressas över det. Det är dina designer som du gör, det är dina villkor du ska sträva efter och de ska inte bestämma över när du ska lägga upp dem och hur mycket tid du ska spendera på dem. Är de inte nöjda får de helt enkelt klicka ner din blogg, alla kan inte älska alla.

Hoppas dessa punkter är hjälpsamma, de är bara vägledning till vad du bör tänka på då du skapar egna designer. Det är de punkter jag tycker är viktiga. Främst att validera, ta emot kritik och önskemål samt att inte känna dig pressad på att skapa fler designer oftare.

Eftersom så många inte vet vad allting är i stilmallen (blogg.se/webblogg.se) så har jag nu skrivit ut i mallen ”fashion” vad allting är. Se denna som en guide och inte något där du hittar alla svar, du får googla lite själv. Vill du veta vad vissa saker är så finns allting på google, men jag har skrivit ner det som jag tycker är viktigast att veta då man designar en blogg.

Vill du göra en design helt själv, kopiera denna kod nedanför och börja designa och använd guiderna om du är osäker på något.

Du kan behålla all information om du vill, det förstör inte din design.
(vill du se hela inlägget med koden så tryck på ”läs mer”)

/*
Lite saker som är nyttigast att veta om

FLYTTA OBJEKT
margin: Flyttar själva objektet.
padding: Flyttar själva texten inuti objektet.
Gällande hur man flyttar åt vilket håll är detta en enkel beskrivning
1px 2px 3px 4px - 1px flyttar uppåt, 2px höger, 3px nedåt, 4px åt vänster
float: välj om du vill positionera objektet till höger eller vänster (inte center)

FÄRGER
Background - anger bakgrunden
color: anger färgen på texten

STORLEK
width: anger bredd
height: anger höjd

TEXT
font-weight: väljer om du vill ha tjock, kursiv eller normal text
font-family: anger typsnitt (man kan välja flera utifall att ingen funkar)
text-transform: anger om du vill ha stor eller liten text
text-decoration: anger om du vill ha understreck eller liknande på text

ÖVRIGT
visibility: hidden; gömmer objektet

Vill du veta mer om dessa så kan du googla, vill du veta vilka sorters "text-transform"
det finns att välja mellan så googla "text-transform CSS".
*/

/*BAKGRUND*/
body {
margin: 0px;
padding:0px;
background: #FFFFFF url(http://static.blogg.se/shared/img/css/fashion_bg.jpg);
}

/*LÄNKAR I INLÄGGEN*/
a {
color: #999999;
}
a:hover {color: #80FF9F;}

/*SJÄLVA BLOGGENS BAKGRUND - Den vita ytan*/
#wrapper {
clear:none;
margin: 30px auto;
padding: 20px;
width: 830px;
background-color: #FFFFFF;
}

/*GÖR ATT BAKGRUNDEN BLIR EN HEL RUTA OCH INTE DELAS*/
#wrapper:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

/*TEXT dock om du anger <p> själv i kodmallen*/
p {
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
}

/*HEADER, rutan längst upp på bloggen*/
#header {
background: #FFFFFF url(http://static.blogg.se/shared/img/css/fashion_top.jpg) no-repeat
right center;
padding-left: 30px;
padding-bottom:15px;
padding-top:30px;
margin: 0px 0px 20px;
width: 800px;
height: 55px;
}

/*SIDOSPALTEN/*
#side {
float: left;
width: 180px;
margin: 0px;
padding: 24px 18px 0px 12px;
left:-30px;
border-right-width: 3px;
border-right-style: solid;
border-right-color: #CCCCCC;
}

/*INLÄGGEN LIGGER POSITIONERAD I DENNA, använd främst denna för inställningar*/
#content {
overflow: hidden;
width: 538px;
position:relative;
left:0px;
padding: 20px 0px;
voice-family:"\"}\"";
voice-family:inherit;
width:538px;
float: right;
margin: 0px 10px 0px 0px;
}html>body #content { width: 538px }

/*TEXT I HEADER*/
#header a {
color: #000;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 24px;
font-weight: normal;
}

h1 {
font-family: arial, verdana, sans-serif;
font-size: 14px;
font-weight: bold;
color: #000;
text-transform:uppercase;
margin: 0px;
padding: 0px;
height: 30px;
}

h2 {
font-family: arial, verdana, sans-serif;
font-size: 11px;
font-weight: normal;
color: #000000;
margin: 0px;
padding: 0px;
width: 170px;
}

/*INLÄGGSRUBRIK/*
/** Entry headers **/
h3 {
background: #FFFFFF;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
padding:10px 10px 10px 0px;
color: #ED6EA3;
margin: 0px 0px 10px;
text-transform: uppercase;
}

/*SIDO-SPALTS RUBRIK*/
.navheader {
font-family:  Arial, Helvetica, Sans-serif;
font-size: 14px;
font-weight: bold;
color: #666666;
padding:5px 5px 0px;
margin-bottom:0px;
background-color:#FFFFFF;
text-transform: uppercase;
}

/*SIDOMENYNS YTA, dvs rubriker, länkar osv*/
.nav {
font-family: verdana, Arial, Helvetica, Sans-serif;
font-size: 11px;
font-weight: bold;
color: #000000;
margin: 0px;
}

/*LÄNKLISTA*/
.nav ul {
margin: 0px 0px 12px;
padding: 5px 10px 10px;
font-weight: normal;
background-color: #FFFFFF;
}

/*LÄNKAR I SIDOMENYN*/
.nav li {
list-style: none;
padding: 0px 0px 6px 0px;
font-weight: normal;    
}
/*HÄR ANGER DU LÄNKARS "UNIKHETER" */
.nav a { color: #000000; }
.nav a:hover { color: #ED6EA3; } /*HOVER - då du lägger musen över en länk*/

/*INLÄGG*/
/** Post's body text **/
.entrybody {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #000000;
line-height: 150%;
margin: 0px 0px 10px;
background-color: #FFFFFF;
padding: 10px;
}

/*TID OCH LÄNKAR UNDER INLÄGGET - Ex kommentarer, trackbacks osv*/
/** 'Posted by' txt **/
.entrymeta {
font-family: verdana, arial, sans-serif;
font-size: 10px;
font-weight: normal;
color: #666;
text-align:right;
}

/*SJÄLVA LÄNKARNA - unika önskemål */
.entrymeta a { color: #E04201; }
.entrymeta a:hover { color: #80FF9F; }

/*KOMMENTARSRUBRIK - Ex Postat av: Design&Makeup*/
.commentheader {
font-family:  arial, helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
background-color:#809FFF;
padding:5px;
color: #FFFFFF;
}

/*KOMMENTARSTEXT*/
.commenttext {
font-family: verdana, arial, sans-serif;
font-size: 11px;
font-weight: normal;
color: #000;
line-height: 130%;
}

/*KOMMENTARSTID och LÄNKAR - ex tiden då kommentaren postades och blogglänk*/
.commentmeta {
font-family: verdana, arial, sans-serif;
font-size: 10px;
font-weight: normal;
color: #999999;
margin: 10px 0px 20px 0px
}

/*Länkar - unika önskemål*/
.commentmeta a { color: #809FFF; }
.commentmeta a:hover { color: #80FF9F; }

/*Kommentarrutan - kan inte ändra färg I själva textrutor osv*/
.commentform {
font-family: verdana, arial, sans-serif;
font-size: 11px;
font-weight: normal;
color: #333333;
margin: 0px 0px 20px 0px
}

/*LINJERNA MELLAN INLÄGGEN*/
.separator {
border-top: 2px solid #CCCCCC;
border-bottom: 0px solid #CCCCCC;
margin: 14px 0px 14px 0px
}

/*RUBRIK TILL KOMMENTARER OCH TRACKBACKS*/
.default {
font-family: Arial, Helvetica, Sans-serif;
font-size: 11px;
color: #333;
font-weight: bold;
padding: 0px 0px 10px 0px;
text-transform: uppercase;
}

/*DESSA BEHÖVER DU INTE BRY DIG OM - inget du behöver ändra*/
.subside {
font-family: "Trebuchet MS" Verdana, Arial, Helvetica, Sans-serif;
font-size: 11px;
font-weight: normal;
padding: 0px 0px 0px 0px;
}

.xmlButton {
border:1px solid;
border-color:#FC9 #630 #330 #F96;
padding:0 3px;
font:bold 10px Verdana, Arial, Helvetica, Sans-serif;
color:#FFF;
background:#F60;
text-decoration:none;
margin:0;
}

.image {
border: 2px solid #CCCCCC;
background-color:#FFFFFF;
padding:2px;
margin: 0px 6px 6px 0px;
}

.thumbnail {
border: 2px solid #CCCCCC;
background-color:#FFFFFF;
padding:2px;
margin: 0px 6px 6px 0px;
}

.video{
padding: 0px 0px 0px 0px;
}

.fieldName{
font-family: verdana, arial, sans-serif;
font-size: 11px;
margin: 0px 0px 12px 0px
}

select{
font-family: verdana, arial, sans-serif;
font-size: 11px;
}

/*SÖKFORMULÄRET - Men även kommentarsformuläret*/
form {
padding: 10px;
background-color: #FFFFFF;
margin: 0px 0px 10px;
}

/*PROFIL i överlag*/
#profile {
font-family:  Verdana, Helvetica, Sans-serif;
font-size: 11px;
font-weight: normal;
margin: 0px 0px 0px 0px;
padding-left: 16px;
}

/*PROFIL rubrik "OM" */
#profile h4{
font-family:  Arial, Helvetica, Sans-serif;
font-size: 14px;
font-weight: bold;
color: #666666;
text-transform: uppercase;
padding: 0px 0px 0px 0px;
margin: 0px 0px 6px 0px;
}

/*PROFIL TEXT*/
#profile p{
}

Det är rätt så enkelt att förstå, lite krångligt att komma ihåg vad som ska vara vad från början då man måste ange rätt i stilmallen.

ID använder vi då vi ska lägga ett element som bara visas en gång, detta som #wrapper, #side (vill man ha en till side så lägger man till en ny div med ett annat namn) #header osv.

Class använder vi då vi ska skapa något som ska upprepas, dvs, .entrybody (inläggen hos blogg.se),  länkar osv.

Skillnaden man anger i stilmallen är att då man skapar en div så ska man alltid ange # och då man skapar en klass så ska man ange en . innan ”namnet” på dem.

Exempelvis:
Class

/** Post's body text **/
.entrybody {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: normal;
color: #000000;
line-height: 140%;
margin: 0px 0px 0px;
background-color: #FFFFFF;
padding: 10px;
}

ID

#wrapper {
clear:none;
margin: auto;
padding: 5px 0px 0px 0px;
width: 830px;
background-color: #ddd;
}

Hoppas ni förstår detta lite bättre, hur man använder vilket – var när och hur :)
Kolla även i kommentarerna och få lite mer haj på detta också, hade nämligen korkat nog råkat skrivit ”div” fastän jag faktiskt menade ”ID” och fick även en mer ingående förklaring. Känns lite pinsamt såhär efteråt ^^

Okej, nu ska vi se hur jag kan förklara detta, bilden säger det mesta.
Många blandar ihop margin och padding och de vet framförallt inte vilken ordning alla värden man ger är.

Jag börjar med att förklara margin och padding.

• Margin: är det luftutrymme du anger om du vill att en ruta tex ska ha mellanrum från en annan box, eller om texten ska vara längre ifrån en annan som inte tillhör samma div eller class (eller vad man nu använder). Den påverkar utifrån innehållet så att säga. Bakgrundsfärgen i denna div skall inte påverkas.
  
• Padding: flyttar innehållet från kanterna eller vad man säger. Mellanrummet går alltså inåt. Bakgrundsfärgen i denna div fyller ut det värde du anger.

Vilken ordning ligger alla värden på?
Tänk dig att du har en klocka, det första du anger är kl 12 (top), andra kl 3 (right), tredje kl 6 (bottom) och den fjärde och sista kl 9 (left). Då man väl vet detta så är det inte krångligt alls att minnas, det är bara att räkna utefter klockan.

Hoppas denna guide är hjälpsam, berätta gärna om den varit hjälpsam för dig.

Jag får många klagomål på att de som vill ha hjälp aldrig hittar då de googlar. Det ni måste förstå är att ni inte kan skriva typ ”hur får man mellanrum mellan headern och inläggen”, eller jo visst kan man det kan få svar, men ni måste tänka mer som en webbdesigner än som en bloggare.

Vi tar ett exempel på att vi vill veta hur man får bort strecken under länkarna i menyn
Det vi ska undvika att googla är:
”hur får man bort strecken under länkar i bloggen”

Utan ni får tänka lite djupare, vad är det vi ska ändra?
- Länkar
Var är det vi ska ändra?
- Stilmallen = Css (kodmallen html/xhtml)

Okej, då googlar man då på
länkar css

Då kommer det upp massvis med information om vilka attribut och värden den finns.

Jag hoppas att denna guide har gett dig bättre hum om hur du bör tänka när du skall googla efter något du vill ta reda på och att denna guide varit till hjälp.

Många undrar nog varför det står ”font-family” och så ligger det massvis med typsnitt efter varandra? ”blandas de ihop och blir ett typsnitt tillsammans?”, ”varför är det citationsstecken runt vissa, är det det som är den som man väljer?”, ”varför är det inte bara ”font” som står, varför är det family?”, är det många som undrar. Nu ska jag förklara lite för er.

När man skriver vilket typsnitt man vill ha är det inte alla datorer som har det typsnittet. Jag börjar med att skriva det jag vill använda, låt oss säga Arial då.
font-family: arial;
Om en viss dator inte skulle ha detta typsnitt, då kan de heller inte se det. Så därför skriver vi då ännu en till typsnitt som en slags reserv.
font-family: arial, tahoma;
Har du inte tahoma, då går man vidare till nästa typsnitt. Inte så svårt va?  Låt oss säga att vi ska lägga till en extra.
font-family: arial, tahoma, ”Trebuchet MS”;
Varför lade jag snuffar kring den sista, har jag valt att det är helst den jag vill att den ska synas?
Nej, inte riktigt så är det. När vi har typsnitt som har mellanrum så ska man lägga citationsstecken så att webbläsaren förstår att det är ”2-ords”- teckensnitt.

Detta var det jag ville gå igenom, inte så svårt egentligen va? Hoppas ni lärde er något av detta.