Blog

I’ve added woocommerce to my Timber starter theme

Because I’ve finally figured out a nice way to integrate woocommerce with timber and the online tutorials aren’t really very helpful or comprehensive I’ve decided to add my integration to my timber starter theme and write a little tutorial about it. The general idea for this setup is to…

Hoe je WordPress content om kunt zetten naar Statamic

Helaas is er geen gemakkelijk import optie om een WordPress site om te zetten naar Statamic bestanden. Ik vond dit voorbeeld , maar die is al 5 jaar lang niet meer geupdate en doet eigenlijk net genoeg maar ook niet meer. Dus heb ik de repo geforked en…

Statamic vs. WordPress

Ik schreef op mijn site ‘WordPress is mijn goto cms’, maar sinds kort heb ik dat veranderd in ‘Statamic is mijn goto cms’. Sinds ik een project met dit flatfile cms heb gedaan wil ik meer. Het voelt als moderne take op…

Recent werk: Kielzog

Begin 2017 heb ik Kielzog als klant overgenomen. Sindsdien zijn we bezig met het optimaliseren van de site. Als eerste heb ik de site sneller gemaakt voor een betere klantervaring. De belangrijkste verbetering was het toevoegen van lazy loading. Ook heb ik alle voorstellingen voorzien van schema.org meta informatie.

Recent werk: Weekly Risk Report

Wat heb ik gedaan? Voor van Hes Projectmanagement heb ik samen met Arno https://weeklyriskreport.online ontwikkeld. De opdracht was om een online dienst te maken die gebruikt kon worden om projecten te begeleiden die werken met de Best Value methodiek. Hoe dan? Er werd aan het begin van een project…

Recent werk: Onedayartist

In april 2017 is de nieuwe site van Onedayartist online gegaan. Dit redesign zorgt voor een professionelere site en maakt het gemakkelijker om de content te beheren.

M’n wordpress start theme is open-source

Het is een thema dat ik altijd gebruik bij het maken van een wordpress site. Door de jaren heen is het een langzaam groeiende verzameling best practices geworden. En ik blijf dit thema ook uitbreiden als ik betere ideeën tegenkom. De bestanden zijn te vinden op https://github.com/Eworm/template. De belangrijkste…

Recent werk: Pando

Recent heb ik samen met Arno Hoogma Pando opgeleverd. Het concept is een vriendelijke en moderne site waar huurders zich aan kunnen bieden als woningzoekende, en verhuurders hun vastgoed online kunnen zetten.

Marineren

Om iets goeds neer te zetten is het soms beter om er even niet aan te werken. Dat klinkt raar, maar om inspiratie op te doen en goede oplossingen te kiezen moet je als buitenstaander naar je project kunnen kijken.

Het nieuwe lego bureau

Met dank aan Edo de Jong voor het maken van het prachtige houten frame waarop ik m’n lego kon bouwen. Het blad bestaat uit ongeveer 11000 verschillende stukjes lego, en ja, na een dag leggen hadden we allebei zere vingers. Hieronder een korte…

Werken in het wild nummer drie!

Vandaag voor de derde keer in het Wild Gewerkt bij Borg Ewsum bij Middelstum. Ik had er nog nooit van gehoord, en mijn mede-wildwerkers ook niet, maar ’t is een…

Over WIJ Groningen

Van juli tot november dit jaar heb ik samen met de Gemeente Groningen gewerkt aan een website over de veranderingen in het sociale domein: wij.groningen.nl. Ik was verantwoordelijk voor de interactie, toegankelijkheid, webrichtlijnen en de html/css. Het doel van de site Creëren van één…

Verhuizen!

We gaan verhuizen! Vanaf ergens eind dit jaar gaan de meeste bewoners van de Silverroom in de Puddingfabriek naar de Biotoop in Haren! We betrekken met z’n vieren een heel licht en ruim kantoor van 70m2. Gisteren heb ik met m’n nieuwe kantoorgenoten…

Waarom je je html moet verkleinen

Google pagespeed geeft als tip dat het verkleinen van html snelheidswinst oplevert. Logisch, want het aantal kb’s is kleiner, dus is de pagina sneller binnen. Eigenlijk is dat al reden genoeg om het te doen, maar Google zegt ook dat…

Wat betekenen front-end optimalisaties nou eigenlijk?

