16 December 2009

Så designar du din blogg: Bakgrund forts.
Blog post from SoclogDenna fortsättning om bakgrunder är måhända lite mer avancerad än den första delen. Men stycket om generatorer tycker jag alla ska läsa. Sen blir det lite mer avancerat med "luddade kanter" och på slutet avslöjar jag min metod för att göra riktigt snygga teman.
Generatorer
Ett enkelt sätt att få en snygg bakgrund är att använda generatorer som finns på nätet. I regel får du välja mellan färg, storlek, effekter mm och klickar sedan på okej och sajten fixar bakgrunden åt dig.
Tycker du om linjer så testa Stripegenerator. Du kan göra egna, ladda ner andras färdiga eller ändra andras och ladda ner. Hos Tartanmaker kan du skotsrutiga mönster. Snyggare än vad det låter. För alla möjliga slags coola mönster testa Patterncooler. Ingen av sajterna kräver registrering.
Ladda inte upp gigantiska mönster-bilder. Det räcker med en liten. Klicka i repetering i X och Y-led så upprepas bilden och täcker hela sidan.
Med eller utan toppbild?
Att få toppbild och bakgrund att matcha kan vara svårt. Och har man t.ex en snygg solnedgång som bakgrund så känns toppbilden bara i vägen. För att slippa toppbild/toppfärg så går du såhär...
Ladda först upp din bakgrundsbild. Gå sedan till toppinställninssidan. Klicka på färgrutan vid "Bakgrundsfärg" så att färgverktyget syns. Under avbryt-knappen finns en ruta där det står en kod (t.ex #ffdd23). Ta bort hela koden, fältet ska vara tomt. Klicka på OK. Du bör se ändringen direkt.
Fyll i den titel du vill ha på din blogg och välj placering; vänster, mitten eller höger. Det går inte att flytta titeln genom att trycka en massa mellanslag.
Ser du fortfarande din gamla toppbild? Klicka på "Radera befintlig" på toppinställningssidan.
Kör man utan bakgrundsbild (dvs. enfärgat) så går det inte att ta bort toppbilden. Gör istället toppfärgen samma färg som på bakgrunden. Du kan också använda en png-bild som är helt genomskinnlig och på det viset få det avstånd du vill ha mellan fönstrets kant och inlägg-blocket.
Luddiga kanter
Foton är ofta snyggt som bakgrund men det blir inte så bra när bilden repeteras. Använd ett bildbehandlingsprogram och ludda kanterna på bilden med t.ex svart. Ladda upp bild som bakgrund och välj svart som bakgrundsfärg. Se till att varken X eller Y-led är förbockade. Testa vilken justering som är snyggast av vänster, höger och mitten.
TIPS!
Fungerar bra på toppbild med. Ludda kanterna toppbilden och ha bakgrunden på sidan enfärgad. Mitt "My Little Pony"-tema är gjort så.
Få bakgrund och toppbild att bli ett
Det här är den metod jag använder mest. Den är omständig och kräver tålamod men när man lyckas blir det väldigt snyggt. Den kräver bildbehandlingsprogram.
När jag bestämt vilken bakgrund jag ska ha så klipper jag ut toppbilden ur den och sparar separat. När jag sen laddar upp dem på min blogg så ser det ut som jag bara använder en bild. Det svåra är att få toppbilden att passa perfekt. Två pixlar fel och du kommer se kanterna på toppbilden. Jag använder alltid maxbredd på toppbild (1126px). Då slipper jag oroa mig för hur den hamnar (toppbilder centreras automatiskt).
Till min hjälp har jag en mall som jag gjort. Vet inte om den är till hjälp för någon annan men om du vill kan du ladda ner den i GIMP-format (.xcf) http://www.mediafire.com/?uzmegyewq2z . Jag jobbar på att fixa en i Photoshop-format med.
På t.ex Twitter-temat har jag använt denna metod
Skärmupplösning
Hur man än vrider och vänder på det så är det i dagsläget svårt att göra ett tema som ser bra ut med alla upplösningar. Det ser oftast bra ut med 1152x864 pixlar eller högre. Det ända som händer är att luften till vänster om presentations-blocket ökar.
Går man däremot lägre än ovanämda t.ex 1024x768 eller 800x600 så börjar det se konstigt ut. Nu är inte detta något jätteproblem då de flesta har högre upplösning på sina skärmar (bara 5 % av mina besökar har lägre än 1024x768). Min 17 tums laptop som är 1.5 år gammal har t.ex 1280x800. Men det klart, din gamla mormor med datorskärm från -97 kan få problem.
Mitt tips är att alltid kolla hur din blogg ser ut i olika upplösningar på http://viewlike.us
Känner du dig redo för lära dig mer? Kolla in de andra delarna av "Så designar du din blogg":


Direct link:
http://dayviews.com/lwordish/2009/12/16/