वेब एक्सेसिबिलिटी - सुनिश्चित करें कि वैकल्पिक टेक्स्ट छवि लिंक (एसवीजी छवियों) के लिए जानकारीपूर्ण है

Question

मैं एक छवि लिंक वेब सुलभ बनाने की कोशिश कर रहा हूं, लेकिन छवि एसवीजी है। यह एएमपी उपकरण के साथ अनुपालन होना चाहिए (यहां पाया गया: https://www.webaccessibility.com/express.php)। विशिष्ट समस्या है कि फेंके यहां पाया जा सकता है:

https://www.webaccessibility.com/best_practices.php?best_practice_id=370

यह कोड स्निपेट एएमपी उपकरण पूरी तरह से पारित करेंगे ..

<svg role="img" class="icon icon-large"> 
<title>Build a Long-Term Plan</title> 
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-calendar"></use> 
</svg> 

हालांकि, जब यह लपेटकर है कि एक एक में करने के लिए आता टैग, एएमपी एक त्रुटि फेंकता है। यहां बताया गया है प्रतीत होता है ठीक होना चाहिए का एक उदाहरण है:

<a href="/some-url-here/" class="some-class"> 
<svg role="img" class="icon icon-large"> 
<title>Build a Long-Term Plan</title> 
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-calendar"></use> 
</svg> 
<span>Build a Long-Term Plan</span> 
</a> 

..लेकिन दुर्भाग्य से, कि पिछले कोड स्निपेट एक त्रुटि फेंकता है। क्या कोई मेरी मदत कर सकता है? अग्रिम में धन्यवाद।

Answer 1

मेरा समाधान मजेदार नहीं था, लेकिन यह चाल थी। आप आसानी से एसवीजी टैग और उसकी सभी सामग्री को ए टैग से बाहर ले जा सकते हैं, और उसके बाद सीएसएस का इस्तेमाल उस स्थिति में कर सकते हैं जहां यह संबंधित है, और यह टूल पास करेगा .. मेरी इच्छा है कि एक बेहतर तरीका था लेकिन मुझे एक नहीं मिला । यदि आप कुछ जानते हैं जो मैं नहीं करता, तो कृपया इसे साझा करें, इसका बहुत स्वागत किया जाएगा। धन्यवाद!

अंतिम परिणाम यह है कि काम करता है:

<svg role="img" class="icon icon-large"> 
<title>Build a Long-Term Plan</title> 
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-calendar"></use> 
</svg> 
<a href="/some-url-here/" class="some-class"> 
<span>Build a Long-Term Plan</span> 
</a>