Wat betekenen front-end optimalisaties nou eigenlijk? Ik doe een poging om aan de hand van cijfers te laten zien wat er in een browser gebeurt. En de resultaten zijn tof! In deze blogpost leg ik uit wat ik heb getest en wat de resultaten laten zien.

De perfecte score

Een uitgebreide uitleg over hoe je met je wordpress site een perfecte pagespeed-score kunt krijgen, en daarmee je SEO en vindbaarheid stukken verbetert. Ik ben aan het testen wat deze optimalisaties hebben betekent voor m'n site, daarover later meer.

Hoe optimaliseer je een responsive site?

Omdat steeds meer mensen op mobiele devices surfen wordt het maken van snelle sites steeds belangrijker. Zo belangrijk, dat je het inmiddels als een usp in offertes kunt gebruiken. Daarom staan in m’n offertes sinds kort een link naar deze pagina: Hoe optimaliseer ik voor een zo snel mogelijke…

De Staat van het Web is responsive

Om te laten zien dat De Staat van het Web responsive is heb ik een korte video gemaakt. Zoals je ziet past de site zich netjes aan aan de grootte van het scherm: Helaas ondersteunt Flickr nog geen HTML5 voor embedded video’s. Het origineel kun je hier bekijken:…

Over breakpoints en em’s

Iets waar ik vandaag achter kwam: als je em’s gebruikt voor je breakpoints worden die berekend adhv de standaard font-size van de browser (16 pixels volgens mij), en niet adhv de font-size van de body.

Sass niceheid!

Een paar jaar geleden ben ik gestopt met het bouwen in em’s, en ben teruggegaan naar het bouwen in pixels. Waarom? Em’s zijn over het algemeen een pain in the ass, en volgens mij hoef ik niet uit te leggen waarom. Daarnaast zoomden modererne browsers ipv dat ze alleen…

Goed voorbeeld van een slechte foto

“A warm welcome!” En dan een foto erbij van twee wetenschappers (inclusief veiligheidsbrillen) die net een t-rex hebben gekruist met fishzilla. De linker had liever nog giftige tanden toegevoegd, de rechter rekent zich in haar hoofd al multimiljonair. Fail!…

What should I make for dinner?

Balsamiq is software waarmee je snel en gemakkelijk wireframes kunt maken. Leuk en handig natuurlijk, maar wat staat er onderaan het help menu? Juist! Een prachtige manier om zelfs van een help-menu iets leuks te maken.

Een nieuwe site

Oud vs nieuw. Minder tekst, meer afbeeldingen. Sinds kort staat m’n nieuwe site live: sommige onderdelen zoals leesvoer en het blog zijn niet heel veel veranderd, de grootste verandering is de homepage en voor een heel groot gedeelte in de techniek. De homepage Het grootste verschil tussen de…

Design in 1024 bytes

Eerder deze week heb ik een inzending gemaakt voor CSS1K, een ‘wedstrijd’ waarbij je met een stylesheet van maximaal 1024 bytes de content (waar je niet aan mag komen) moet vormgeven. Erg leuk om eens uit te zoeken wat je allemaal met css3 kunt tegenwoordig. Een aanrader…

Gemakkelijk & gratis je boekhouding bijhouden in Google Docs

Versie 2 staat online!. Ik heb de uitleg verbeterd, er is een jaaroverzicht en je kunt facturen genereren. Foto door numberstumper Als beginnende freelancer wil je niet meteen veel geld kwijt zijn aan bijvoorbeeld je administratie. Maar gelukkig hoeft…

Gemeente Groningen, dit kan beter!

Met verbazing bekeek ik vandaag de nieuwe site van de Gemeente Groningen. Terwijl ik naar het ontwerp, de interactie en de html keek kon ik me maar 1 ding afvragen “hoe heeft dit kunnen gebeuren?” Daarom in de reeks “dit kan toch veel beter”, een redesign van de…

Verplichte velden in HTML5

Ik ben bezig om m’n site van xhtml om te zetten naar html5, en daarbij kwam ik het attribuut “required” tegen voor input velden. Dit zorgt er voor dat de browser de input van bezoekers gaat valideren, en hoef je dat zelf niet meer te doen. Het wordt…

K.I.S.S.

