Seite 272 - Mironsoft Blog

Ein Warenkorb-Icon, ein Lupensymbol für die Suche oder ein reines Icon für Social-Share-Buttons sieht für sehende Nutzer selbsterklärend aus, für einen Screenreader ist ein solcher Button ohne zusätzliche Auszeichnung schlicht ein namenloses Button-Element. Dieser Artikel vergleicht die drei gängigen Patterns visually-hidden-Text, aria-label und title-Attribut technisch fundiert und zeigt anhand von Warenkorb-, Such- und Social-Share-Icons in Hyvä, welches Pattern wann tatsächlich zuverlässig funktioniert.

Tabellarische Daten sind in fast jeder Automatisierungsaufgabe präsent: Exportdateien, Berichte, Konfigurationen, Migrationsquellen. Mit den richtigen Werkzeugen – awk für Spaltenoperationen, read mit IFS für Zeilenverarbeitung, mapfile für den Speicher – lassen sich CSV und TSV in Bash zuverlässig und ohne externe Abhängigkeiten verarbeiten.

Lange Cache-Zeiten für CSS und JavaScript sind gut für die Performance, aber gefährlich, wenn sich der Inhalt einer Datei ändert, ihre URL jedoch gleich bleibt. Dieser Artikel zeigt, warum content-hash-basierte Versionierung über json_manifest_path oder AssetMapper der Query-String-Variante vorzuziehen ist, wie Nginx und CDN korrekt konfiguriert werden und welche Fallstricke bei Multi-Server-Deployments ohne geteiltes Manifest lauern.

Ein geteilter Link ohne Bild, mit abgeschnittenem Titel oder falscher Beschreibung wirkt unprofessionell und wird seltener geklickt. Open-Graph-Tags steuern exakt, wie eine URL bei Facebook, LinkedIn, WhatsApp und weiteren Plattformen als Vorschau erscheint. Wer og:image, og:title und og:description korrekt setzt und die Bildgrößen pro Plattform beachtet, verwandelt jeden geteilten Link in eine kleine Werbeanzeige statt in eine verpasste Chance.

KI-Assistenten wie Claude beschleunigen die Entwicklung, übernehmen aber auch unsichere Muster aus Trainingsdaten, etwa fehlende Input-Validierung, veraltete Krypto-Funktionen oder permissive Standardrechte. Mit gezieltem Security-Prompting und einem Review-Prozess, der KI-Code wie jeden menschlichen Beitrag behandelt, lassen sich diese Risiken systematisch reduzieren.

Nuxt-Module sind das Werkzeug, mit dem sich Build-Prozess, Runtime und sogar die Entwicklerwerkzeuge eines Nuxt-Projekts erweitern lassen. In diesem Artikel bauen wir Schritt für Schritt ein eigenes Modul, das einen Hook in den Build-Prozess einklinkt, typsichere Optionen mitbringt und am Ende ein eigenes Tab in den Nuxt DevTools registriert.

dnd-kit übernimmt die komplexe Logik hinter Drag-and-Drop, Kollisionserkennung, Tastatursteuerung und Sensor-Management, liefert aber bewusst keine eigenen Styles mit. Die gesamte visuelle Kommunikation, welches Element gerade gezogen wird, wo es landen kann und wo die Lücke für den Drop entstehen wird, bleibt Aufgabe von CSS und Tailwind. Wer diese drei Zustände sauber trennt und über dnd-kits data-Attribute steuert, bekommt ein Drag-and-Drop-Erlebnis, das sich flüssig anfühlt und dem Nutzer jederzeit klar zeigt, was gerade passiert.

Wer Bash-Skripte mit hartcodierten Pfaden und starren Parametern schreibt, zwingt sich zu manuellem Editieren bei jedem Aufruf. Argumente und Flags in Bash sauber parsen bedeutet: skalierbare CLI-Schnittstellen mit getopts, manuellen Long-Option-Schleifen, vollständiger Validierung und verständlicher Usage-Ausgabe zu bauen – die sich in jede Pipeline integrieren lassen.

Tooltips, die am Rand des Viewports abgeschnitten werden, Dropdowns, die hinter anderen Elementen verschwinden, und Popovers, die nicht mit dem Scroll-Position synchron bleiben – all das löst das x-anchor-Plugin von Alpine.js mit der Floating-UI-Engine, automatischem Flip-Verhalten und Scroll-Awareness.

Tabs die nach dem Reload wieder denselben Tab zeigen, die Zurück-Schaltfläche des Browsers unterstützen und als Deep-Link per E-Mail teilbar sind – das sind keine SPA-Features. Das ist URL-Hygiene mit zehn Zeilen Alpine.js und der nativen History-API des Browsers.