Blog

Here is my blog. If you like it, you may want to subscribe to my RSS feed.

Using Trello as a Super Simple CMS

Phil Hawskworth, CSS-Tricks, 2020

Transform

Gerry McGovern, Book, 2016

Anekdote

Anekdote is a directory celebrating great, independent businesses. These companies are not run by stockholders, layers of bureaucracy or an algorithm. They are full of …

An alphabet of accessibility issues

Anne Gibson, 2014

Website evaluation tools

Requirements How to evaluate requirements References Requirements # Any accessible website must use semantic-, standards-based HTML, apply accessibility best pratices (which is a wide field), and be fast. How to …

Six ways to make your site more accessible

Summary of a talk given by Hidde de Vries

Our last day of open air bathing in 2020?

It´s always a little bit sad when you feel the summer is slowly coming to an end. Emil and I are trying to stretch the time.

Indicating the focused element

Focus is important for keyboard navigation Do not disable the focus outline How to style the focus indication References Focus is important for keyboard navigation …

Back to Top

A Back to Top link helps users navigate to the top (start) of long pages. Behavior of a Back to Top link HTML to create the …

Swim Skills

Training videos for essential swim skills

My approach to accessibility

Through a post from Ethan Marcotte I got drawn into the accessibility topic. Web accessibility, like defined by the W3C, was not on my …

The High Line Park

arte.tv documentary

Better Web Typography

Online course about web typography by Matej Latin

Beautiful Webtype ★

Open-source font collection by Chad Mazzola

13 ways designers screw up client presentations ★

Mike Monteiro, Keynote for Interaction Design Association, Mar 2015

Damascus, USA. Der Gau.

arte documentary, 2016

How we read

A List Apart article by Jason Santa Maria, Aug 5, 2014

We are building a house

Our weed-covered land is starting to transform. This house project might take a time of nearly ten years in the end. We bought the property …

Weeknotes 29

Utopia is an algorithm to calculate fluid type size for responsive websites. It´s made by James Gilyead and Trys Mudford. There’s no program or dependency …

Learn eleventy from scratch

A piccalil.li course made by Andy Bell, 2020

Weeknotes 26

“The mystery font that took over Ney York” is an article about Choc, a typeface designed by Roger Excoffon. Choc specimen cover, 1955. Paul Robert Lloyd, independent …

Weeknotes 25

I published markdown-it-fitmedia, a markdown-it plugin to set aspect-ratio of responsive images, make images lazy loading, and to make videos responsive. Use it in the …

Open air bathing

Open air bathing is possible again (with some corona-constraints)

How economic inequality harms societies ★

TEDGlobal talk by Richard Wilkinson

German Corona App

I think it´s worth installing

Man conquers the cosmos

Mosaic by Fritz Eisel, 1972

How the JAMstack enables Canada´s largest food retailer

A talk by Justin Watts at JAMstack_conf_sf 2019

I am not your Negro ★

A documentary by Raoul Peck.

Bauhaus - Spuren nach 50 Jahren

Doku von Walter Rüdel, 1969

markdown-it-fitmedia

A markdown-it plugin to set aspect-ratio of responsive images, make them lazy loading, and to make videos responsive.

Weeknotes 22

Reading “The Details” by Matthias Ott. convertacolor.com is a minimalistic yet quick way of converting hex, rgb, hsl, and cmyk colors in any direction. I migrated my …

The Details

Blog post by Matthias Ott

Frauen, seid dankbar

Essay von Elisabeth Raether in Zeit Online

My favorite Yoga flows

Yoga Ganzkörper Flow | Bauch, Beine & Balance | 30 Minuten für Kraft & Stabilität Power Vinyasa Yoga für Kraft & Willensstärke | 25 Minuten Home …

The first ever website

Tim Berners-Lee´s home page

Fluid videos with my adaption of FitVids

Embedded videos are not automatically responsive or fluid. They come with a fixed setting for width and height. To make them responsive while keeping aspect …

The 10 Principles of Good Design

Dieter Rams The 10 Principles of Good Design as stated by Dieter Rams: Good design is innovative. The possibilities for innovation are not, by any means, exhausted. …

Weeknotes 18

This week I pushed my little website a step further by enhancing the service worker to pre-cache selected pages and by runtime-caching images as well …

Google Webfonts Helper ★

Mario Ranftl has written the Google Webfonts Helper, which makes self-hosting Google fonts as simple as it possibly can be. The service worker of my website …

Helvetica

A documentary film by Gary Hustwit

Helvetica Bonus Footage

A documentary film by Gary Hustwit

Weeknotes 17

