Autoren · Profil
Jan-Tristan Rudat ist Redakteur bei AKARA Solutions und schreibt die Praxis- und Frontend-Ratgeber von svgpatheditor.de. Schwerpunkte: SVG als offener W3C-Standard für Vektorgrafik, der seit 2001 im Web verankert ist und in jedem modernen Browser nativ läuft; der Unterschied zwischen absoluten und relativen Pfadbefehlen und die Frage, wann welche Schreibweise die bessere Wahl ist; das Optimieren von Pfaden für kleinere Dateien, etwa durch weniger Nachkommastellen, zusammengefasste Befehle und Werkzeuge wie SVGO; der Einsatz von Pfaden über die reine Grafik hinaus, in CSS mit clip-path und der path()-Funktion, in JavaScript mit der Web Animations API und in SMIL mit animateMotion, damit sich Objekte entlang eines Pfades bewegen. Korrekturwünsche zu Quellen oder technischen Details gehen an info@akara-solutions.de.
Ratgeber von Jan-Tristan
-
Absolute vs. relative Pfadbefehle: wann Groß, wann klein?
Große Befehle arbeiten mit absoluten Koordinaten, kleine relativ zum vorherigen Punkt. Was der Unterschied konkret bedeutet, warum relative Pfade sich leichter verschieben lassen und wann absolute Koordinaten die klarere Wahl sind, mit klaren Faustregeln.
-
SVG-Pfade optimieren: kleinere Dateien, sauberer Code
Generierte SVG-Pfade sind oft unnötig groß: zu viele Nachkommastellen, überflüssige Befehle, doppelte Punkte. Wie du Pfade verkleinerst, ohne die Form zu verändern, welche Rolle die Rundung spielt und welche Werkzeuge wie SVGO dabei helfen.
-
SVG-Pfade in CSS und JavaScript: clip-path, path() und Animation
Pfade sind mehr als Grafik: Mit clip-path und der CSS-path()-Funktion beschneidest du Elemente, mit der Web Animations API und animateMotion bewegst du Objekte entlang eines Pfades. Wie du ein d-Attribut aus dem Editor in echten Code übernimmst.