Hoe je een goede portalpagina bouwt voor je InSite of OutSite (2)

Deel 1 nog niet gelezen? Lees dan deze eerst voordat je aan deel 2 begint!
Ook deel 3, deel 4 en deel 5 zijn nu beschikbaar.

1. Alternatieve achtergrond per pagina

Je kan per pagina een alternatieve achtergrond instellen. Je kunt je achtergrond hiermee dus afstemmen op de inhoud van je pagina, zonder dat dit andere pagina's op je website beïnvloedt. Hiermee kan je je homepage bijvoorbeeld een afwijkend, uniek uiterlijk geven of een intern bericht over bijvoorbeeld de zomervakantie een leuke achtergrond meegeven.

Hoe doe ik dit?

Ga naar de eigenschappen van je (portal)pagina en kies voor het tabblad 'Achtergrond'. Hier kun je een alternatieve achtergrond instellen.

Goed om op te letten

Achtergrondkleur van je zone in het thema
Wanneer je in het thema hebt bepaald dat een zone (bijvoorbeeld de zone content) een vaste achtergrondkleur heeft, heeft deze voorrang op je alternatieve achtergrond. Je hebt de mogelijkheid om een zone op transparant te zetten.

Grootte van afbeeldingen
Met een achtergrondafbeelding heb je de mogelijkheid om een hele grote afbeelding te gebruiken. Hier schuilt wel een gevaar in. In deel 1 lees je waarom!

Mobiel en desktop
Wil je voor zowel mobiel als desktop een alternatieve achtergrond instellen? Dan moet je deze los van elkaar instellen. Dit zie je op het screenshot hieronder.

2. Maak gebruik van opvallende buttons

Met een button kan je jouw call-to-action (hetgeen waar je wilt dat bezoekers op klikken) extra benadrukken. Je kunt buttons naar eigen wens opmaken. Van ronde hoeken, tot de kleur dat deze moet worden wanneer je er met je muis overheen gaat.

Hoe je het uiterlijk van een button bewerkt lees je in het Help Center.

Denk om 'de banaan'

Inderdaad, het klinkt gek, maar denk om de banaan op je website. De banaan is datgene wat er uit moet springen op je website. En laat dit vaak nu net de button zijn.

Hiervoor kies je een opvallende, complementaire kleur voor je button. Is je huisstijl blauw? Kies dan bijvoorbeeld voor een oranje button. Is de huisstijl paars? Dan valt geel het meeste op.

Voorbeelden

Voorbeeld Facebook: De groene knop met 'Create new account' valt hier het meeste op.

Voorbeeld Hersenstichting: De oranje knop met 'Doneer' valt je als eerste op.

Complementaire kleuren toepassen

In onderstaand schema kan je zien welke kleur past bij jouw huisstijl.

Schema met complementaire kleuren. Kies voor je button de tegenovergestelde kleur van je prominente kleur uit je huisstijl.

3. Een afbeelding selecteren bij je gedeelde link op Social media

Wanneer je gebruik maakt van OutSite, zul je de link van jouw website vast ook delen op sociale media. Om jouw bericht op sociale media aantrekkelijker te maken, kan je een afbeelding toevoegen aan de link die je deelt. Je bericht wordt niet alleen groter vertoond in de tijdlijn, maar kan hiermee ook een indruk van jouw organisatie en/of achterliggende pagina meegeven.

Voorbeeld: een zelf gekozen foto wordt getoond bij de link op LinkedIn.

Hoe doe ik dit?

Je kunt een afbeelding toevoegen door in de eigenschappen van de pagina een afbeelding te uploaden onder het tabblad ‘Algemeen’.

Goed om te weten

Facebook & LinkedIn slaan de gegevens van jouw link op hun eigen servers op. Het kan dus zijn dat wanneer jij aanpassingen doorvoert, maar jouw link al een keer eerder op Facebook of LinkedIn gedeeld is, je jouw wijziging niet terugziet. Gelukkig is er voor beide platforms een methode om dit op te lossen.

Facebook
Facebook heeft een eigen ‘debugger’. Je vindt deze hier: Facebook debugger.
Plak hier simpelweg jouw URL in en jouw link wordt opnieuw geïndexeerd.

LinkedIn
LinkedIn heeft ook zo'n tool. Deze heet de LinkedIn Post Inspector. Plak hier jouw URL en je link wordt opnieuw geïndexeerd.

4. Gerelateerde site

Een gerelateerde site toevoegen is geen specifieke functionaliteit voor een portalpagina, maar toch kan het erg handig zijn voor jouw InSite of OutSite. Naast je normale menustructuur kun je rechts bovenaan de pagina een extra link toevoegen. Vaak wordt dit op websites gebruikt om te verwijzen naar de website in een andere taal, een klantportal of veelgebruikte handige links.

Het is niet geschikt om je normale menustructuur hierin op te bouwen. Ook is het alleen zichtbaar op de desktopversie van je site.

Voorbeeld

Voorbeeld van AFAS.nl: een snelle verwijzing naar handige links.

Hoe doe ik dit?

Een gerelateerde site voeg je via een gerelateerde verwijzing toe aan je menustructuur. Alle pagina’s die gekoppeld zijn aan dit menu-item zullen daarbij de gerelateerde site tonen (tenzij je context overnemen uit hebt staan). 

Open je menu, open de eigenschappen van een menu-item en maak vervolgens een nieuwe gerelateerde verwijzing in de groep ‘Gerelateerde site’  aan.

Tekstkleur van de gerelateerde site aanpassen

Het kan dat de standaard tekstkleur niet overeen komt met jouw InSite of OutSite. Je kunt de tekstkleur van jouw gerelateerde site aanpassen in de thema-editor.

Kies in de thema-editor voor Banner -> Banner opsomming

We hopen dat je wat hebt aan deze tips om de portalpagina's op je InSite of OutSite te verbeteren. Want van mooie dingen worden medewerkers, klanten (en wij als AFAS) blij! 

De 4 tips uit dit artikel:

1. Alternatieve achtergrond
2. Maak gebruik van opvallende buttons
3. Afbeelding voor social media
4. Gerelateerde site