I´ve created my first service worker and turned my website into a Progressive Web App 💪. After doing some precaching for static resources (JavaScript, CSS, …

Social distancing while protesting

Picture by Tomer Appelbaum, 2020

Going Offline (book) ★

A Book Apart by Jeremy Keith

Weeknotes 16

Emil draws “Ladybirds, fairy dust, and witches on witches broomsticks.” As of this week, Germany has 138,221 infected people and 4,098 people died on COVID-19. Four …

Going Offline (video) ★

A talk by Jeremy Keith

Less, but better – Rams ★

A documentary film by Gary Hustwit

Weeknotes 15

Emil discovers the luxury of whitespace. Kristian Lumme describes the collaborative approach of Fournova, who are the makers of Tower for Git. Article “How We Work.” Stretchy …

Newspaper designs during the pandemic

Some remarkable newspaper designs I got aware of via Twitter. Michael Bierut pointed me towards the handwritten front page designs of the New York Times. A …

Website accessibility got worse

Dave Rupert made me aware with his tweet: The average website accessibility got worse during the last twelve months! This is according to the WebAIM annual accessibility …

Weeknotes 14

Emil draws “Snakes with Poison Dots.” Max Böck published a boilerplate Emergency Website Kit, which, especially these days, aims to provide a quick way to publish …

Progressive Web Apps – Where Do I Begin?

An Event Apart talk by Aaron Gustafson

An RSS feed for GitHub Pages

RSS is a good thing. It simplifies to overview information that is produced by potentially many different sources. If someone has an RSS feed on …

Into the Personal-Website-Verse ★

A blog article by Matthias Ott

maldekstra 7

A magazine by Rosa Luxemburg Stiftung

Weeknotes 13

Write personal: “Into the Personal-Website-Verse” is a plea for personal websites from Matthias Ott. That gets a ★. “Advice from Ten Years of Leading Remote Teams” …

Weeknotes 12

Emil pictured the virus. I get the case counts from The Johns Hopkins Coronavirus Resource Center. At the end of this week we are counting 22.000 …

How to flatten the curve

A Washington Post article by Harry Stevens

This is a web page ★

A web page by Justin Jackson

The Birth of Inter

An article by Rasmus Andersson and Carmel DeAmicis

Weeknotes 11

This guy Jack McDade knows how to design a web page. Jack made Justin Jackson´s page, which I think is an exceptional piece of work. …

Thereabouts 3 – Discovering Colombia

Thereabouts 3: Discovering Colombia from CyclingTips on Vimeo.

Weeknotes 10

Watched “Thereabouts 3: Discovering Colombia” again. It´s the best of the series. I can recommend this film for anyone who is into cycling. Restarted my sports …

The Shape of Design

A book y Frank Chimero

It Doesn't Have to Be Crazy at Work

A book by Jason Fried and David Heinemeier Hansson

Weeknotes 9

Signed assange-helfen. A state has been caught in a war crime and for that reason the state takes revenge on the person who helped to …

active-toc

Highlight your TOC entries while scrolling.

Compose CSS

A composable CSS Toolkit to build fast, maintainable, and responsive websites.

stacked-area

Draw SVG stacked area diagrams with a day-based x-axis.

cumulative-flow

Draw SVG cumulative flow diagrams and predict the anticipated completion of work.

horiz-gauge

Draw a SVG horizontal gauge.

somap

A sorted map and a sorted set, implemented as a binary tree.

Breakdown for Atom

Display and manipulate a breakdown structure of your JIRA Scrum project – even offline and only eventually connected to your JIRA system.

dheader

Make the header of your web pages dynamic.

Splitting User Stories

A User Story can cover vast amounts of functionality with a single sentence, which requires a team many weeks or even months of work to get it done (often called epic). Splitting such stories into pieces which are valuable for users and still deliverable within a Sprint is challenging for many teams. However, there are good reasons why you should do it.

The balanced organization

The agile manifesto defines a collaboration culture. But what if your current environment is not collaborative? This article describes alternatives to move into the agile direction.

Tracker

File your workout routines and get a nice graphical overview of your achievements and improvements.

Pocket Git Guide

A short entry-level approach to Git

Spitfire

A virtual whiteboard to be shared by multiple people at the same time. Users will be anonymous – so no one needs to sign in.

Supersize

Do not let scaled agile be your scaled snake oil

Self-organization

A force of life

The agile worker

The agile worker exists because differences exist between theory and reality and because insights can be gained through these discrepancies.

The art in our work

The Agile Manifesto represents a force that is behind any particular agile procedure like XP, Scrum or Kanban. This force, the culture to challenge the status quo, attracts certain people and companies.

Five dysfunctions of a team

A non-performing team is not a team

Definition of Done

A contract to begin your agile journey with

Scrum and Architecture

Cooperatively making architectural decisions, at a point in time when they are needed – and not earlier – is a quality-improving paradigm in agile software development. Conceptual integrity in the flow of architecture decisions will only be achieved if one person has the final word regarding those decisions. This is the architect, serving the product, whose rights and obligations in the context of the Scrum process are being reflected in this essay.

The Box-Bullet-Line (BBL)

An intuitive and natural notation to communicate flows between components

A Sprint is not a milestone

A Sprint is a sensor that allows us to see what has been done, what impediments are in our way and how we did better in comparison to previous Sprints.