kiko.io Posts

I Love Bubbles

Sun, 19 Apr 2026 10:50:39 +0000

Any new way of interconnecting websites and users on the IndieWeb is not only welcome but also vital for a stable counterbalance to Big Tech’s shitty walled gardens. Yesterday I stumbled across a really good and new one, that integrates also the Fediverse: Bubbles from Ben.

We monitor thousands of independent, personal blogs via RSS. Every new post appears on Bubbles automatically. Nobody submits individual links.The blogs were hand-picked from various curated sources and individually reviewed.

There are currently around 5,000 blogs and I was surprised to find my own among them.

You can use Bubbles to jump into all new posts of these blogs freely, but if you log in to Bubbles using your own Fediverse account (Mastodon, Pixelfed or whatever federated platform you like), you are also able to vote or comment on posts or follow an entire blog.

This enables Bubbles to generate three views:

NEW - new posts
HOT - posts ranked by votes and freshness
TOP - post people are commenting currently

The commenting thing is particularly interesting because it uses automatically syndicated posts on GoToSocial under @bubbles@social.bubbles.town. Comments therefore do not end up in some dubious databases, but in the structures intended for this purpose by the ActivityPub protocol.

Anyone familiar with my website may know that I follow exactly the same approach for posts and photo comments, except that I manually set the syndication on Mastodon, Pixelfed or Vernissage. When loading a certain page, I use my Mentions United script to collect all comments on that post from the various platforms via its syndications and display them below the post.

Here, Bubbles syndicates automatically for me, and all I need now is to implement a GoToSocial plugin for Mentions United to show these syndications and the corresponding comments under the post too. Awesome … stay tuned.

More than that … Ben is providing a tiny script called vote.js to embed the given votes from Bubbles on a posts page. See Embed the Bubbles vote count

For more info about Bubbles, I recommend to read the detailed FAQ to learn more of this amazing project.

Versengold, Wiesbaden @ 2026-04-09

Sat, 11 Apr 2026 10:22:18 +0000

It was time to see Versengold again… and for the first time in my hometown of Wiesbaden. It’s great when it only takes a 10-minute bus ride to see your favorite band.

Earlier this year, the guys released their ninth studio album, and it rightfully climbed straight to the top of the German album charts. We’ve seen the band from the far north of Germany just as many times before… and this time they delivered by far their best show. On the one hand, it was really professional and varied (fire, confetti cannons, etc.), and on the other, you could really tell the guys were having fun with their music, and that energy transferred 100% to the audience. The crowd was jumping and bouncing, chanting in unison, “Versen”… “Gold,” “Versen”… “Gold”…

The band brought along Kupfergold as the opening act for the first time—a band whose music isn’t just similar to Versengold’s in name. They’re funny as hell and put on a fantastic show :D

Stickers

Sun, 05 Apr 2026 16:29:20 +0000

I’m 57 and currently hooked on stickers, and AI isn’t entirely innocent in this, combined with a bit of a guilty conscience - but it’s a lot of fun.

I recently “retired” my old business laptop after just two short years, with a battery life of 28 minutes after a full charge, and somehow I felt sorry, because the best thing about that otherwise junk of a Dell laptop was the lid with the stickers (see header image). Everything started with the “truck” in the middle, which ended up on my desk one day and seemed to be yelling, “Stick me on your laptop!”

A Brief Detour
This chubby, red guy with wheels instead of feet, known as Brummi, is a marketing mascot from 1971 that the German transport industry created to give road freight transport a new image. Every German of my generation knows him, and to this day he remains a symbolic figure for a wide variety of projects in the industry, where I’ve been working as an IT manager for a few years now.

Next came a few stickers from my favorite soccer club, SV Wehen-Wiesbaden, a few from fundraising campaigns, and some I still had lying around somewhere.

One day, I had the idea to turn one of my wife’s sayings into a sticker, because it’s so typical of the region she comes from (Sauerland, east of Dortmund) and it’s already become a running joke between us…

You can’t really translate this into English, because literally it would mean “Yeah, look” or “See,” but that doesn’t capture the essence of the saying at all. Imagine your wife or someone else telling you how to do something, but you do it differently at first, until you come around and have to admit that it works. Then you get the ironic version of “Ja kuck” But it’s always meant positively - to briefly comment on an action that produces something positive or interesting.

Now, I’m not artistically gifted, so I threw a quick prompt at ChatGPT, and it surprised me with a nice graphic, which I immediately uploaded to StickerApp to have nearly 80 4x4 cm stickers made. A few days later, it ended up on my laptop (and now also on various public signs and poles across Europe ;)

The next sticker that found its way onto the lid comes from a funny conversation about coworkers and other enemies, and translates to “It’s escalating anyway”. No matter what you do, trouble is bound to happen.

One evening, my wife came home from work and told me that she and her colleagues had been coming up with new perfume names all day long after one of them used the laminator and a strong plastic smell lingered in the air for a moment - something like “Lamination, a fragrance by Ralf Laurel”. My favorite creation was “Echauffage” (pronounced in French), the perfume you put on when you’re really pissed off 😂 Of course, with ChatGPT’s help, I had to put that on my laptop. In the meantime, the sticker has spread among my coworkers, and recently I was having trouble hiding my anger about something and was asked if I was wearing THAT perfume.

There are two types of people: Larks, who cheerfully jump out of bed early in the morning and go to bed early at night, and Owls, who you’re better off not talking to before 9 a.m. but who are fit and alert well into the night. I’m an Owl, and so that everyone knows right away, I had to turn this postcard saying into a sticker.

Germans love to make fun of their own language, which allows them to form wonderfully long words like “Donaudampfschiffartskapitänsmütze.” People who have only a limited grasp of English add to the fun by trying to translate such a German word one-to-one into English.

The biggest hit I’ve come across lately is “onewallfree,” the direct and hilariously incorrect translation of the German “einwandfrei,” meaning “flawless.” I just HAD to get that as a sticker…

I’ve since switched to the Swedish sticker printer PrettyGoodStickers, because they can produce even very small batches of 5 to 10 stickers for a low price and ship them to you. It’s perfect for all the silly ideas in my head - though I’ll eventually run out of space on my laptop lid.

IndieWeb Carnival: Museum Memories

Mon, 16 Mar 2026 18:17:38 +0000

