CSS-gallery websites staan er vol mee:prachtige CSS gestijlde websites. Als je de laatste honderd entries van deze webgallery's Niet alle webdesigners in Nederland spelen even fanatiek in op deze trends. Waarom zou een organisatie wel mee gaan in trends op het gebied van bijvoorbeeld marketing, maar hun website laten voor wat het is? In dit artikel staan een paar van die trends opgenoemd met voorbeelden van succesvolle integratie ervan op websites. Als dit geen inspiratie biedt...
Waarschijnlijk de meest duidelijk zichtbare trend van de afgelopen tijd is de opkomst van de textures in backgrounds. Voornamelijk organische textures (zoals canvas) doen het goed. Het is uiteraard goed om eerst na te gaan of een organische texture wel past bij de identiteit van de klant. Voor sommige organisaties is een wat meer cleane en klinische look wellicht een betere oplossing.
Door ribbons (linten/vaandels/banden) te gebruiken doorbreek je het statische effect dat rechte hoeken kunnen hebben, doordat het lijkt alsof het elementen uit de 'grid' ontsnappen. Ribbons zijn naast eastetica handig wanneer je extra informatie kwijt wilt, of wanneer je het betreffende beeldelement wilt benadrukken.
Voor klanten die geen fysieke, tastbare producten maken en daar geen afbeeldingen van gebruikt kunnen worden, zijn iconen de oplossing bij uitstek. Iconen maken platte teksten smeuïger en nodigen uit om (verder) te lezen. Je kunt je eigen iconen ontwerpen, maar wanneer je werkt met een wat beperkter budget zijn er genoeg gratis icon-sets te downloaden.
Weg met die pagina-strekkende kolommen. Niet alleen is de tekst beter leesbaar wanneer je smallere kolommen gebruikt, het biedt meer ruimte om te spelen met andere beeldelementen. Grid frameworks, zoals 960gs, geven je een houvast voor de indeling van een website, geheel naar wens in te stellen.
Wat je de laatste tijd vaak ziet, voornamelijk op websites van software-fabricanten is een vlakverdeling van de pagina's door middel van een background. Je zou denken dat de website eruit komt te zien alsof deze te breed is, maar door content in een 'container' te centreren, creëer je een duidelijke afscheiding tussen de content en background.
Witruimte, dat overigens niet per definitie de ruimte op de pagina is die wit is betekent, wordt steeds vaker ingezet bij het maken van de indeling van een website. Je kunt om twee elementen (zoals kolommen) van elkaar te scheiden een border gebruiken of ze beiden een andere achtergrond kleur of image geven. Een andere oplossing die steeds vaker wordt gebruikt is het creeëren van een grote witruimte tussen de elementen, bijvoorbeeld door middel van een grotere padding.
Een andere manier waarop de witruimte terugkomt is een grote interlinie. Een grote interlinie zorgt voor een betere leesbaarheid van de tekst. Om de line-height (interlinie) in te stellen kun je het beste percentages gebruiken in je CSS-stylesheets. Hierdoor hoef je, wanneer je het corps (grootte van de letter) aanpast, niet ook de line-height aan te passen. Doe eens gek en zet de line-height op 150%, of - als je heel erg in je zonezit - zelfs 160%. Mocht je geen percentages willen gebruiken, dan kun je het aantal px van de font-size als vuistregel uiteraard ook met 1,5 vermenigvuldigen, en de uitkomst daarvan als line-height gebruiken.
Wanneer je op website van vooraanstaande webdesigners kijkt, en je denkt een effen achtergrondkleur te zien,... laat je niet voor de gek houden! Subtiele gradients zijn in trek bij veel webdesigners, en geven net die extra sparkle aan een website boven een effen kleur.
Als je een beetje up to date wilt blijven op het gebied van trends in hedendaags webdesign, raad ik aan ca. een keer per week een bezoek te brengen aan de volgende websites.
(Weet je van jezelf dat je zult vergeten de CSS gallery's te bezoeken? Dan kun je jezelf natuurlijk ook abonneren op de RSS feeds van de website)