Kwam net deze post op techchrunch weer eens tegen: Keep It Simple Stupid. Kun je het gewoon niet mee oneens zijn..

Anja Mulder en Louis Reith in de Fotogalerie

Goede vriendin Anja Mulder heeft samen met Louis Reith van 8 t/m 29 oktober een foto-expositie in de fotoacademie in Groningen. De entree is gratis, en er hangen ook een aantal foto’s waarin ik model ben, dus schroomt niet en komt in groten getalen!…

Evolutie van een wizard

Mooi vind ik het, weer eens verrast worden. Zo had ik dat vandaag weer eens met het vormgeven van een wizard. Versie 1 Dit was de originele versie toen ik de site voor het eerst zag. Ik vond de vormgeving een beetje gedateerd, de stappen namen veel ruimte in, en…

Hey that’s Tup’s font!

Vriend Tup poste deze foto op z’n flickr: Met een linkje d’r bij naar z’n fonts op Dafont. En zoals Lijster al zei: ik had ook geen idee dat hij zo populair was met z’n fonts!…

Nieuwe homepage worldticketshop

7 juli is de nieuwe homepage van worldticketshop online gegaan. In de afgelopen paar maanden is er al heel veel verbeterd aan de site, maar op een gegeven moment kwamen we op het punt dat er toch echt een redesign van de homepage nodig was. Ik heb…

Maak je overlays duidelijker

Maak je overlays duidelijker door de dropshadow niet overal even breed te maken. Je overlay komt nóg meer naar voren als de dropshadow onderaan groter is dan boven. Op die manier lijkt de overlay meer boven de pagina te zweven (en is dus duidelijker herkenbaar als een overlay), en ziet…

The Psychologist’s View of UX Design op UX Magazine

Een goed artikel op UX Magazine over UX Design principles: The Psychologist’s View of UX Design. Het leek me slim om deze lijstjes eens te vertalen zodat ik echt begrijpend lees wat er precies staat. Dus hierbij: 1. Mensen willen niet meer doen of nadenken dan noodzakelijk is Mensen…

Woningnet, dit moet toch veel beter?

In de reeks “dit kan toch veel beter” kijk ik vandaag naar Woningnet.nl, dé site voor het aanbod van sociale huurwoningen. Maar de site is zo dramatisch slecht dat ik er maar “dit moet toch veel beter” van heb gemaakt. Maar goed. Hieronder heb ik een paar van m’n bevindingen…

Google & microformats search preview

Dit is handig! Op de Rich Snippets Testing Tool kun je kijken wat Google van de microformats, of “rich snippets” zoals zij het noemen, op je site vindt. En daarbij nog een aantal tips & tricks over het gebruik ervan. Om even een…

Het voordeel van een top 10

Heb je een lange lijst met links waar iemand uit moet kunnen kiezen? Maak er een top 10 lijstje van met een “meer” link naar een overzicht van alle opties. Met je top 10 bedien je veel bezoekers, en met de “meer” link kunnen bezoekers de overige opties gemakkelijk vinden.

iPhone schetspapier

Voor als je zelf of met anderen de interactie voor je nieuwe killer app wilt schetsen is er het iPhone schetspapier (A4, PDF).

Essent, dit kan toch beter?

Net -op net nippertje- de gas- en electriciteitsstanden doorgegeven aan Essent, en het is vreemd dat dat zo moeilijk moet gaan. Laat ik het even uitleggen. Via http://www.essent.nl/standen kun je je standen doorgeven. Daar moet je je opnamekenmerk en huisnummer invullen. Duidelijk, want op de opnamekaart staat je opnamekenmerk…

iDEAL betaling in wordpress bouwen

Onlangs heb ik voor Het idee van geld iDEAL in een wordpress blog gebouwd. Omdat het om een simpele betaling ging heb ik het donatiescript van iDEAL simulator gebruikt, en het nog een beetje aangepast. Technisch is het niet echt een uitdaging, maar hieronder toch even twee tips.

7 Praktische tips voor een snelle site

Onlangs heb ik “Even Faster Websites” gelezen, een boek geschreven door Steve Souders. In dat boek geeft hij verschillende tips voor het sneller maken van je website. Veel van die tips zijn vooral handig voor grote internetapplicaties, maar een aantal tips werken zelfs voor kleine websites (zoals deze).