微妙なマークアップの欠陥は、すべて同じIDで定義された12個の同一のSVGグラデーションに関係していました。 これにより、12個のグラデーション定義のうち11個が未使用となり、すべてのビジュアル要素は誤って最初の定義を参照していました。 すべての重複したグラデーションが同一の色停止を持っていたため、ページは視覚的に正しく表示されていました。 この見えにくさにより、著者自身の5回のチェックを含む標準的なサイト監査でも、この問題を発見できませんでした。 グラデーションの定義が変更され、誤った要素またはどの要素にも影響を与える可能性があったまで、問題は隠されたままでした。 重複IDの重要な監査チェックは、以前は視覚的な問題を引き起こしたことがなかったため、欠落していました。 IDを順次リネームする初期の修正試みは、誤った定義と参照をペアにすることで、より深刻で視覚的なバグを作成しました。 この見落としは、定義と参照の間の不均衡をフラグ付けしたカウントアサーションによって防止されました。 正しいソリューションは、IDのリネームを個々のSVGブロックにスコープし、定義が独自のスコープ内の参照と一致することを確認します。 この経験は、特にインラインSVGでの重複IDの監査の重要性と、検索および置換操作の綿密な検証の重要性を強調しています。