Learn CSS Deeply (WPMA)

20 meetup’ers kwamen luisteren naar Eva Brarens (GraphicsGrove) en Tom Hermans (tomhermans.com/). Én vragen stellen. Hier een verslag van de presentaties, met de slides en de vermelde links.

Talk #1: CSS Flexbox, Tom Hermans

Tom Hermans about flexbox
Tom Hermans showing off flexbox

Tom liet ons de mogelijkheden van Flexbox zien, inclusief dé langverwachte oplossing om met CSS verticaal te kunnen centreren! (jaja, dat kan dus blijkbaar al een hele tijd, ondertussen ook crossbrowser)

Hij gaf ook een aantal tips, waarop er nog extra tips van de groep bijkwamen. Hier de links:

Slides Mark Creeten (voor wie Tom vanavond inviel):

Slides Tom Hermans: https://codepen.io/tomhermans/pen/XwbVGo

Talk #2: Editorial design and CSS Grid, Eva Brarens

Eva showing some editorial design examples
Eva showing some editorial design examples

“Na 15 à 20 jaar is CSS volwassen aan het worden.” Yay!
We kunnen eindelijk op een betrouwbare en (bijna) crossbrowser manier pagina’s gaan layouten in CSS. Met Flexbox kan al heel veel, CSS Grid gaat verder. Vooral de combo blijkt sterk (flexbox in grid, grid in flexbox, flexbox in grid in grid, …)

Eva liet zien dat je ook niet per sé alles van CSS Grid moet kennen om ermee aan de slag te gaan. Ze begon haar talk met een kennismaking met editorial design; pagina’s waar inhoud en layout elkaar versterken, bv page spreads in magazines waar zowel beeld, inhoud als typografie op elkaar afgestemd zijn.

Online lijken veel websites en artikelen op elkaar. Eva toont ons hoe CSS Grid ingezet kan worden om editorial designs ook online te verwezenlijken. Ze gebruikte daarvoor zowel voorbeelden van creatieve online artikelen als eigen experimenten.

Eva haar slides vind je op https://docs.google.com/presentation/d/1clR4mr8G6CrSm82sViD9DCTCID_FtMjc0nJy6eFTCEk/, links naar haar CSS Grid voorbeelden vind je op https://graphicsgrove.com/thelab/#

Links naar de voorbeeldartikels (editorial design online toegepast):

+ extra links:

Dikke merci aan Eva & Tom, en ook iedereen die erbij was! Veel vragen, fijne babbels, we like it 😉

Next: 22/5 WordSesh (online én een viewing party in Mechelen), 3/6 WP Hasselt, 13/6 is de volgende meetup in Antwerpen en 20-22/6 WordCamp Europe in Berlijn.

Voor 13/6 zoeken we nog short talks (2min of meer), wil je iets delen/laten zien: stuur je idee in via https://wpbelgium.be/speakers/.

By Veerle Verbert

Working with WordPress since 2006 and I love the openness & power. I try to give back by helping as much as I can & co-organising the monthly WordPress Meetup Antwerp and the Antwerp WordCamps. Together with Werner, we work on custom themes & integrations in our tiny WP agency Con Impeto.

Leave a Reply

Your email address will not be published. Required fields are marked *