Responsive webdesign is de belangrijkste trend van het moment. Het zorgt ervoor dat websites kunnen meeschalen met verschillende grootte schermen: van iphone, naar ipad en van pc-monitor naar tv. Dit is belangrijk nu de groep mensen die websites bekijkt vanaf mobiele apparaten steeds groter wordt.
Ook onze website is responsive gemaakt:
Ik ben om! De hype rondom Pinterest.com kreeg ik al een tijdje mee, maar verder dan registreren was ik nog niet gekomen. Tot voor kort. Ik heb handigheid gekregen in het maken en delen van pins en vind het een heerlijke site om inspiratie op te doen.
Wat Pinterest precies is? Op Pinterest bewaar je foto’s van websites en deel je deze met je volgers. Het resultaat is een soort Twitter met plaatjes. Op Pinterest kun je echter ervoor kiezen om niet alle onderwerpen van iemand te volgen, maar alleen de albums die jij interessant vindt. De website biedt zodoende de mogelijkheid om moodboards te maken. Je bewaart en deelt de leukste kleding, designs, producten, quotes, foto’s etc.
Wil jij met Pinterest beginnen? Volg dan dit stappenplan:
Happy repinning! 
Je Twitterprofiel is een belangrijk visitekaartje. Potentiële klanten die je via Twitter ontmoet, zien eerst je profiel, waarna ze pas besluiten om al dan niet door te klikken naar je website. Je profiel verdient daarom dezelfde uitstraling als je website en je papieren visitekaartje. Een Twitter-achtergrond in huisstijl draagt bij aan de juiste eerste indruk.
Bij het maken van een Twitter-achtergrond is het goed te beseffen dat je profiel door mensen met verschillende schermgroottes bekeken gaat worden. Hierdoor zien mensen verschillende delen van de achtergrond. Omdat Twitter de achtergrond altijd links uitlijnt, is de linkerkant van de achtergrond de uitgelezen plek voor tekst. Deze is bij (bijna) iedereen die Twitter via de website bezoekt zichtbaar.
Ik heb een template gemaakt voor het maken van een Twitter-achtergrond waarbij ik rekening hou met de meest voorkomende schermgroottes. Bij deze deel ik hem graag.
Download het Twitter-template als photoshop-bestand (.psd)
Download het Twitter-template als afbeelding (.jpg)
Kom je er niet uit? Stuur een tweet of DM naar @margaretmassop en stel je vraag.
Of volg mij op Twitter en maak kans op een gratis Twitter-achtergrond. Elke week maak ik namelijk een gratis achtergrond voor een van mijn volgers.
Buttons met mouse-over en klikeffect dragen bij aan de gebruikersvriendelijkheid van een webpagina. De bezoeker krijgt immers direct feedback op zijn acties. In deze blogpost leg ik uit hoe je zo’n button maakt met behulp van CSS Sprites. Dit wil zeggen dat je gebruik maakt van één plaatje voor de hele button. In je stylesheet geef je vervolgens aan welk deel van het plaatje wanneer getoond wordt.
lees meer →
Als de kleuren van een website goed gekozen zijn, dragen ze bij aan het doel van de website en het imago van de afzender. Kleuren bepalen namelijk voor een deel de sfeer en stijl van een website en roepen emoties op. In deze blog beschrijf ik hoe ik de kleuren van een website kies, en welke tools ik daarbij gebruik.
De meeste websites hebben min of meer dezelfde indeling met een bovenbalk, menubalk boven en/of links (of rechts) en een contentdeel. Uitzondering op deze indeling zijn de websites die bestaan uit blokken met foto’s. Deze indeling is vooral geschikt als er veel gelijkwaardige verhalen verteld worden, waarbij er sprekende foto’s zijn. Overigens worden deze blokken ook vaak gecombineerd met een menubalk.
In dit blogbericht enkele voorbeelden van deze opbouw:
lees meer →
Websites moeten zich meer en meer kunnen aanpassen aan verschillende grootte van schermen. Was het vroeger de uitdaging om een website te maken die er goed uitzag op een kleine en een grote pc-monitor, tegenwoordig varieert de grootte van de kleine smartphones tot flatscreen-tv’s.
Een manier om hiermee om te gaan is het bieden van ‘liquid’, oftewel websites die loze ruimte opvullen door kaders te schalen of te verplaatsen . In deze blog 3 voorbeelden van liquid webdesign, waarbij je het verschil ziet tussen de website op een pc-monitor met 1280 pixels breedte en een ipad met 1024 pixels breedte.
Omdat lezen vanaf een scherm vermoeiend is, worden teksten op websites slecht gelezen. Het is daarom belangrijk om je bezoekers het zo makkelijk mogelijk te maken. Zorg voor optimale leesbaarheid van de teksten. Naast de keuze voor een grote letter en voldoende contrast tussen achtergrond en letterkleur, helpt het om de tekst voldoende regelafstand te geven.
Een goede richtlijn is om de regelafstand op minimaal 140% van de letterhoogte in te stellen.
Nu de internetverbindingen en nieuwe technieken het mogelijk maken, zie je steeds vaker een combinatie van interactieve tv en een website. Hoewel het nu nog vaak alleen gaat om de volgorde waarin filmpjes afgespeeld worden (ik vermoed dat we in de toekomst gniffelen dat we dit al interactieve tv noemden), is het een leuke trend met veel potentie.
In dit blogbericht drie voorbeelden.
lees meer →
Bij het maken van een digitale mailing of nieuwsbrief is het de uitdaging dat zoveel mogelijk mensen de nieuwsbrief ontvangen, openen en doorklikken op het gewenste onderwerp.
Wat betreft ontvangen moet je er daarom voor zorgen dat de mail niet gezien wordt als spam. Wat betreft openen moet er een goede subject gekozen worden. En wat betreft doorklikken is het de uitdaging om de mail er goed uit te laten zien in zowel mailprogramma’s (zoals Outlook) als mailwebsites (zoals Gmail) in verschillende browsers.
