Offert på hemsida: så prissätter och skriver du den (med exempel)

En bra offert på webbdesign börjar med ett kort behovssamtal och delar sedan upp projektet i tydliga faser: förstudie och strategi, design, utveckling, innehåll, grundläggande SEO och lansering, med hosting och underhåll som en separat återkommande post. Varje fas får egna offertrader med antal, priser och vad som ingår, följt av antalet revideringsrundor, en betalningsplan och ett giltighetsdatum. Att erbjuda två eller tre paket i stället för ett pris gör det lättare för kunden att tacka ja.

Den här guiden går igenom varje steg: vad du ska fråga innan du sätter något pris, hur du väljer prissättningsmodell, hur du strukturerar offerten och ett genomarbetat exempel för ett småföretags webbplats. Oavsett om du är ensam designer eller en liten studio gäller samma struktur. Vill du ha en allmän checklista först, läs vad en offert ska innehålla.

Samla in kraven innan du lämnar offert

De flesta webbprojekt som drar över budget var underprissatta, inte dåligt utförda. Orsaken är oftast en fråga som saknades i början: ingen frågade vem som skriver texterna, hur många språk webbplatsen behöver eller om bokningssystemet måste prata med ett befintligt verktyg. Ett behovssamtal på tjugo minuter, eller ett kort frågeformulär, gör att du slipper gissa.

Frågor att ställa i behovssamtalet

• Mål: vad ska webbplatsen uppnå? Fler förfrågningar, bokningar online, försäljning, rekrytering, trovärdighet?
• Målgrupp: vem besöker webbplatsen och vad behöver de hitta snabbt?
• Sidor och struktur: ungefär hur många sidor, och vilka har en unik layout respektive återanvänder samma mall?
• Innehåll: vem skriver texterna och står för bilderna? Ska befintligt innehåll flyttas över, och hur mycket?
• Funktioner: kontaktformulär, blogg, bokningar, webbutik, medlemssidor, integrationer med verktyg de redan använder?
• Språk: ett språk eller flera? Flerspråkiga webbplatser innebär mer arbete med design, bygge och innehåll.
• Varumärke: finns det en logotyp och en grafisk profil, eller måste det tas fram först?
• Plattform: har kunden ett önskemål om CMS eller behöver de kunna redigera webbplatsen själva?
• Tidsplan: finns det en fast deadline, till exempel ett lanseringsevent eller en kampanj?
• Budget: har de ett spann i tankarna? Att fråga öppet gör att du slipper designa ett paket som ingen har råd med.
• Beslutsfattare: vem godkänner designen, och vem skriver under offerten?

Välj prissättningsmodell

Det finns inget enda rätt sätt att prissätta en webbplats. De flesta designers och byråer använder en av fyra modeller, eller en blandning av dem.

För ett småföretags webbplats är ett fast pris byggt på tydliga offertrader ofta det som är enklast för kunden att godkänna: kunden vet vad hen kommer att betala och ser vart pengarna går. Bakom kulisserna kan du fortfarande räkna fram varje rad utifrån en uppskattning av dagar till ditt pris. Kom bara ihåg att lägga in en buffert för projektledning, möten och feedbackrundor, som är lätta att glömma och sällan små.

Strukturera offerten efter faser

Dela upp projektet i faser som motsvarar hur du faktiskt arbetar. Kunder litar på priser de kan följa, och separata rader låter dem justera omfattningen i stället för att be om rabatt på totalsumman.

1. 1Förstudie och strategi: uppstartsworkshop, mål, sajtkarta, sidstruktur och vid behov wireframes.
2. 2Design: visuell design av startsidan och varje unik sidmall, för dator och mobil, med ett fast antal revideringsrundor.
3. 3Utveckling: bygge av mallarna i valt CMS, responsivt beteende, formulär och eventuella specifika funktioner som en blogg eller ett bokningsverktyg.
4. 4Innehåll: inläggning eller flytt av innehåll, och textförfattande eller fotografering om du erbjuder det. Var tydlig när innehållet är kundens ansvar.
5. 5Grundläggande SEO: sidtitlar och metabeskrivningar, rena URL:er, omdirigeringar från den gamla webbplatsen, grundläggande prestandakontroller och inskickning av sajtkarta. Håll formuleringen blygsam; det här är en grund, inte en löpande SEO-kampanj.
6. 6Lansering: test i olika webbläsare och på olika enheter, publicering och en kort utbildning så att kunden kan uppdatera webbplatsen.
7. 7Hosting och underhåll: en återkommande post per månad eller år för hosting, uppdateringar, säkerhetskopior och mindre ändringar. Håll den skild från det engångsbaserade projektpriset.

offinal.com/q/7hX2kP

UX & visuell design2 400 €

Wireframes, prototyper och ett komplett designsystem.

Utveckling4 800 €

Responsiv implementation, CMS-uppsättning och prestandaoptimering.

Lansering & utbildning900 €

Stöd vid lansering och en praktisk workshop för teamet.