It seems like fate that James chose Museum Memories as topic of this month’s Indieweb Carnival, because just recently, by chance, I visited one of the most impressive places from my childhood after more than 40 years: the Deutsches Museum in Munich. My wife and I had traveled to the Bavarian capital for a rock concert by the band Alter Bridge and actually planned to spend the rest of the weekend enjoying the city’s atmosphere, but as February in Germany sometimes goes, the weather was, to put it mildly, lousy, and my wife came up with the idea of going to the museum.

Deutsches Museum, Munich

deutsches-museum.de

Home

www.deutsches-museum.de

The idea for a purely technical museum had already been conceived in Munich as early as 1903, but after years of making do with make-shift solutions for the collection and exhibitions, it finally opened in 1925 on a small island in the Isar, following 20 years of construction.

I can’t remember exactly when it was, but like pretty much every child in West Germany in the 1970s, I too went on a school trip there at some point and caught the postwar German enthusiasm for technology. Huge halls with airplanes hanging from the ceiling, rows of old cars and trucks, and a complete submarine that you could crawl inside to experience the cramped quarters where soldiers had to spend weeks in the middle of the ocean.

The museum today is a different place, and I didn’t feel that sense of familiarity. The submarine is gone, and the much larger exhibition space is thoughtfully filled with both old and modern technology that showcases what humanity is capable of. But exploring the museum through the eyes of an older man is just as fascinating as it is for a young person. Meanwhile, the legendary museum in Munich has opened branches in Bonn, Nuremberg, and at the old Schleißheim Airfield, and I’ve made it a point to visit these as well in the near future.

Museum Lighting

No Trip Without a Museum

My wife and I travel because we want to leave our daily routine and familiar surroundings behind for a while and immerse ourselves in a different culture. And where better to do that than at a local heritage museum, historical museum, or open-air museum? That’s why no trip of ours is complete without a visit to a museum. Let others lie on the beach. On our last trip to Sweden, we visited four different and very distinct places to learn more about the country and its history: Royal Palace of Stockholm, Drottningholm Palace, Vasa Museum in Stockholm, Military Museum in Vaxholm and the open-air museum in Birka.

Birka Harbour

Yad Vashem, Jerusalem

In May 2019, I visited Israel with my wife and friends. Based at a wonderful apartment in Tel Aviv, which the equally wonderful Elie makes available to guests as a vacation home, we spent eight days trying to see and experience as much of the country as possible. In addition to a nighttime drive to Masada, 140 kilometers away, including a climb just before sunrise that absolutely pushed us to our physical limits, we also also had day trips to Jerusalem on our schedule. On the one hand, of course, to see the Old City with the Western Wall and the completely overcrowded Church of the Holy Sepulchre, but on the other hand also to visit what is arguably the most impressive museum in the world:

Yad Vashem - The World Holocaust Remembrance Center

Established in 1953 by an act of the Knesset (Israeli Parliament), Yad Vashem, the World Holocaust Remembrance Center, is entrusted with Holocaust commemoration, documentation, research and education: remembering the six million Jews murdered by the German Nazis and their collaborators; commemorating the destroyed Jewish communities, the ghetto and resistance fighters; and honoring the Righteous Among the Nations who risked their lives to rescue Jews during the Holocaust.

www.yadvashem.org

Every child in Germany is confronted with the Nazi era (1933-1945) in history class at school. As a result, I was familiar with the harrowing black-and-white images and films of concentration camps, transports in cattle cars, emaciated people, piles of corpses, and finally, German cities in ruins. Nothing a child wants to see, but must. The memory of what happened must be kept alive to try to prevent something like this from ever happening again. No institution in the world does this as effectively as Yad Vashem. Built in 1953 specifically for the purpose of remembrance, but also for research, documentation, and education, the museum shows visitors in many ways just how cruel human beings can be.

This museum leaves no one unmoved, but what struck me deeply in retrospect is the fact that my language and my familiar culture were visible in the pictures. Beautiful facades of German cities… with corpses lying in the streets in front of them. Beautiful German landscapes… with barbed wire, half-dead people, and the headline “Arbeit macht frei”. The culture of my ancestors was visible everywhere. MY damn culture! I felt shame because my people were the perpetrators. I felt anger because my people were the victims.

Judaism has been an integral part of German culture for centuries. And by that I don’t mean any religious rites or customs, which, as a self-proclaimed atheist, are foreign to me anyway. I mean the people themselves, their ideas, views, and dreams. Albert Einstein, Heinrich Heine, Felix Mendelssohn Bartholdy, Jacques Offenbach, Max Liebermann, Kurt Weill, Walter Rathenau, Ludwig Borchardt, and Paul Ehrlich are just a few famous names from the recent past who have shaped our country in their own way. Then there are the many, many others who have enriched the country culturally. How could anyone believe that their contribution was worthless and had to be eradicated? How could anyone believe that killing 6 million of their own countrymen would make the country better?

To me, culture is like fruit juice: a lot of apple juice, with some orange and peach juice, plus passion fruit, pear, cherry, pineapple, banana, grapefruit, strawberry, blueberry, with a splash of pomegranate and papaya, but also sour lemon and sweet grapes, and a whole lot more. A multitude of different ingredients that combine to create a unique flavor. How could anyone possibly believe they could remove a single flavor without spoiling the entire juice and making it inedible? How could anyone even dare to think such a thing!?

At the end of my tour of the museum, I was overcome by an indescribable sadness. I started to cry and felt a pressing need to ask the Israeli security guard at the exit for forgiveness for something I, as a child of ‘68, had absolutely no responsibility for. The collective guilt weighed heavily on me and still does to this day. That is why I always react with extreme aversion to any attempt to downplay the events of that time or dismiss them as a “minor blip in history.” To somehow defend the perpetrators of that era or even celebrate them as heroes — which currently seems to be in vogue in the U.S. and elsewhere — is nothing short of repulsive. All these people should be required to visit this museum in Jerusalem to understand the danger they are exposing humanity to.

Jad Vashem Vista

Alter Bridge & Deutsches Museum, Munich @ 2026-02-20

Sun, 01 Mar 2026 15:00:33 +0000

It’s not every day that one of our favourite bands tours Germany and brings along guests that we like just as much. We last saw Alter Bridge in Frankfurt 2016 and had never seen Daughtry before. So there was no question about whether we would go to Munich. Of course we would. And since the concert was on Friday evening, it was also the perfect opportunity to enjoy beautiful Munich for a weekend.

