Wat doet Sandra aan huis?
Bezoekers vinden de behandelingen en uitleg over hoe een afspraak thuis werkt.
Projectcase · Live
Sandra's Hair
Een nieuwe website voor Sandra, kapper aan huis in Voorburg en omgeving.
Ik heb haar bestaande website opnieuw ingedeeld en gebouwd. Bezoekers kunnen de behandelingen en prijzen vinden, lezen wie Sandra is en een afspraak aanvragen. Haar specialisatie in natuurlijk krullend haar kreeg een eigen pagina.
Persoonlijke kapper aan huisMooi haar, gewoon in je eigen omgeving.Maak een afspraak
Project in het kort
Behandelingen, prijzen en afspraken kunnen vinden.
De oude website bevatte al veel informatie. Ik begon met het verdelen daarvan over pagina’s, zodat een bezoeker bijvoorbeeld eerst over krullenknippen kan lezen en daarna contact kan opnemen.
- Projectvorm
- Volledige herbouw van een bestaande website
- Doelgroep
- Nieuwe en bestaande klanten in Voorburg en omgeving
- Mijn rol
- Informatie indelen, ontwerp en websitebouw
- Techniek
- Next.js, TypeScript en Tailwind CSS
- Ontwerp
- Crème en aubergine, Newsreader en Manrope
- Status
- Live op sandrahair.nl
De beginsituatie
Welke informatie hoort bij elkaar?
Ik liep de bestaande teksten over behandelingen, tarieven, werkgebieden en Sandra’s werkwijze na. Daaruit maakte ik een nieuwe indeling voor het menu en de pagina’s.
Kappersdiensten en krullenknippen kregen elk hun eigen uitleg. Magnetiseren heb ik apart gehouden, zodat bezoekers die een kapper zoeken niet door dat andere aanbod hoeven te lezen.
De indeling
Dit moesten bezoekers op de site kunnen vinden.
Losse informatieDienstenTarievenKrullenPersoonlijkPraktischMagnetiseren
Nieuwe indelingKappersdienstenKrullenexpertiseOver SandraPraktisch & contactMagnetiseren als aparte route
Een eigen pagina over krullenknippen
Sandra is gespecialiseerd in natuurlijk krullend haar. Op een aparte pagina is ruimte om die behandeling uit te leggen.
Kennismaken met Sandra
Omdat Sandra bij mensen thuis komt, is er ook een pagina over wie zij is en hoe zij werkt.
Magnetiseren apart uitleggen
Dit aanbod staat op een eigen pagina. Zo blijft op de rest van de site duidelijk dat Sandra kapper aan huis is.
De pagina’s
Een aparte pagina voor iedere soort informatie.
De homepage stelt Sandra kort voor. In het menu kun je verder naar behandelingen, krullenknippen, prijzen of contact. Zo kan iemand die alleen de tarieven zoekt daar meteen naartoe.
HomeKennismaken
DienstenBehandelingen
KrullenknippenExpertise
PrijzenTarieven
Over SandraWie er langskomt
ContactAfspraak aanvragen
MagnetiserenAfzonderlijke route
HomeKennismaken
DienstenBehandelingen
KrullenknippenExpertise
PrijzenTarieven
Over SandraWie er langskomt
ContactAfspraak aanvragen
MagnetiserenAfzonderlijke route
Belangrijkste bezoekersroutes
Zo kun je door de pagina’s klikken.
Hieronder staan een paar voorbeelden. De privacyverklaring en andere praktische informatie zijn onderaan de website te vinden.
- 01Home → Diensten → Prijzen → Contact
- 02Home → Krullenknippen → Contact
- 03Home → Over Sandra → Contact
Merk en ontwerp
Crème, aubergine en ruimte voor de tekst.
Ik koos een lichte achtergrond met aubergine voor de tekst en accenten. Foto’s en langere teksten kregen wat meer ruimte, zodat de pagina’s rustig te lezen zijn.
Voor de koppen gebruikte ik Newsreader en voor lopende tekst Manrope. Hieronder zie je de kleuren en voorbeelden uit het ontwerp.
Warme ivory#FBF8F4
Diepe aubergine#713B50
Ingetogen koper#B98262
Warm antraciet#251F22
Newsreader · KoppenPersoonlijke aandacht aan huis.
Dit lettertype gebruik ik voor de grotere koppen op Sandra’s website.
Manrope · Lopende tekstBehandelingen en afspraken
Voor de uitleg, tarieven en tekst op de knoppen.
Persoonlijke verzorgingJe haar laten knippen bij je thuis.
Een voorbeeld van hoe een kop en uitleg op de pagina bij elkaar staan.
Keuzes in het ontwerp
Deze onderdelen komen terug op de pagina’s.
- 01Veel ruimte rond inhoud en fotografie
- 02Foto’s naast de bijbehorende uitleg
- 03Licht afgeronde hoeken bij foto’s en vlakken
- 04Dunne lijnen en lichte schaduwen
- 05Knoppen die aangeven wat je ermee doet
- 06Beelden bij de behandeling of het onderwerp
De kleuren bij elkaar houden
Ik heb het bij een klein aantal kleuren en rustige achtergronden gehouden. Zo blijven de behandelingen, prijzen en foto’s ook op langere pagina’s goed te volgen.