I en PDF finns det alltid en avvägning mellan detaljer och läsbarhet. Med interaktiva offertrader kan du hålla översikten kort och låta kunden öppna hela beskrivningen, en skärmbild av en tidigare design eller en exempelwireframe för varje rad.

Ett genomarbetat exempel: webbplats för ett småföretag

Här är ett exempel på en offert till en lokal fysioterapimottagning som vill ha en ny webbplats med ungefär åtta sidor, ett kontaktformulär och en enkel blogg. Kunden står för texter och bilder. Priserna nedan är bara en illustration av strukturen, inte marknadsdata. Priserna varierar kraftigt beroende på land, erfarenhet och typ av kund, så använd dina egna siffror.

Några saker gör att exemplet fungerar. Design- och utvecklingsraderna räknas per mall, inte per sida, så kunden förstår varför åtta sidor inte kostar åtta gånger så mycket. Revideringsrundorna står i själva offertraden. Textförfattande finns inte med, och antagandet att kunden står för innehållet är utskrivet. Hosting visas separat som ett återkommande tillval, så att det inte blåser upp projektpriset och kunden kan välja det eller inte. Momssatsen är ett exempel för en belgisk företagskund; använd den momssats och hantering som passar din situation.

Erbjud tre paket i stället för ett pris

Ett enda pris bjuder in till ett ja-eller-nej-beslut. Tre paket gör det till ett val mellan alternativ, vilket är ett mycket enklare samtal. För exemplet ovan skulle paketen kunna se ut så här:

• Bas: upp till fem sidor på två mallar, kontaktformulär, grundläggande SEO, en revideringsrunda.
• Standard: hela offerten ovan, med blogg, fyra mallar och två revideringsrundor.
• Komplett: allt i Standard plus texter till de viktigaste sidorna, ett andra språk och tre månaders underhåll ingår.

Gör mittenpaketet till det du skulle rekommendera, och gör skillnaderna lätta att se. Vår guide om bra–bättre–bäst-prissättning förklarar hur du utformar nivåerna så att de hjälper kunden att bestämma sig i stället för att förvirra. Med interaktiv prissättning kan kunden välja ett paket och kryssa i tillval som underhåll eller ett extra språk, och totalsumman uppdateras direkt.

Hantera revideringar och växande omfattning

Webbprojekt är särskilt utsatta för att omfattningen växer, eftersom kunder ofta inser vad de vill ha först när de ser den första designen. Det är normalt. Offerten ska helt enkelt göra tydligt vad som händer när det inträffar.

• Bestäm antalet revideringsrundor per designfas, oftast två, och definiera vad en runda är: en samlad omgång feedback, inte en ström av separata mejl.
• Definiera vad som räknas som en ändringsbegäran. Nya sidor, nya funktioner eller en ändrad riktning efter att designen godkänts ligger utanför den överenskomna omfattningen.
• Prissätt extraarbete i förväg. Ange ditt pris för ytterligare revideringsrundor eller extra sidor, till exempel som timpris eller dagpris, så att det inte blir någon förhandling senare.
• Använd godkännandepunkter. Be om skriftligt godkännande av sajtkartan och designen innan utvecklingen börjar. Att ändra en design i Figma är billigt; att ändra den när den redan är byggd är det inte.
• Lämna separat offert på ändringar. När kunden ber om något nytt, skicka en kort tilläggsoffert i stället för att ta kostnaden själv.

Gör en betalningsplan

För ett projekt som tar veckor eller månader lägger du all risk på dig själv om du väntar med betalningen till lanseringen. En betalningsplan kopplad till delmål är vanlig och lätt att förklara:

Vissa designers begär 50 % i förskott, andra delar upp betalningen i fler steg i större projekt. Vad du än väljer, koppla varje betalning till ett delmål som kunden känner igen och ange betalningsvillkoren på dina fakturor. Lägg till en rad om vad som händer om projektet står still på kundens sida, till exempel att nästa delmål faktureras efter ett visst antal veckor utan feedback. Det här är affärsmässiga val, inte lagkrav; kontrollera dina egna allmänna villkor, och fråga din redovisningskonsult eller en juridisk rådgivare om sådant som är specifikt för ditt land.

Skicka den så att kunden kan välja och kommentera

En offert på en webbplats godkänns sällan utan frågor. Kan bloggen läggas till senare? Ingår det andra språket i underhållet? Om de frågorna går via mejl försvinner svaren och offerten hamnar i flera versioner.

Att skicka offerten som en länk i stället för en PDF håller allt på ett ställe. Kunden väljer paket och alternativ och kan använda kommentarer i offerten för att fråga om en specifik offertrad. Du svarar och uppdaterar offerten i samma tråd, så att alla ser den senaste versionen. När kunden är nöjd godkänner hen den online. Vår guide om hur du skriver en offert som kunden godkänner tar upp presentation och timing mer i detalj.

Offinal är byggt för precis den här sortens projektbaserade offerter. Se hur det fungerar för byråer och frilansare.