Zenith Concert Hall

🤘

Deutsches Museum

Enjoy Munich, my foot… It only rained once this weekend, but it rained from Friday morning until Sunday, when we packed up and headed home. February in Germany can be so dreary.

But since the hotel was booked and paid, we seized the opportunity and went to THE most famous technology museum in Germany: the Deutsches Museum. The last time I was there was when I was 16 or 17, and all I remember is this huge submarine, which must have been removed at some point in the last 40 years.

IndieWeb Carnival: Intersecting Interests

Thu, 26 Feb 2026 17:56:52 +0000

When I read about this month’s Indieweb Carnival topic (Intersecting Interests by Zachary Kai), I initially misunderstood ‘intersecting’ as interests that cross paths and thus get in the way, but what is meant is rather overlapping interests. As a non-native English speaker, I lack a feel for the nuances of the language. But basically, it doesn’t matter, because I knew immediately what I wanted to write about, and my interests actually include both aspects: contrary and complementary.

Photography: My old love

In the 1990s, after finishing school, I knew exactly what career I wanted to pursue: Photography. I sent out over 30 applications for an apprenticeship at photo studios throughout Germany and ultimately decided on one in nearby Frankfurt am Main. Big mistake. The boss was a pedantic hothead, and I’ve never been able to keep my mouth shut. So the adventure ended after only six months, and I switched to the comparatively boring profession of industrial clerk, came into contact with IT at technical college, and some time later was working as a freelancer in software development.

Software: My second love

I have been working in IT for over 30 years now, and what has interested me most from the very beginning are user interfaces, the presentation of a piece of software, starting with Microsoft Access, VB 6, VB.NET, C#, ASP.NET, and native web technologies, right through to various web frameworks. The visual component has always been very important to me, to the point of pedantry. Every pixel had to be in the right place. I have almost always developed interface structures based on a visual gut feeling rather than established patterns, because I trust my general understanding of shapes and colors for information transfer, which I acquired through photography.

At some point, my enthusiasm for photography returned, albeit not as intensely as in the beginning. With slightly more modern equipment (there’s always a lens you really must have), I limited myself to travel photos. Wherever I go in the world, I take my camera bag with me and try to keep the restrictions and waiting times for my wife to a minimum… “What is he photographing now?” … “Oh, nice photo.” It’s not unusual for me to bring back 1,500 or more photos from such a trip, which I then review and edit in Lightroom.

Complementary

I have been running this blog since 2019, initially to write about technical things that I wanted to remember myself. Over time, I have adapted the technology behind it, the SSG Hexo, to my own needs through additions, extensions, and workarounds, simply because it is incredibly fun to put web technologies into practice. I have also written about this, as my series A New Blog with now 36 posts shows. I enjoy having my own little corner of the internet where I can publish my thoughts.

In the first version, all pages still had the same header image, consisting of one of my favorite photos from a trip to Israel, until I thought to myself, ‘You have so many beautiful photos, use a different one for each page.’ For new posts, I created a pool from which an unused photo is automatically selected when generating the new post file (Markdown). The pool of photos grew rapidly, and I developed my own overview pages for these and previously used photos. I started publishing new photos according to the POSSE principle, first on the blog and then, with a reference, on classic photo portals such as Flickr, 500px, and later in the Fediverse on Pixelfed and Vernissage. For this purpose, each photo was given its own page with lots of details about the image that I could link to. I created separate photo posts, and for the images that couldn’t or shouldn’t be used as header images, I built a new section or overview called ‘Shed’. As of today, I host 1,243 photos on the website, which takes up 772 MB in the build, but that’s only because I’ve optimized a lot.

With kiko.io, I have successfully combined my two passions, web development and photography, and have also integrated writing into the mix. Programming, designing, photography, post-processing, writing, and publishing.

Contrary

Like all of us, I spend most of my time working toward other people’s goals. That’s fine, because it’s fulfilling and fundamental to my down-to-earth lifestyle. The time left over for my personal passions is therefore limited, and the chunks of time I can devote to them are rather small. Evenings, weekends, vacations. And sometimes, when work stress takes over again, I withdraw from my private productivity altogether and do nothing at all. On the one hand, this is relaxing, but on the other, I always feel a little guilty because I always have ideas and a correspondingly long to-do or wish list in all three areas (photography, programming, writing). I often make mental plans about what I can do next weekend, for example, only to realize on Sunday evening that none of it has come to reality because the couch was simply too attractive.

When I start something, like this text, I know that I’ll need a few days to finish it. During this time, I focus all my free time on it, which means that my other two passions and their to-do lists have to wait until I have time for them again. This happens to me particularly often when I’m programming. I spend days enthusiastically tinkering with a new feature for this blog, only to start on the next one straight away, and at the end of the month I realize I haven’t written a single post or even taken or edited a single photo.

Unfortunately, there are only 24 hours in a day, and at almost 58 years of age, I’m simply no longer able to get by on four hours of sleep. When I reflect on it, that’s okay, even if there’s always a little devil sitting on my shoulder whispering, ‘You can do more. More. It’s fun.’ Yes, it is, but the hobby-related dopamine rush isn’t worth sacrificing my health.

Stay calm and be patient.

I miss thinking hard

Wed, 18 Feb 2026 05:21:22 +0000

This text accurately reflects the main problem with AI: We are gradually losing our cognitive abilities, because we are ceasing to train our biggest muscle: the brain.

“Vibe coding” satisfies the Builder. It feels great to see to pass from idea to reality in a fraction of a time that would take otherwise. But it has drastically cut the times I need to came up with creative solutions for technical problems

#AI

I miss thinking hard.

www.jernesto.com

Teams Call and The Shining

Wed, 28 Jan 2026 00:00:00 +0000

We try to have as much fun as possible in the department, because everyday life is hard enough. A quick-witted and funny response not only immediately lights up conversations, it also helps to create a good working atmosphere in general. Laughter is medicine for everything.

I usually can’t write about funny business anecdotes in public, because on the one hand, it often requires context that I can’t provide, and on the other hand, it’s up to each person involved to decide whether something like that should be made public.

In this screenshot of a chat following a Teams call in which I and another colleague participated, whose first name also begins with K but who, unlike me, has not configured an avatar, I am making an exception because it is too good and only affects me:

