Cliënt CSS-sjablonen

Geavanceerde CSS-sjablonen voor klanten voor consistente klantpromoties

De stylinglaag is wat u daadwerkelijk beheert zodra de reviews en logo's zijn geplaatst. Een CSS-sjabloon voor klanten bepaalt de kaartverhoudingen, de lettergrootte en de afstand tussen een citaat en de bron, samen met de bijbehorende breakpointregels. Wat overblijft is het kiezen van de kant-en-klare look die bij uw proefdruk past, en vervolgens de paar onderdelen aanpassen die niet bij uw merk passen.

Sliders, rasters, staande kaarten, logo-walls

Kant-en-klare klantstijlen zijn er in een paar herkenbare vormen:

1. Rasters met reviews, waarbij meerdere testimonials naast elkaar staan met een gelijke dikte;

2. Sliders, die zichtbaarheid opofferen voor ruimte zodra u twintig citaten hebt;

3. Staande kaarten, met een gezicht en de bijbehorende bronvermelding onder de tekst;

4. Logo-walls, aangepast aan woordmerken en vierkante logo's met zeer verschillende verhoudingen.

Staande kaarten vormen hier een belangrijk verschil. Bij foto's moet de lettergrootte ruimte overlaten voor een naam en een functie binnen een vaste afbeeldingsgrootte, en citaten moeten noodgedwongen kort zijn. Zonder citaten kan een recensie langer zijn en kan de bronvermelding beperkt blijven tot een enkele kleine regel eronder. Sliders brengen hun eigen stijl met zich mee, omdat bedieningselementen en positiemarkeringen voldoende contrast nodig hebben om klikbaar te lijken.

Lange testimonials gedragen zich anders op smalle schermen

Het meeste werk in een stylingset voor een klant vindt plaats waar de inhoud niet langer voorspelbaar is:

1. Een recensie van 300 woorden in dezelfde regel als een recensie van 12 woorden;

2. Aanhalingstekens die een kaart op een laptop omlijsten en de helft van een telefoon in beslag nemen;

3. Een klein vierkantje dat verdwijnt naast een breed woordmerk in een raster;

4. Bronvermelding die verder van het citaat afdrijft zodra de verticale afstand toeneemt.

Vaste hoogtes zijn hiervoor grotendeels de oorzaak. Door kaarten te laten meegroeien met hun inhoud, markeringen te beperken met een maximale breedte en hoogte in plaats van een gedeelde breedte, en de ruimte onder een citaat kleiner te houden dan de ruimte tussen kaarten, wordt het meeste probleem opgelost. Nicepage ondersteunt aangepaste CSS wanneer een enkel hardnekkig onderdeel zich nog steeds misdraagt, en dat is het eerlijke gebruik ervan: een uitzondering binnen een set regels die verder gelden.

Kies eerst de stijl op basis van de inhoudsgrootte

Kijk eerst naar wat je hebt, voordat je kijkt naar wat er mooi uitziet. Twintig korte aanbevelingen en een set klantmarkeringen vragen om een raster en een muur, beide rustig en consistent. Drie lange verhalen met cijfers vragen om brede panelen waar resultaten tot hun recht komen. Teams met beide soorten citaten gebruiken meestal twee gerelateerde stijlen op één site, verbonden door een gedeeld lettertype en kleur. Als je citaten sterk variëren in lengte, test die variatie dan eerst, want een klantproef wekt alleen vertrouwen als het er weloverwogen uitziet.