Drie kleine acties die een wereld van verschil maken voor je website.

Je bent zelf aan de slag met je website maar bent geen designer? Daar helpen de website platforms jou natuurlijk bij met hun voorgemaakte templates. Dat is bij Squarespace 7.1 niet anders. Ook als niet designer kan je je eigen website bouwen met mooi resultaat dankzij al de design settings die netjes voor je klaar staan.

Je kan in Squarespace ook een pak dieper gaan ‘graven’ om je settings helemaal naar je hand te zetten. Voor wie van design houdt en het template graag helemaal personaliseert, is dat dus ook mogelijk.

Maar terug naar jou als je zelf aan de slag bent. Je bent vanuit een template vertrokken, met kleuren die reeds klaar staan en lettertypes die gekozen zijn. Je bent fier op jezelf, want je bent al een heel eind geraakt.

Op dit punt wil ik jou enkele aandachtspunten meegeven die, als je er oog voor hebt, een wereld van verschil maken voor de bezoeker van je website:

  • tekst-blok-breedte

  • ruimte op je pagina

  • tekst-hiërarchie

Met jouw design, ondersteun en versterk je jouw boodschap. En dat is natuurlijk waar het allemaal om draait, dat je met jouw boodschap je (potentiële) klant verder kan helpen.

Lees dus even verder over hoe je met deze drie kleine acties het design van je website verbetert, en dus ook het leesplezier van je bezoeker vergroot. Ik zou het te jammer vinden als jouw steengoed verhaal, jouw boodschap door je design teniet gedaan wordt.

Tekst-blok-breedte.

De eerste tip is een hele eenvoudige maar wordt nog vaak over het hoofd gezien.

Laat je tekstblokken niet over het hele scherm lopen. Zo'n scherm-brede zinnen zijn heel lastig om te lezen en nodigen daar dus ook niet toe uit. Terwijl jij je met je teksten net willen verbinden met je lezer. Zo’n lange zinnen lezen zijn als een tenniswedstrijd volgen, dat voel je op de duur in je nek en in je ogen. Je wordt er moe van.

Wat dan?

Pingpong?

Dat gaat dan vaak weer te snel heen en weer, dan heeft je lezer al snel een zinnetje gemist.

Je gaat dus op zoek naar de midden-lengte, die aangenaam leest. Je wisselt die lengte af met de pingpong-lengte. Zodat het een mooi, levendig en leesbaar geheel blijft.

Als je een stevige tekstblok hebt, kan je deze in Squarespace aanpassen via de paginasectie: maak de breedte ‘small’ of ‘medium’ en meteen is je tekstblok makkelijker te behappen.

Of plaats een afbeelding naast je tekst.

Je lezer zal je dankbaar zijn.

tekst beeldscherm breed is niet leesbaar
kortere lijnen zijn beter leesbaar
 

Te weinig ruimte

veel te drukke layout

En, wat heb je als eerste gezien op de afbeelding hierboven?
Hoe voel je je als je naar deze pagina kijkt?
Hoe wil je dat jouw bezoeker zich voelt?

Pagina's die vol informatie staan, de ene afbeelding naast de andere, het ene tekstblok boven of naast het andere, paginasecties zonder ruimte.
Het laat je bezoeker ademloos achter. Ik kan dat soms echt fysiek aan mijn adem voelen. Als ik naar de pagina hierboven kijk, hou ik onbewust mijn adem in.

Als DIY-er kan je al eens het idee hebben dat je zoveel mogelijk kwijt moet op je website, op zo’n klein mogelijke ruimte, zodat je bezoeker niet hoeft te scrollen en alles in 1 oogopslag kan zien. Je zet je paginasecties dicht tegen elkaar, laat je teksten hoog beginnen, kortom, je begint te ‘proppen’. Zo werkt het niet.

Gun je lezer een korte pauze. Zij kan maar één ding tegelijk lezen. En scrollen is niet erg, als je een boodschap brengt waar ze wat mee kan.

In de Classic Editor van Squarespace is het 'spacer' blok hiervoor een goede helper. Ik noem hem dan ook 'de held van de ruimte'. Hiermee kan je gaan spelen en zoeken om alle elementen op je pagina ruimte te geven.
In de Fluid Engine Editor helpt het grid om je blokken tekst en foto’s zo te plaatsen dat er ruimte tussen is.

spacer blok de held van de ruimte

Dat brengt rust en overzicht. En zo ben je vriendelijk voor je lezer. Die neemt dagelijks al zoveel informatie tot zich, dat hij zal voelen hoe aangenaam het vertoeven is op jouw website.

Visuele tekst-hiërarchie

De laatste kleine actie vraagt de nodige aandacht. Het vraagt van jou dat je weet welke boodschap de belangrijkste is op je pagina en welke minder. Op die manier kan je ook in je vormgeving visueel deze tekst-hiërarchie aanbrengen. Zo begeleid je je lezer ook weer op een vriendelijke manier doorheen wat jij wil vertellen.
Als alle tekst hetzelfde lettertype is van dezelfde grootte, dan is dat heel lastig om te lezen. Je laat je lezer onbeheerd achter in een wildgroei van letters waarin hij zelf orde moet scheppen. Bovendien is het beeldscherm geen boek.
Denk na over je titels, zodat die echt vertellen waar het tekstblok over gaat. In je tekstblok kan je hiërarchie brengen met subtitels. Kijk maar naar dit blog.

 

Gelukkig helpt Squarespace je daar goed bij, doordat je de verschillende tekst-types gemakkelijk vorm kan geven, van groot naar klein:
Heading 1, 2, 3 en 4. Paragrafen 1, 2 en 3.

Dit is een handige tool om een pagina visueel helder op te bouwen en duidelijk te maken aan je lezer wat belangrijk is en wat hij kan lezen als hij echt geboeid is en/of tijd heeft.

Deze settings staan voor je hele website ingesteld. Als je dus een nieuwe pagina maakt, moet je niet opnieuw over je lettertype en lettergrootte na te denken.

En ook hier: deze settings zijn vooraf ingesteld, maar je kan ze tot in detail aanpassen en personaliseren als je dat wenst.
Bovendien is het ook goed voor de SEO van je site om belangrijke inhoud in heading 1 te plaatsen, daarmee help je Google in te schatten waar je website over gaat, welke waarde jij voor je klanten brengt.


Ik ben benieuwd of je met deze tips anders naar je website kan kijken en dingen verbeteren. Laat van je horen.

Dit heb ik verbeterd
 

Geen zin of tijd om zelf aan de slag te gaan?
Je kan het ook helemaal aan mij overlaten en ik maak jouw webverhaal van klik tot klaar in Squarespace 7.1.

Aanbod Met menna

Heidi Lambrechts Met Menna webdesign
 
Heidi Lambrechts

I help solo-entrepreneurs make their website in Squarespace.

https://www.metmenna.com
Vorige
Vorige

Maak jouw website klaar voor het nieuwe jaar

Volgende
Volgende

Kies voor Squarespace als je zelf je website wil bouwen (deel twee)