Vanessa Otto
banner
vannsl.bsky.social
Vanessa Otto
@vannsl.bsky.social
Staff Frontend Engineer - GitLab, Public speaker, Podcast Co-Host Working Draft, Podcast Host expect(Exception), prev. Head of Frontend - Zavvy by Deel
Just took the #StateOfCSS 2025 survey and was asked to share it with more women in tech.

If you’re a woman or identify as one and work with CSS, please take part!
👉 survey.devographics.com/survey/state...
State of CSS 2025
Take the State of CSS survey
survey.devographics.com
June 17, 2025 at 2:51 PM
Building a modern text editor today is wild: JSON, Notion-style UX, AI integration, collab, Markdown, Vue support... the list goes on.

I wrote a post on how I approached this:
blog.vannsl.io/blog/designi...

@tiptap.dev came out on top after comparing CKEditor, Slate, Quill & more.

Part 1 of 4 🔧
Designing the Next-Gen Rich Text Editor: Requirements, Challenges, and a Developer-First Approach
Defining what a modern, extensible rich text editor should offer from backend-compatible output to a Notion-like UX and developer-first features.
blog.vannsl.io
May 29, 2025 at 11:13 AM
Another Monday, another article: "The Surprisingly Weird World of Favicons"

blog.vannsl.io/blog/the-sur...

What seems like a simple browser icon turns out to be a surprisingly complex topic - with quirks, outdated formats, and platform-specific behavior that developers still wrestle with today.
The Surprisingly Weird World of Favicons (And How to Survive It)
A practical guide to implementing favicons in 2025, covering modern formats like SVG, the role of web manifests, dark mode support, and cross-browser quirks.
blog.vannsl.io
April 14, 2025 at 6:04 PM
Reposted by Vanessa Otto
Circumstances have conspired to make me build and release a flexible web component to toggle dark/light mode:

📦 www.npmjs.com/package/@sir...
💾 github.com/SirPepe/dark...

