Kirby Kosmos Episode 25

Originally published via email on July 6, 2018.

We are hitting a big Kirby 3 milestone today with the first private single-language beta for our supporters. We also started to answer questions about the new version on our blog and in our forum and invite you to contribute your questions.

Kirby Enhanced

Simplemap integrates Google Maps into the Panel, with features like localization, map styles, markers and more (free).
Mockmodule is a plugin for all Kirby users who use both the Modules and the Patterns plugins. It allows you to add static content for modules in the pattern lab (free).
The Kirby TOC plugin is an enhancement of the TOC plugin you probably know from the https://getkirby.com website with support for multiple heading levels (free).

Always test third party plugins thoroughly before using them in production!

Rachel Andrew on CSS Grid Level 2 subgrids, currently under specification, which will solve some of the problems of nested grids. She also published the slides of her talk Graduating to Grid on Notist.
Laura Kalbag wrote a short post about how CSS Gridhelped her to create a gallery grid on her photo blog.
How can we use CSS Grid in Internet Explorer? Daniel Tonon explores this question in a 3-part series of posts. Part 1: Debunking Common IE Grid Misconceptions and Part 2: CSS Grid and the New Autoprefixer have already been published.

With Yett you control the execution of (third party) scripts on your website. By putting it at the top of your website, you can intercept script calls to ask for consent from users before running analytics or other privacy related scripts, facilitating the implementation of GDPR compliance.

The new Kirby 3 Panel is based on Vue.js. So if you want to learn Vue to start creating extensions, the Vue guide is a really good starting point, and there are also a couple of great videos out there. The other day I came across the Vue Handbook by Flavio Copes which might also be a useful resource. Pay with your email address.
Lepto.js is a small image optimisation library for smaller websites.The Network Information API, currently only available in Chrome browsers, provides information about the user's network connection. Max Böck writes about how we can leverage this API to deliver content based on network performance.

In Don't Use the Placeholder Attribute, Eric Bailey sums up the issues related to this attribute and why it's better to drop it.
The Powermapper website contains a suite of A11y testing tools, including a list of HTML elements and their behavior in different screen readers.
Inclusive Design Principles are 7 short "rules" addressing the key factors to keep in mind when designing for people with different disabilities. The principles are available as posters you can put up in your office as an everyday reminder.
The Accessibility Inspector developer tool, available in Firefox browsers since version 61, reads the information provided by the browser accessibility APIs and visualizes the accessibility tree of your website.
Have you ever tried to surf the web with just a keyboard? If you haven't and want to get some insights from second hand experience, check out Chris Ashtons report about a day on the web without a mouse.

Steve Honeyman recreated a beautiful series of Blue Note record sleeves in HTML and CSS. If you are interested in the challenges and how he solved them, head over to his blog article.
Web Maker is an open-source frontend playground similar to CodePen or JSFiddle but works offline in your browser.
Ethan Marcotte writes about distinguishing ethical from non-ethical work and staying true to yourself.
Anselm Hannemann shares how to build businesses that last.
Let me finish this episode with something for the eye, a nicely made Visual Intro to Machine Learning.