Episode 42

Hope you all had a great start into 2020. We finished the last year with the release of Kirby 3.3.2 before the winter break, and are now picking up speed for 3.4, scheduled for some time in March.

1. Kirby Konf: Get your ticket now

Only 10 9 more weeks until our first Kirby "family gathering". Meet other Kirby developers & the team on March 21st, 2020 in Mainz, Germany. Book your ticket now (there are only 50), and if you want, you can also register for the warm-up event the night before. Tickets are free, but you can support the event with an amount of your choice! (Please, make sure to register even if you added yourself to the temporary Colloq page!)

Update 2019-01-20: All tickets were sold within two days, but the waiting list is still open.

Plans for 2020

A new year wouldn't be a new year without plans for the time ahead. So here are some cherry-picked plans and ideas we have for Kirby:

• More screencasts and videos
• A Kirby demo installation on our website
• A new Kirby Query Language API
• Live-Preview mode for the Panel
• An image editor for the Panel
• And more …

Our list is in fact much longer, some things are already under way, but like in our own lives, some ideas might never see the light of day, new ideas will pop up instead, so take this for what it is, join the discussion and stay tuned.

Kirby Workshop: Last call

The next Kirby Workshop with Bastian will take place in a few days, on January 22nd, 2020 as a side event of the New Adventures Conference in Nottingham. Get your ticket: (https://newadventuresconf.com/2020/workshops/kirby/)

Kirby in the wild

M10

Kirby tip of the month

Panel sections with a card layout can have 3 types of background: pattern, black and white. You can easily add custom background colors, though:

sections:
  pages:
    type: pages
    layout: cards
    image:
      query: page.images.findBy("name", "cover")
      cover: true
      ratio: 1/1
      back: rebeccapurple

Since Kirby adds this color to a data-back attribute, you can then add the following styles in a custom Panel style sheet without having to override one of the default backgrounds:

[data-back="rebeccapurple") span {
  background: rebeccapurple;
}

A similar approach will work for info sections or fields, if you prefer to have no background/border (a neutral theme will come in a future release) or use custom styles.

Kirby Cookbook

As promised in the last newsletter, we have a new Cookbook recipe: The power of placeholders extends last month's Kirby tip to get the most out of this technique.

Kirby plugins

The Redis Cache driver plugin adds support for Redis to Kirby.

The Focus plugin now comes with support for srcset and presets, making it much more versatile.

Always test third-party plugins thoroughly before using them in production.

Tools

Markup is a visual commenting platform (like Enqlo or Bugherd) that allows you to collect feedback from clients in real time. It has a free tier for individuals. Sign up with email is required for all users.

MassCode is an open source code snippet manager available for Mac, Windows and Linux.

Crater is an open source invoicing app targeted at small businesses. Web based with apps for Android and iOS.

Performance

Like every year, Smashing Magazine's Front-End Performance Checklist 2020 is out, with a list of things to consider right from the start of your project–from design decisions to server configurations–to make it as fast and accessible as possible.

Philip Walton explores how to leverage Service Workers to improve website performance.

Usability

How many products should be in a product list when the page loads? When are fewer products better than more and vice versa? A research article by Baymard Institute suggests that the ideal number depends on the type of product.

A11Y

Short bad code/good code comparison of an accessible yes/no poll. The site has other useful quick tips worth reading.

How to create an accessible progress bar with Vue.

Sarah L. Fossheim collected a list of design tools that help assess the accessibility of color schemes in a web project.

This & That

Dan Davies shows some examples of converting print layouts to CSS and explains the challenges he encountered on the way.

In his zero carbon notes, @vrde maintains a list of infrastructure providers that run their businesses on renewable energy.

Marcus Herrmann shares trials and errors on his way to finding an accessible menu pattern for accessible-app.com.

Bruce Lawson explains why to choose HTML5 <article> over <section>.

Last minute

If you're a Firefox user, make sure to update. They fixed a critical bug yesterday.