Somehow, this picture reminds me of something.
…
Ah, I know.

🤣 Bull’s-eye! Where the hell is my axe …

IndieWeb Carnival: Meaning of Life

Fri, 16 Jan 2026 17:45:06 +0000

I don’t often participate in the IndieWeb Carnival. The last thing I contributed was in November 2024 with my post You will never know whose butterfly you were on the topic of “Impact.” Maybe I should do it more often, because it’s really exciting to read other people’s posts on the same topic. Different opinions offer new perspectives.

This month’s topic from Jeremiah really triggered me this time, and I’ve been thinking about it for days… The Meaning of Life … and here are my two cents on the matter.

What a topic, especially for a 57-year-old like me, who hardly has any days left where my body isn’t acting up somewhere and drawing attention to its gradual decline. To the young people out there: enjoy every day while it’s still not like that, because the day will come when the tide turns and you’ll ask yourselves, ‘how did I do that before?’

It is probably no coincidence that this question is often asked at an advanced age. By then, you have already come a long way, reflect on it, and wonder what else might come and why you do certain things in the first place. Not everyone has this ability to reflect, because it is closely related to doubt, and some of us are not capable of doubting, or only to a limited extent. This is often found in politics and executive floors. Or among psychopaths. Hmm… anyway.

Without doubt or reflection, the question of the true meaning, the deeper meaning of life, beyond profane things like money and power, does not arise at all. And when these thoughts do occur to such people, it is usually very late in life, and they realize the damage they have caused to those around them because of their lack of doubt.

What if the quest for the meaning of life must remain unsuccessful even for doubting people because it simply does not exist? What if life is… and I say this without any judgment… “meaningless”?

If the question of the meaning of life arises from doubt, one must ask whether doubt is something good and useful. In most cultures, it has negative connotations, and not without reason. Doubt can be paralyzing when it takes over, and from an evolutionary perspective, that has always been a bad idea.

I wish every day that I had the serenity not to get upset or distressed about things I can’t change anyway. In other words, to doubt less or even despair less, and to take occurrences as they come without wasting my energy wishing they were other than they are. To achieve this state is my ultimate goal. I often think of a short video I saw years ago of an Indian man who said in his beautiful accent something like:

Some days are fucked and cannot be unfucked … Go home, sleep and try again tomorrow

That is a healthy and desirable attitude toward life’s adversities. Without a doubt.

For me, the question about the meaning of life has another aspect that I can’t quite get my head around. It sounds like a goal that you can or should achieve. If I do this or that, then I’ll get a little closer to the meaning of my life? That contradicts my feeling. What’s more, this idea contains a close relative of meaning: Purpose. So you could also ask, “What is the purpose of my life?” and that feels depressing even as I write it.

The answer to the question “What is my goal in life?” is much easier to come up with. As I did in the paragraph above, this can usually be expressed clearly. The problem here, however, is that this definition of a goal can only be an expression of the present, because if one thing is certain, it is change, and that also affects goals that have once been set.

Some folks answer this question with something like “Being a good human being.” While this may seem timeless at first, even if you can’t be sure that you won’t turn into a dickhead in a few years, it generally comes with the problem of perspective. To whom am I a good person, who sees me that way, and are there people who judge my behavior completely different? An angel to one person, a devil to another. At first, you can only go by your own perspective, which is strongly influenced by the culture you live in.

I recently met up with a friend for a few drinks, and after the second or third glass of Guinness, we got onto the topic of religion. He is a trained and devout Catholic, and I have always been an atheist, also trained, but from a negative perspective. His approach is that his faith gives him structure, especially in matters over which he is powerless or which he cannot explain, à la “It is God’s will”. I, on the other hand, have no third person in my head to whom I can pass things on, but I have to accept them as well. The difference between my friend and me is therefore only that I have no projection surface, which does not always make my life easier, as I can well understand how comforting such a figure can be in difficult times. But just as I do not need answers from a God, I also do not need an answer to the question of the meaning of life.

The question itself has religious connotations for me to a certain extent. This can be seen, for example, in the enduring popularity of the pilgrimage to Santiago de Compostela, the Way of St. James. Its original destination is a prayer at the tomb of St. James, and since 830 AD, people from all parts of Europe have been walking there. The fact that so many people still undertake the weeks-long walk and the hardships involved, even today, when religiosity is on the decline, shows the real purpose of the journey: The journey itself. There are many reports of people setting off in pairs or threes, but eventually going their separate ways, not only because they have different walking speeds, but above all because people on the trail are preoccupied with themselves, their past, their future, their goals, desires, and fears. The brain begins to work, there are hardly any relevant distractions, and so you can find yourself. In the end, the actual geographical destination in northern Spain often plays only a minor role. The Camino itself, i.e., the path, and thus your own self, is the real goal.

Many words in these lines deal with movement and direction, and I think that is exactly what can and should replace the question of the meaning of life: What is my path in life? I am born and I am here. I start walking, make decisions that influence the direction of my path, and continue to do so until my strength wanes and I am no longer here.

It is our being that defines us, and nothing more. There is no deeper meaning behind it.

Our human ability to think about it and seek to understand it sometimes prevents us from making the next right decision for our current path.

#TIL | Display horizontal container initially scrolled to the right

Tue, 13 Jan 2026 00:00:00 +0000

On my /stats page, I used the wonderful web component activity-graph to implement an Activity Graph that displays my posts over the entire lifetime of my blog.

Now, as is common in Western cultures, the graph starts on the left side and is displayed horizontally. This means that the most recent and interesting entries are on the very right, and you have to scroll to the end to see them.

The question was how to make the graph display directly scrolled to the far right at the start, and the solution is quite simple and uses the component’s various HTML levels:

<div class="activity-graph-wrapper">
  <activity-graph>
    <figure>
      <table>
       ...
      </table>
    </figure>
  </activity-graph>
</div>

Using the CSS direction property, I first rotate the graph in the reading direction to RTL (right to left) at the top level, then rotate it back again at the next lower level. This means that the browser displays the graph starting on the right, but everything below has the usual western-style reading direction.

.activity-graph-wrapper figure {
  direction: rtl;
}
.activity-graph-wrapper figure table {
  direction: ltr;
}

#CSS #TIL

Remaining Photos from 2025

