Introduktion till bilder

1. Inledning

Den här sidan ger en grundläggande förklaring av vad bilder är och hur de används. Sidan skrevs 2003, varför vissa program eller namn kan vara lite gamla. Sista avsnittet ger dig några tips på vad du skall tänka på när du arbetar med bilder.

2. Bildformat

Varje bild du skall lägga in har ett visst format. Man brukar skilja mellan två olika innebörder av ordet "format", dels vilken typ av fil det är frågan om och dels vilken storlek bilden har på skärmen.

Filtypen innebär att bilden är sparad på ett visst sätt. Bilderna finns då i mappar på datorn och symboliseras med olika ikoner. På sidan med olika bildtyper berättar jag mer om hur ikonerna ser ut och vilka vanliga bildtyper som finns. Läs mer här >

Bildstorleken innebär att bilden har en vis storlek på höjden och bredden (=skärmstorlek), ett värde som normalt anges i antal pixels (bildpunkter). I princip gäller att ju större en bild är på skärmen, desto mer plats tar den i datorns minne. Man säger här att bilder har olika vikt, som alltså anspelar på hur mycket utrymme de tar i minnet.

Det finns flera olika bildformat som används i webdokument. I princip skiljer man mellan pixelbaserade och objektbaserade bilder. Du kan läsa mer om skillnaden på sidan om bildtyper.

GIF och JPEG är pixelbaserade, vilket betyder att bilden består av en mosaik av pixlar. Ordet "pixel" är en kortform för "picture element".

GIF betyder "Graphics Interchange Format" och har filextensionen (ändelsen) .gif. JPEG betyder "Joint Photographic Experts Group" och har filextensionen .jpg. Skillnaden mellan formaten är att de tillämpar olika komprimeringstekniker: GIF en icke-förstörande och JPEG en förstörande. Du kan läsa mer om filkomprimering på den särskilda sidan om det. Läs mer här >

GIF och JPEG har lite olika användningsområden och en bra minnesregel är att små bilder som har få färger skall sparas i GIF, medan större, informationstätare bilder skall ha JPEG- formatet.

3. Vilka program behöver du?

För att göra egna GIF- och JPEG-bilder behöver du program som kan spara bilder med dessa filformat. Du behöver också ett program som klarar av att komprimera bilderna på ett så effektivt sätt som möjligt, eftersom du ju vill att bilderna skall ta så liten plats som möjligt på ditt internetkonto.

Det finns många olika bildbehandlingsprogram, alltifrån de som är gratis till de som kostar tiotusentals kronor. Man kan också dela in dem i två kategorier:

Bildbehandlingsprogram används främst för att redigera bilder, t.ex inläsa via en scanner eller tagna med digitalkamera. Proffsprogrammet i sammanhanget heter Photoshop. Det klarar både av att skapa bilder för webben och att ta fram avancerade bilder som lämpar sig för trycksaker.

Photoshop tillverkas av Adobe och finns i flera olika versioner, t.ex Photoshop LE och Elements. Behöver man inte kunna skapa tryckbara bilder kan Elements vara ett alternativ. För webbgrafik finns också många gratisprogram.

För webbgrafik använder jag själv Fireworks. Det klarar inte tryckbara bilder, utan är ett rent webbgrafikprogram i kategorin "bildbehandlingsprogram". Andra program i samma genre är t.ex PaintShop Pro och Graphic Converter. Det senare är dock kanske mer ett program för att konvertera olika bildfiler till lämpliga format.

Det finns också många program som är shareware och därför inte kostar lika mycket som proffsprogrammen. Dessa billigare varianter har inte samma grafikmotorer och klarar därför inte av lika mycket. De är oftast framtagna för något speciellt syfte, t.ex att beskära bilder, omvandla dem till olika format, osv.

Köper man en scanner eller digitalkamera, får man oftast med ett enkelt bildredigeringsprogram. Jag har på sådant sätt fått både Photoshop LE och Photo DeLuxe, båda från Adobe.

Förutom alla bildredigeringsprogram, finns även rena ritprogram. Här finns Paint, som ingår i Windows. Men de riktigt dyra programmen finns här, för den som vill arbeta med akvarell eller olja direkt i datorn.

Innan man köper ett program bör man först pröva några olika. Man kan oftast ladda ner demoversioner från tillverkarnas hemsidor. En annan möjlighet är att använda datortidningarnas CD-ROM-skivor, som ofta har med demoversioner av bra program. Att just pröva ett program innan man köper det kan vara en mycket god affär.

På min sida med länkar hittar du en förteckning över fler program och tillverkare. Läs mer här >

4. Några tips innan du börjar

Håll ordning och lägg dina bilder i samma mapp som de HTML- dokument de skall ingå i.

Tänk på att filnamn ibland är stavningskänsliga (case sensitive). Heter filen "Bild.gif", duger det inte alltid att ange namnet "bild.gif" för webbläsaren. Vissa webbläsare klarar filnamnen ändå, men inte alla. Undvik också svenska och andra konstiga tecken, mellanslag och liknande i filnamnen.

Ange rätt extension till bilderna, om inte programmet gjort det redan.

För att underlätta för dig själv och om du använder dig av siffror när du döper filerna, bör du döpa första filen till 01 och inte 1. Anledningen är att datorn oftast sorterar efter första siffran, snarare än efter talet. Det betyder att efter 1.gif kommer 10.gif och sedan 2.gif. men om du döper första filen till 01.gif, kommer 02.gif att komma sedan och 10.gif kommer då i rätt ordningsföljd!

Tänk på att den som besöker din sida kan ha den automatiska bildvisningen frånslagen. Då syns bara ett frågetecken. Därför bör du lägga in alternativ text som den personen kan läsa i stället (hur du gör visas nedan).

Många bilder är copyrightskyddade och du får inte kopiera dem utan tillstånd! I stort sett alla bilder på webben är idag skyddade på något vis.

Du kan ta egna foton som du scannar in och lägger på din hemsida. Med en digitalkamera kan föra över dina bilder direkt till datorn. Man kan ibland även få sina semesterbilder framkallade och sparade på en CD-skiva, förutom på papper.

Lägg alltid in bilderna så att layouten ger ett lättläst, luftigt intryck. Alltför många bilder kan ge ett både rörigt intryck och ta lång tid att ladda ner.

Tänk på att stora bilder (många pixlar) tar längre tid att ladda ner än många små. Gör gärna "tumnaglar" av bilderna, som förklaras närmare på sidan om bildkartor. Läs mer >

Tänk på att det finns många olika skärmupplösningar. En bild som syns bra i en upplösning på 640*480 kan bli ganska liten och plottrig på en med 1.024*768. På motsvarande sätt blir en bild som har rätt storlek i höjd- och breddled i den senare upplösningen, förmodligen enorm i den låga upplösningen.