#webdev #webcomponents
@sirpepe/dark-mode-toggle
A web component for switching between light and dark modes. Latest version: 0.1.1, last published: 3 hours ago. Start using @sirpepe/dark-mode-toggle in your project by running `npm i @sirpepe/dark-mo...
www.npmjs.com
April 9, 2025 at 2:02 PM
SVG Favicons can be made adaptive to use different colors in dark mode. This works in Firefox. It should work in Chrome... but does not anymore? I couldn't find out why. Any idea - maybe @nerdy.dev ?
April 10, 2025 at 6:36 AM
Reposted by Vanessa Otto
Peters Plädoyer im bald erscheinenden nächsten Teil unserer Besprechung zum "State of JS 2024": Lasst uns den Hype um Meta-Frameworks beenden! Kompetenz und kluge Entscheidungen sind hier der wahre Schlüssel, nicht die gewählten Tools.
April 7, 2025 at 3:32 PM
Reposted by Vanessa Otto
🎙️ Revision 653: State of JS 2024 – Teil 1

In dieser Episode von Working Draft diskutieren wir unter anderem die Notwendigkeit von Lodash im modernen Webentwicklungsprozess.

workingdraft.de/653/
March 28, 2025 at 8:48 AM
Reposted by Vanessa Otto
In unserer neusten Episode geht es unter anderem um die Herausforderungen des asynchronen Programmierens. Gerade für Entwickler:innen, die nicht mit Promises vertraut sind, ergeben sich hier oft Verständnislücken. Mit den entsprechenden Konsequenzen.

🎧 workingdraft.de/655/
April 1, 2025 at 9:47 AM
🖼️ Tired of reading "Serve images in next-gen formats" in Google Lighthouse? I published a new blog post on how to use modern image formats like WebP & AVIF with JPG/PNG fallbacks in HTML/CSS.

📉 It also covers how to convert images with tools like ffmpeg and Sharp.

📖 blog.vannsl.io/blog/modern-...
Modern Image Formats on the Web: WebP and AVIF Without the Headache
Learn how to easily implement modern image formats like WebP and AVIF on your website using HTML, CSS, and tools like ffmpeg and Sharp for image conversion.
blog.vannsl.io
April 7, 2025 at 2:45 PM
I recently wrote about my experience building a tech blog during parental leave: Between Diapers and Development – How My Blog Came to Life with Eleventy.

The post covers some of the decisions I had to make, like decision-making, domain & hosting, and tool selection

blog.vannsl.io/blog/between...
Between Diapers and Development – How My Blog Came to Life with Eleventy
This is a post about creating this blog.
blog.vannsl.io
March 30, 2025 at 5:48 PM
🇩🇪 Ich habe einen neuen Blogartikel geschrieben: "Zwischen Wickeln und Entwickeln": blog.vannsl.io/blog/zwische...

Darin erzähle ich, wie ich den Alltag zwischen Windeln wechseln und Code schreiben meistere – und warum ich mich für Eleventy als Blog-Framework entschieden habe.
Zwischen Wickeln und Entwickeln - Wie mein Blog mit Eleventy entstand
This is a post about creating this blog.
blog.vannsl.io
March 26, 2025 at 1:28 PM
It took 3 days while being a fulltime mum to set up a blog with 11ty, move articles from devto to the project and deploy it!

👩‍💻 blog.vannsl.io 👩‍💻

Next step: Create new content. 🤩
In the past, I kept failing to set up my blog. I couldn't decide on a framework. I wanted to try out multiple options, evaluate the pros&cons, then make the "right" choice.

With a baby, my requirements have changed: it needs to be quick and easy. Focus on writing the articles, not coding.
March 13, 2025 at 5:38 PM
In the past, I kept failing to set up my blog. I couldn't decide on a framework. I wanted to try out multiple options, evaluate the pros&cons, then make the "right" choice.

With a baby, my requirements have changed: it needs to be quick and easy. Focus on writing the articles, not coding.
March 10, 2025 at 1:51 PM
Reposted by Vanessa Otto
🎧 Sneak Peek!

Am Dienstag erscheint unsere neue Folge – mit einer großartigen Gästin: Sandy Dähnert! Wir haben über Sustainable Web Design gesprochen – also wie das Web nachhaltiger wird. 🌱

Habt ihr euch schon mal damit beschäftigt? Oder setzt ihr sogar schon konkrete Maßnahmen um?
February 21, 2025 at 11:25 AM
Reposted by Vanessa Otto
Unsere Hosts @schepp.dev, @deadparrot.dev, Hans, Peter und @vannsl.bsky.social, haben sich zusammengesetzt, gebrainstormt und an neuen, spannenden Ideen gefeilt. 💡

Habt ihr Wünsche oder Kritik am Podcast? Dann antwortet hier, schreibt 'ne DM, E-Mail oder auf Slack draft.community! 😊
February 19, 2025 at 3:26 PM
@schepp.dev, my dear @workingdraft.de co-host, has written a great article on how to find invisible texts on websites.

If you work in web development, UX, or accessibility, this is a must-read!

🔗 Read the article: schepp.dev/posts/rethin...
February 17, 2025 at 3:17 PM
🚀 I'll be giving the talk "Unleashing the Power of AI: Write Your Own AI Extension for Tiptap" at frontendnation.com

🗓️ Thursday, 7:35pm CEST. I'll present a demo project, discuss prompt engineering, UX decisions, and token limits.
Frontend Nation | The largest event for frontend developers
Get your free ticket to the largest online gathering of frontend devs in the world. Get the latest from industry experts for Vue.js, React, Angular & many more.
frontendnation.com
June 5, 2024 at 12:42 PM
I'm delighted to share that I recently had the honour of serving on the Vue.js Germany conference jury! conf.vuejs.de/

Let me tell you, the talent on display was jaw-dropping! We come up with a solution to add more talks! 🎉

@martinakraus11.bsky.social @webdave.bsky.social 💚
vuejs.de Conf 2024
vuejs.de Conf is the first community-driven Vue conference in Germany. 8.10. - 9.10.2024 at Maritim Hotel, Bonn.
conf.vuejs.de
May 6, 2024 at 4:59 PM
I had a blast sharing the power of AI-powered actions using
Tiptap at the #vuejsamsterdam!

Imagine a Rich Text Editor that magically translates, adapts your ton, automates edits.

I showed how to implement it, displayed examples of prompt engineering, discussed token limits and prompt injections!
April 25, 2024 at 9:19 AM