Sun, 11 Jan 2026 13:53:32 +0000

Every now and then, when my sweetheart and I go on a day trip in the region, I sling my camera over my shoulder in the hope of capturing a beautiful scene or two. Last year was no exception. Often, however, I don’t get around to reviewing and editing the photos, but I have now caught up on three events from 2025. Enjoy…

Roman Festival, Wiesbaden @ 2025-09-13

The history of my hometown Wiesbaden dates back to Roman times, when they used the hot springs for relaxation. The city organised a small festival in honour of the Romans in 2025, including a show with birds of prey. Whatever the birds had to do with the Romans, they were still the most interesting thing.

Opel Zoo, Kronberg @ 2025-06-21

A few kilometres away from our home, in Kronberg im Taunus, lies Opel Zoo, the second largest scientifically managed zoological garden in the Rhine-Main area. It was founded in 1956 by the grandson of car manufacturer Adam Opel and remains privately owned to this day. Every schoolchild in the area has to visit it at least once. In my case, however, it took nearly 57 years. The absolute star in the zoo was Kaja, the newborn baby elephant.

Knights’ Tournaments and Easter Market, Loreley @ 2025-04-20

Medieval markets are no longer as popular in Germany as they were 10 years ago, but the annual market held at the Loreley in spring still attracts thousands of visitors, perhaps due to the jousting tournaments that take place there.

New Approach on Sending Webmentions

Thu, 08 Jan 2026 17:20:22 +0000

Four years ago, I made this blog fit for IndieWeb. The most important part for me was the integration of Webmentions, which are mainly automated “pings” sent from one website to another, telling the latter: “Hey, I mentioned your post ABC in my post XYZ.” Such a connection between two blogs is certainly not the same as the fast interactions of the Fediverse platforms, which are more like email or chat, but are usually one-way and, unfortunately, still rather rare. But for me, they offer a healthy basis for networking my own digital home with others who think along similar lines.

In general, it seems that good old blogs, equipped with modern technology, are becoming fashionable again, because what the formerly hip Silicon Valley garage boys have done to the digital social world is simply incomprehensibly creepy and will probably get a lot worse with the advent of AI. And I’m not the only one who’s happy about the revival of the old blog days:

A Website To End All Websites | Henry From Online

How to win the war for the soul of the internet, and build the Web We Want.

henry.codes

The Case for Blogging in the Ruins

In 1751, Denis Diderot began publishing his Encyclopédie, a project that would eventually span 28 volumes and take more than two decades to complete. The French government banned it twice. The Catholic Church condemned it, Diderot's collaborators abandoned him, his publisher secretly censored entries behind his back, and he worked

www.joanwestenberg.com

My approach to sending Webmentions was based on a custom script for my static site generator called Hexo Console Webmention, which builds on the work of Remy Sharp.

In the meantime, a lot of water has flowed down the Rhine (as we say in my home region) and the possibilities have become more diverse. Generally, what always bothered me about the script was, that it could only run after the build & deployment and, in addition, the entire artifact, including all NPM packages, had to be loaded again as the last step in my GitHub Action (the blog lives on GitHub Pages). Not only was this time-consuming, it also wasn’t really resource-efficient.

Robb Knight launched EchoFeed in 2024, which is essentially the counterpart to Webmention.io, which, of course, collects Webmentions. Robb’s sending mechanism relies on RSS, Atom, or JSON feeds as data sources, at least one of which every blogger should offer on their own site. These are linked in the app to “services” such as Webmentions, Mastodon, Bluesky, and others to create so-called Echos. These Echos pull the feed data from the server every 15 minutes as standard and use templates to turn it into posts … or Webmentions.

A fantastic way for me to clean up some of the blog code, even if I have one more dependency now, but seriously… who cares if a webmention arrives late or not at all?

ChartsCSS - Without a single line of JavaScript

Tue, 06 Jan 2026 15:47:37 +0000

I’ve known for a while that I want to add a statistics page to my blog. Just for the fun of tinkering with code, without any deeper reason. In the summer, I wrote down my ideas on a few Obsidian pages and looked around to see what options were available for data visualization. It’s nicer and more intuitive to display some of the statistics as bars and pies than just in boring numerical columns. I’m more of a visual person… “Everything is so colorful here.”

One research find stood out from the crowd of the usual JavaScript tools: ChartsCSS by Rami Yushuvaev and Lana Gordiievska. It promised to bring classic number visualizations such as bar and pie charts to a web page without a single line of script, but exclusively with CSS styles!

I took advantage of a few days off at the end of the year to tackle my statistics, including Rami’s CSS framework, which is already five years old… and what can I say? It’s really impressive how cleverly he uses common style methods to turn HTML tables (! … read: correctly) into colorful charts that can be easily customized with your own styles without having to fiddle around with the mere 59KB charts.min.css file. I just wanted a bar chart, so I only peeked at the code for the pie charts, but I didn’t really figure out how Rami turns rectangular table cells into pie slices!?

In addition to these five available chart types, according to the website, three more are planned: Radial, Polar, and Radar, but they are not really getting off the ground, as the project seems to have stalled a bit. Rami released the current version 1.20 six months ago, and the previous one dates back to 2023. But that doesn’t matter much, because what’s there is excellent. The same goes for the documentation at chartscss.org/docs, which leaves hardly any questions unanswered thanks to its many examples.

Conclusion

If you’re struggling with JavaScript but have a reasonable understanding of HTML and CSS, you can achieve very impressive results with ChartsCSS. In most cases, that’s all it takes.

Here’s an example… /stats

Unexpected Visitor

Fri, 02 Jan 2026 00:00:00 +0000

Today, we had a visit from an animal that is quite rare in a city, a Gray Heron, which probably needed to inspect our neighbour’s little fish pond with the Kois. What a beauty …

Farewell 2025

Thu, 01 Jan 2026 00:00:00 +0000

I ‘ve found 2025 to be a particularly difficult and challenging year, quite apart from the political madness that is unfolding in so many parts of the world and which cannot leave a political person like me unaffected. No, even on a personal level, I will not forget this past year. Starting with my return from an absolutely amazing holiday in South Africa and two other wonderful breaks in Portugal and Sweden, the year has mainly shown me my physical limits. Yes, 57 is no longer mid-20s, and some decisions and habits in my life are now taking their toll, along with a few others that I hadn’t on the list.. and I’m struggling with that physically and mentally. Getting older is not for wimps…

