SVG online validieren – Syntax- und Barrierefreiheitsprüfung

Überprüfen Sie die Wohlgeformtheit von SVG, die ViewBox und die grundlegende Zugänglichkeit von Titel/Abstieg. Hinweiswarnungen – nichts hochgeladen.

Laden…
SVG-Validator – Syntax und a11y-Playbook
Beratungsprüfungen für SVG-Syntax, Skalierung (viewBox) und grundlegenden Barrierefreiheitstext. Keine WCAG-Zertifizierung – vor dem Versand Symbole verwenden.

Hinweise des Entwicklers

Fehler = kaputtes XML; Warnungen kennzeichnen fehlende viewBox oder title/desc. Dekorative Icons können mit Warnungen gültig sein. Keine Auto-Korrektur in v1 — Quelle manuell bearbeiten. Nach Fixes mit optimize-svg fortsetzen. Der Ergebnisbereich zeigt Urteil, SVG-Stats (viewBox, title/desc, Größen) und Issue-Codes nach Live-Validierung (~300 ms).

Wenn Teams diese Route wählen

Gate-Design-Übergabe SVG vor der React-Konvertierung. Fehlende ViewBox auf responsiven Symbolen erkennen. Erinnern Sie Autoren daran, <title> für Screenreader hinzuzufügen. Schneller Fusseldurchgang ohne CLI-Werkzeuge.

Ausgearbeitete Beispiele

Rich SVG fehlt Text zur Barrierefreiheit

Beispieleingabe

<svg xmlns="http://www.w3.org/2000/svg" width="240" height="72" viewBox="0 0 240 72" class="promo-badge" role="img"> <defs> <linearGradient id="badgeGradient" x1="0%" y1="0%" x2="100%" y2="100%"> <stop offset="0%" stop-color="#f97316"/> <stop offset="100%" stop-color="#fb923c"/> </linearGradient> <clipPath id="badgeClip"> <rect x="0" y="0" width="240" height="72" rx="18" ry="18"/> </clipPath> </defs> <g clip-path="url(#badgeClip)"> <rect width="240" height="72" fill="url(#badgeGradient)"/> <g transform="translate(20 16)"> <circle cx="20" cy="20" r="20" fill="#0f172a" fill-opacity="0.14"/> <path fill="#fff" d="M24 4 11 22h9l-4 14 13-18h-9z"/> </g> <text x="76" y="31" font-size="18" font-weight="700" fill="#fff">FastMinify</text> </g> </svg>

Ergebnis

Gültig mit Warnung: Struktur ist in Ordnung, aber fügen Sie <title> oder <desc> für die Barrierefreiheit hinzu — angezeigt im Ergebnisbereich.

Defektes Markup

Beispieleingabe

<svg><circle></svg>

Ergebnis

Ungültig – Parserfehler mit Problem auf Fehlerebene — angezeigt im Ergebnisbereich.

Navigieren Sie durch verwandte SVG-Tools

Beheben Sie Probleme, dann optimieren Sie SVG, konvertieren Sie über SVG in JSX oder durchsuchen Sie alle SVG-Tools.

SVG Häufig gestellte Fragen zum Validator

Nur Beratungsprüfungen

Handelt es sich um ein WCAG-Audit?

Nein – es prüft nur wohlgeformtes XML, viewBox und das Vorhandensein von Titel/Desc.

Warnungen vs. Fehler?

Fehler bedeuten ungültiges XML. Warnungen weisen auf Barrierefreiheits- oder Skalierungslücken hin.

Automatische Korrektur?

Nicht in Version 1 – bearbeiten Sie die SVG-Quelle manuell.

SVG Werkzeuge

Vorschau anzeigen, mit SVGO optimieren, Daten exportieren URI, Größe ändern, verschönern, in JSX konvertieren und SVG validieren – alles in Ihrem Browser.

Weitere Werkzeugkategorien entdecken