My wish for 2026 is to achieve the serenity that allows me not to get upset about things I cannot change anyway, and to simply tackle those things that I can influence and shape.

App Defaults 2025

Fri, 19 Dec 2025 12:05:42 +0000

While preparing this new AppDefaults post for the passing year 2025, I took a look back at the two previous posts from 2023 and 2024 and find it exciting to see how my behavior has gradually changed over time.

A slight shift away from the tools offered by large American companies towards small European alternatives or OSS, which is likely to intensify in the future. I also have less and less patience with software that is going down the path of enshittification. I don’t care how long I’ve been using it or how much work is needed to make the switch; it just has to go, even if it hurts, like Plex. I’m not going to be taken for a ride … just die.

Mail:
Proton Mail, Gmail
Tasks:
Obsidian, Business Calendar 2
Contacts:
Google Contacts
Photo Shooting:
Nikon D500, Google Pixel 9a
Photo Editing / Management:
Adobe Lightroom Classic
RSS:
kiko.io’s Blogroll, Feedly
News:
Flipboard, Google News, Feedly
Browser:
Vivaldi, Google Chrome, Microsoft Edge
Chat:
Signal
Bookmarks:
Obsidian, kiko.io’s Tiny Tools
Read It Later:
Obsidian, Google Chrome (Android)
Word Processing:
M365 (used twice in 2025 and can actually be removed)
Spreadsheets:
M365 (same)
Presentations:
M365 (same)
Music:
BlackPlayer
Media:
Jellyfin
Passwords:
KeePass, 2FAS Auth
Code Editor
Visual Studio Code, Visual Studio
Source Control
GitHub, OneDrive
Shopping Lists:
Google Keep, Obsidian
Meal Planning:
Leni - Stillllll … ultimate version of wife

Changes

One example of the slow shift away from American services is my new Proton Mail account under one of my own domains, kristofz.me. After 20 years of using Gmail, I no longer enter my old, familiar email address when registering for new accounts, but rather the new one, even though I am still a fan of Gmail in terms of comfort. However, the Swiss company Proton has opened security doors for me that I never thought I would need. Don’t be evil … Okay, but a little diversification is needed these days.

I’m increasingly opening websites in the Vivaldi browser, which is already installed on all my devices, even though I find all the bells and whistles a bit too much. Jón von Tetzchner is right to keep the European perspective and data protection in mind, whereas with Google Chrome, we know full well that this is a foreign concept to them.

When I tinker with software in my spare time, I do so 99% of the time in VS Code. I have completely stopped trying to work with online versions such as github.dev, as I mainly need such solutions on my smartphone and they simply don’t work there.

What I have completely stopped using this year is Trello, as Obsidian now provides me with everything I need. Another thing that has disappeared into oblivion for me is Plex, once the best media solution, but now just one thing: crap. I now use Jellyfin instead.

Looking ahead …

I am thoroughly exploring the possibilities of self-hosting, albeit with regard to VPS services and not at home. This blog lives on GitHub Pages and is automatically built once a day via GitHub Actions to update the blogroll. I would like to separate this into a serverless solution so that I can host the code on my own Forgejo instance and simplify deployment via FTP when something substantial has changed. Elena Rossini contributed to these considerations with her YunoHost posts.

The Long Farewell to Stylus

Sun, 30 Nov 2025 17:36:32 +0000

Since I decided in 2019 to use the static site generator (SSG) Hexo as the foundation for my blog, I have been struggling with the fact that it works with the CSS preprocessor Stylus via a pre-installed plugin. I thought I just needed some time to get used to the simplified but unfamiliar notation and take advantage of features such as functions, mixins, variables, and the like. Over time, however, the functionality of native CSS grew to such an extent that I started to implement workarounds for new and unsupported features in my Stylus code, which made it significantly more complex and confusing. I didn’t get used to it, but instead just got annoyed by Stylus for quite some time.

I kept putting off the decision to leave Stylus behind and switch to native CSS because, after five years of tinkering around, it meant a lot of legwork, but I just started at some point and proceeded in small steps. The initial goal was to convert the Stylus code 1:1 to native CSS and clean up errors that had accumulated over the last few years, so that I would then have the opportunity to revamp the structure with modern CSS.

I thought for a second about whether I should just use the style.css file that the Hexo plugin hexo-renderer-stylus generates from the dozens of separate styl files during the build, but it didn’t make sense to start at the top and then break down the more than 7,000 lines into individual chunks and restructure them. You don’t renovate by first exploding a bucket of paint in the room, but by choosing a corner and doing it work-by-work.

1. Variables

The file _variables.styl contains what it promises: variables. And those should be the first to be removed, because native CSS variables (or custom properties) were already introduced by the W3C in 2022 and offer great flexibility, making workarounds from preprocessors unnecessary.
Here’s an example from my previous code:

_variables.styl
color-link = #000
color-hover-link = #555

dark-color-link = #fff
dark-color-hover-link = #bbb

These 4 variables were used to set the color of a link depending on which theme the user selected on the site (‘light’ is default), which is reflected in the data-theme attribute of the html element, which is then used as a selector in the styles:

page.styl
a
  color: color-link
  /[data-theme="dark"] &
    color: dark-color-link
  &:hover
    color: color-hover-link
    /[data-theme="dark"] &
      color: dark-color-hover-link

Stylus has generated the following code from the build so far:

a {
  color: #000;
}

[data-theme="dark"] a {
  color: #fff;
}

a:hover {
  color: #555;
}

[data-theme="dark"] a:hover {
  color: #bbb;
}

I have now converted all stylus variables one by one into native variables in a new CSS file and replaced them in all styl files with their new equivalent var(--variable-name). The example from above now looks like this:

main.css
:root {
  --color-link: #000;
  --color-hover-link: #555;
}
:root[data-theme="dark"] { 
  --color-link: #fff;
  --color-hover-link: #bbb;
}

page.styl
a
  color: var(--color-link)
  &:hover
    color: var(--color-hover-link)

… and as a result, the generated CSS is two statements shorter.

In this step, I took the opportunity to slim down the number of variables, which had grown absurdly over the years, and to standardize styles. I was also able to remove all /[data-theme="dark"] & rules, as the color is now set based on the theme created when defining the native CSS variable.

The last remaining stylus variables after this process are a few stylus-specific ones (see section 2) and my own media queries (such as mq-mobile = "screen and (max-width: 479px)"), which I unfortunately could not transform into CSS variables because CSS rules are not linked to HTML elements, but have a global scope, as Ben Holmes explains in his post Want CSS variables in media query declarations? Try this!. But more on that later on …

2. Grid, Mixins and nib

The standard Hexo theme ‘Landscape’ has a four-part layout: header and footer, as well as main and aside (sidebar), which are combined into content (div#content.outer). While the first two always extend across the entire page width, the other two share the horizontal space via a fluid “grid” system with percentages calculated during the build. The system is highly customizable in the standards, depending on whether and where you would like to have the sidebar, but I have decided to go with my layout and therefore do not need all the configuration stuff.

Of course, such a layout would be implemented differently in 2025, but that wasn’t the task at this stage. I just had to get rid of all variables and functions that were defined or used in multiple files. The starting point was _variables.styl and its variable sidebar, which got its value from the Hexo theme’s _config.yml. Following this thread, I deleted countless values, functions, and references, as can be seen in GitHub commit #1a24503 (Removed Stylus Gridsystem). I simply replaced the whole thing with fixed values, merged the necessary files, and was then able to delete the _grid.styl and all unnecessary sidebar-*.styl files. This is what remained:

style.styl
.outer
  max-width: 1220px

main
  @media mq-normal
    display: inline
    float: left
    width: 73%
    margin: 0 1%
    
#sidebar
  @media mq-normal
    display: inline
    float: left
    width: 23%
    margin: 0 1%

Getting rid of the _mixin.styl file was pretty straightforward, as it basically just contains a few functions that place CSS code where it is used.

That just left the following two variables:

support-for-ie = false
vendor-prefixes = webkit moz ms official

After some trial and error, I discovered that these belong to the nib CSS3 extensions for Stylus, a library that is installed with the Stylus renderer plugin. It has a few useful functions for Stylus users, such as global-reset() and clear-fix(), which Hexo makes use of. However, it is also responsible for adding vendor-specific declarations such as -moz-box-shadow and the like to the output CSS, which will be completely out of date by 2025. After adopting the declarations of the above functions and deleting the @import "nib" statement, these two variables could also be removed.

CSS File Structure & Bundling

After migrating some of the Stylus code to the new main.css in steps 1 and 2, it was time to structure the declarations into separate files. The variables in defaults.css, all resets in reset.css and, since it was a quick win, all font styles in fonts.css. All these files now had to be merged back automatically while building into main.css and minified.

I didn’t need a super-duper bundling library for this, because, on the one hand, you should be thrifty with dependencies and, on the other hand, Hexo offered me everything I needed to concatenate a few files in the right order with Hexo’s Generators concept, which I was already familiar with. I also use the hexo-browsersync plugin for live reloading while coding, which ensures that all generators run once after saving a file.

My CSS bundle generator is very similar in its principle to the hexo-css-merge plugin, from which I got the idea to use clean-css for compression, but it largely omits configurability and is somewhat shorter:

_config-yaml
css_bundle:
  target: main
  files_in_order:
    - defaults
    - fonts
    - reset

generator-css-bundle.js
const fs = require('hexo-fs');
const path = require('path');
const cleanCSS = require('clean-css');

hexo.extend.generator.register('css-bundle', function () {
  const config = this.config;
  const bundle = config.css_bundle;

  let result = [];
  
  let files = bundle.files_in_order.map(file => {
    return path.join("themes", config.theme, config.source_dir, "css", `${file}.css`);
  });

  let styles = "";
  files.forEach(file => {
    styles += fs.readFileSync(file);
  });

  result.push({
    path: `/css/${bundle.target}.css`,
    data: styles
  });

  let clean = new cleanCSS().minify(styles);

  result.push({
    path: `/css/${bundle.target}.min.css`,
    data: clean.styles
  });

  return result;
});

Conclusion after the first steps

It’s fun to throw out things you never needed anyway. Hexo’s theming capabilities per se are still impressive even today, but people like me quickly start tinkering around, so that a simple theme change is no longer possible after a few weeks, but also no longer desirable. However, it makes the switch from the built-in Stylus preprocessor to native CSS more complex and time-consuming.

I still have a lot of work to do until I can finally start to modernise the layout technically based on plain CSS. The JavaScript-based scroll header solution in particular has been bothering me for a while now, but I’ve already built a CSS-based prototype, for which I need to change the HTML structure, and that’s hardly possible with Stylus and all the hacks in the way.

In the meantime, my blog consists of two stylesheets: the new main.min.css and the old style.css from Stylus, but gradually one is getting bigger and the other smaller.

The rebuild continues. Stay tuned…

StreetComplete - Contribution while passing by

Thu, 27 Nov 2025 17:34:15 +0000

I have been working with OpenStreetMap for a while now from the developers’ perspective, who can use it to conjure up attractive maps, such as my Photo Map, on the web free of charge. However, I am not part of the community, nor have I given much thought to where all the data comes from and how it finds its way into the maps. Until recently… when I stumbled across an app review of StreetComplete by chance and installed the Android app (iOS is planned) out of curiosity.

This app finds missing map data in your vicinity and displays it on a map as quests. Solve each quest by visiting the location on-site and answering a simple question to update the map.

--- streetcomplete.app

A map, i.e., a genuine alternative to the all-powerful Google Maps, thrives not only on topographical features, but also on specific details that offer users added value but are much more time-consuming to capture. That’s probably what Tobias Zwick from Hamburg thought when he wrote the first lines of code for this OpenStreetMap editor back in 2017.

The app is not only easy to use, but also has a clever design: it gamifies the recording of map details using a map of the current environment and awards points for answering easy-to-understand questions, which are then entered into a multi-level ranking. There is also a team mode where you can team up with several friends to hunt for points by dividing up tasks.

Instead of silly Pokemon hunting, this wonderful app lets you make open maps accessible to everyone more detailed during a long walk or even in between other activities. I love it and just wish I had discovered it sooner, as I’m currently only ranked 3,255th in Germany.

StreetComplete - Apps on Google Play

OpenStreetMap surveyor app

play.google.com

REP: Embedding Bandcamp Tracks

Sun, 16 Nov 2025 15:59:50 +0000

Recently, I was greatly inspired by Roma Komarov to add another, audible layer to my blog posts…

At the beginning of the month, I complained to myself in my post Stoned Jesus, Bandcamp and the Necessity of Music that I hardly listen to music anymore, even though it seems to help me in stressful times. Just as I (re)discovered Bandcamp and my credit card was hit hard for various great albums, Roma came up with the following post:

Embedding Bandcamp Tracks

A long time ago, back in LiveJournal, sometimes people embedded various music players in their posts. It was fun! I already had a 'Current music' field added to most of my posts, but now I also added a way to enrich this field by adding an optional Bandcamp track reference, and spent my evening updating existing posts in the blog to have it.

blog.kizu.dev

Well, if that isn’t fate…

I especially like his approach with the detail element, which only pulls the source of the iframe from the network when you open it. Nothing complicated, just pretty straightforward.

From the beginning, I had a small icon of a musical note at the top of the post in mind, accompanied by the artist and track name, so that you know what’s coming. Unfortunately, it’s still a bit difficult to replace the marker of the detail element with an icon in SVG form, but at least you can make it disappear.

Here is the HTML of my EJS partial responsible for the visualization:

 <details class="bandcamp">
  <summary>
    <em><%= artist %> - <%= track.name; %></em>
    <svg class="icon-music-note-accent">
      <use xlink:href="/images/icons/music-note-accent.svg#note"></use>
    </svg>
  </summary>
  <iframe src="https://bandcamp.com/EmbeddedPlayer/album=<%= album.id %>/size=small/bgcol=ffffff/linkcol=333333/track=<%= track.id %>/transparent=true/" 
          width="100%" height="42px" 
          load="lazy" seamless>
  </iframe>
</details>

This is controlled when the page is created via Frontmatter entries of the respective article … for example this one:

bandcamp:
  artist: Lowdrive
  album: Rise|2549803014
  track: Blood Sacrifice|897654312

(Yes, I know… Pipe-separated strings in Frontmatter are ugly, but easier to keep track of)

I don’t know how Roma gets the necessary values for his songs, but the only way to extract the album and track IDs from the Bandcamp UI at the moment is via the link “Share/Embed”, the opening dialogs, the “Embed Code” field, and an external editor, since the field is only an input and not a textarea that could be enlarged :|
A little annoying, but bearable, because at least I don’t write my posts on the fly and therefore take the time to pick out the data.

What’s left now is the CSS (here in Stylus format), which I’m still tinkering with because I’m not entirely satisfied with it yet. The details element is really quite special…

details.bandcamp
  --bc-margin: 0.5rem
  --bc-padding: 1.5rem
  width: calc(100% - calc(var(--bc-margin) * 2))
  margin-block: var(--bc-margin) 0
  margin-inline: var(--bc-margin)
  display: grid
  justify-items: end
  &::marker
    display:none
    content: ""
  summary
    list-style: none
    padding: 0
    em
      display: inline-block
      margin-right: calc(var(--bc-padding) / 2)
      font-variant: all-small-caps
      color: var(--color-accent-text)
      transition: all ease-out 0.2s
    svg
      width: var(--bc-padding)
      height: var(--bc-padding)
      float: right
      transition: all ease-out 0.2s
  &[open]
    summary
      em
        opacity: 0.333
    svg
      transform: rotate(-20deg)

Update: Theme Switching

~~What I still need to do is make the theme change look good, because the colors of the Bandcamp player are coded in the iframe URL…~~

The URL parameters for the embedded Bandcamp player contain information about the background and link colors, and the values appear to be HEX colors, but they are not; rather, they are keys to the predefined colors in Bandcamp’s Customize dialog. It’s a shame, because this means I can’t use the page-specific accent colors for my pages. The only thing left is Light and Dark, along with the selected theme, and some JavaScript to set the player URL when the page is first opened and when the theme is switched.

Resetting the iframe URL via the src attribute is not a good idea, because (for whatever reason) this affects the browser history of the entire page and means that the user has to press the BACK button as many times as the player has been reset in order to return to the previous page in the blog. Annoying.

One option is to replace the entire iframe element each time, but another, simpler option is to use contentWindow.location of the iframe element, which does not exhibit the history behavior.

All wrapped up in a small JavaScript function and garnished with a MutationObserver that responds to the theme change at this point, the following addition to the EJS code results:

<script>
  function setThemeBandcampPlayer() {
    let bgColor = "ffffff";
    let lnkColor = "333333";
    let theme = document.documentElement.getAttribute("data-theme");
    if (theme === "dark") { bgColor = "333333"; lnkColor = "ffffff"; } 

    let bcPlayerUri = `\
  https://bandcamp.com/EmbeddedPlayer/\
  album=<%= album.id %>/\
  size=small/\
  bgcol=${bgColor}/\
  linkcol=${lnkColor}/\
  track=<%= track.id %>/\
  transparent=true/\
  `;

    document.getElementById("bandcamp-player").contentWindow.location.replace(bcPlayerUri)
  }

  // Startup
  setThemeBandcampPlayer(); 

  // Theme Switch
  new MutationObserver(m => { 
      setThemeBandcampPlayer(); 
    }).observe(document.documentElement, {
      attributes: true, attributeFilter: ["data-theme"], attributeOldValue: true
    });
</script>

Conclusion

Thanks Roma for the impetus for this fun little feature for my readers… at least if they like rock music ;)

… he writes as the guitar riff kicks in massively and he raises the devil’s horn towards the sky

European Perspectives

Mon, 10 Nov 2025 16:15:08 +0000

Earlier this year, my sweetie and I made a little trip to nearby Strasbourg. Not only because I really like the city and its French flair (she has never been there before), but also because I had never set foot in the European Parliament (EP) before. The people there have a big influence on our lives with their institutions and regulations, which eventually find their way into German law. As a committed European, you simply have to see it for yourself. And we live just 2.5 hours or 230 kilometers away.

The institution is very open. Guests are always welcome, even though tickets must be booked online in advance due to the large number of visitors. We were fortunate that on that day, the EP had invited young people from all over Europe to discuss issues important to them in the plenary chamber.

The building, which dates back to 1999, is impressive and beautifully located directly on a tributary of the Îll River, which winds its way through Strasbourg. It’s wonderful to take a leisurely walk around the complex and feed the ducks on the river, as long as you have some stale bread with you.