- "यहाँ क्लिक करें" जैसे सामान्य लिंक टेक्स्ट के उपयोग की समस्या पर ज़ोर
- accessibility बेहतर करने के संदर्भ में, लिंक टेक्स्ट को कंटेंट का अर्थ स्पष्ट रूप से बताना चाहिए
- search engine और screen reader उपयोगकर्ता अनुभव पर नकारात्मक प्रभाव पड़ता है
- स्पष्ट और संदर्भ को दर्शाने वाले लिंक वाक्यांश उपयोगकर्ताओं और तकनीक, दोनों को लाभ देते हैं
- 2001 से web standards और UX सिद्धांतों के स्तर पर सही लिंक टेक्स्ट को बढ़ावा देने की पहल जारी है
परिचय
- "यहाँ क्लिक करें" या "click here" जैसे सामान्य लिंक टेक्स्ट का उपयोग लंबे समय से web developers के बीच एक आम प्रथा रहा है
- लेकिन इस तरीके में accessibility, usability, SEO के लिहाज़ से महत्वपूर्ण कमियाँ हैं
लिंक टेक्स्ट का अर्थ और समस्याएँ
- लिंक टेक्स्ट की भूमिका यह है कि वह उपयोगकर्ता को क्लिक करने से पहले यह अनुमान लगाने में मदद करे कि लिंक कहाँ ले जाएगा
- अगर इसे सिर्फ़ "यहाँ क्लिक करें" की तरह लिखा जाए, तो बिना संदर्भ के लिंक मौजूद होने से उपयोगकर्ता भ्रम और accessibility में कमी पैदा होती है
accessibility और उपयोगकर्ता अनुभव पर प्रभाव
- screen reader उपयोगकर्ता जब पेज के भीतर लिंक सूची देखते हैं, तो उन्हें हर जगह एक ही "यहाँ क्लिक करें" सुनाई देता है, जिससे जानकारी प्राप्त करना कठिन हो जाता है
- जब लिंक अर्थपूर्ण और विशिष्ट वाक्यांशों के साथ लिखे जाते हैं, तो दृष्टिबाधित उपयोगकर्ताओं सहित विभिन्न परिस्थितियों के सभी उपयोगकर्ताओं के लिए अनुभव की दक्षता बढ़ती है
search engine optimization (SEO) से जुड़े विचार
- search engines भी लिंक टेक्स्ट का विश्लेषण करके कंटेंट की प्रासंगिकता और गुणवत्ता का आकलन करते हैं
- महत्वपूर्ण keywords और संदर्भ वाले लिंक टेक्स्ट search ranking और visibility बढ़ाने में सकारात्मक प्रभाव डालते हैं
सही लिंक टेक्स्ट लिखने की सिफारिश
- ऐसे लिंक टेक्स्ट के उपयोग की सिफारिश की जाती है जो संदर्भ को स्पष्ट रूप से दर्शाएँ
- उदाहरण: "नवीनतम accessibility guidelines देखें"
- यह सिद्धांत 2001 से web standards के उदय और UX को मजबूत करने की प्रक्रिया में लगातार ज़ोर दिया जाता रहा है
निष्कर्ष
- "यहाँ क्लिक करें" के बजाय अर्थपूर्ण टेक्स्ट को लिंक के रूप में उपयोग करना आज के web और भविष्य के web, दोनों के लिए एक आवश्यक मानक है
1 टिप्पणियां
Hacker News की राय
accessibility के नजरिए से देखें, तो दृष्टिबाधित लोगों के लिए screen reader पेज को linear तरीके से पढ़कर सुनाते हैं
linear reading से बाहर निकलने के लिए वे अक्सर headings या links जैसे elements की सूची को उनके मूल स्थान के context के बिना अलग से navigate करने देते हैं
अगर सभी links “click here” हों, तो ऐसे users से non-linear access लगभग छीन लेने जैसा है
इसलिए “get Amaya” या “go to the Amaya website” जैसा कुछ ठीक लगता है
और github.io के download button से executable को SourceForge जैसी, malware sites मानी जाने वाली जगहों से लाना अच्छा तरीका नहीं है। wxMaxima याद आता है
मेरा मतलब tools बदलने से नहीं है, लेकिन जो लोग screen reader कैसे काम करता है इसे खुद गहराई से नहीं देखेंगे, उन्हें यह visualize करके दिखाने का कोई तरीका होना चाहिए
हालांकि पहली वाली screen readers में कितनी अच्छी तरह support होती है, यह नहीं पता
edit: links को WCAG 2.0 से 2.2 पर update किया
फिर भी लेख के example की तरह सिर्फ “Amaya” रखने के बजाय “Get Amaya” की तरह action को और शामिल करूंगा
user, उदाहरण के लिए, landmarks के बीच, headings के बीच, या दोनों को मिलाकर outline navigation mode में move कर सकता है
मुख्य बात यह है कि screen reader navigation keyboard navigation जैसा नहीं होता
बिल्कुल सहमत नहीं हो सकता। उनका खराब example “To download W3C's editor/browser Amaya, click here.” बहुत साफ है
link दबाने पर तुरंत download होगा या download page पर जाएगा
उल्टा “Get Amaya!” Amaya website के link जैसा दिखता है, download page जैसा नहीं, इसलिए download के लिए effective नहीं है
“Tell me more about Amaya: W3C's free editor/browser that lets you create HTML, SVG, and MathML documents.” भी अच्छा नहीं है। यह download के बारे में sentence नहीं है और “tell me more” command है, लेकिन असल link वह नहीं है
web का conventional use, यानी “To download W3C's editor/browser Amaya, click here.” या “Download Amaya, the W3C's editor/browser.” पूरी तरह ठीक है
यह विचार कि link verb नहीं हो सकता, काफी अजीब लगता है। अगर उसमें download या और जानें जैसा action शामिल है, तो link जाहिर तौर पर verb हो सकता है
यह Wikipedia के reference links की तरह किसी विषय के बारे में और जानने वाले case से अलग है
“click here” बहुत साफ कर देता है कि link सिर्फ reference link नहीं बल्कि action link है। “Get Amaya!” देखने पर ऐसा लगता है कि यह Amaya कैसे पाएं यह बताने के बजाय “Amaya” कोई download link नहीं बल्कि reference link है
search engine बनाएं तब भी “click here” index को कौन-सी जानकारी देगा?
मैं इससे सहमत नहीं कि verb अपने आप में बड़ी समस्या है, लेकिन अगर verb click है और object here है, तो बात अलग है
“Click Here to download Amaya” जैसा link text सहन किया जा सकता है, लेकिन अगर link सचमुच सिर्फ दो शब्द “click here” ही है, तो कई contexts में उसे दूसरे links से अलग नहीं किया जा सकता
“Download Amaya” एक बेहतरीन link हो सकता है। सिर्फ “Amaya” होना या सिर्फ “click here” होना अच्छा नहीं है, जब तक कि वह Amaya info page पर न जा रहा हो
आखिरकार “click here” की समस्या, जैसा दूसरे comments ने कहा, accessibility की समस्या है, लेकिन link text target को ठीक से reflect करता है या नहीं, इससे मिलाकर message काफी धुंधला हो गया लगता है
aria-describedbyमदद कर सकता है, लेकिन link के अंदर के text को ही बेहतर बना दें तो इसकी जरूरत टाली जा सकती हैverb के बारे में मैं सहमत हूं
UK की Government Digital Service भी accessibility guidelines में मिलती-जुलती सिफारिश करती है: https://design.homeoffice.gov.uk/accessibility/links
ये सबसे खूबसूरत तो नहीं हैं, लेकिन form components की मोटी काली/पीली borders जैसी चीज़ों से ज़्यादा accessibility design से पहले आती है
W3C कहता है “Get Amaya”, “Read more about Amaya”, और Home Office कहता है “Get Amaya”, “Read more about Amaya”
दूसरा बहुत ज़्यादा तर्कसंगत लगता है, लेकिन context के अंदर इस्तेमाल करने पर दूसरी समस्या आ जाती है
निजी तौर पर मुझे लगता है कि दोनों दो अलग-अलग use cases को मिला देते हैं। Links अक्सर वाक्य के अंदर inline इस्तेमाल होते हैं, और W3C व Home Office जिन मामलों की बात करते हैं उन्हें वाक्य के बाहर buttons, जैसे
[Download],[Documentation], के रूप में रखना बेहतर हैलेकिन inline text के अंदर hyperlink वाले use case में दोनों ही awkward लगते हैं
उदाहरण के लिए “PiPedal is a guitar effects pedal that runs on Raspberry Pi. To download PiPedal, click here. To read the documentation, click here.” को कैसे सुधारा जाए?
विरोध की वजह समझ आती है, लेकिन “PiPedal is a guitar effects pedal that runs on Raspberry Pi. Get Pipedal. Read the documentation.” जैसा edit स्वीकार करना मुश्किल है। यह English idiom के हिसाब से स्वाभाविक नहीं है
असल documentation में मैंने “To download PiPedal, visit the Download Page. To learn more about Pipedal, view the Documentation.” जैसा लिखा, लेकिन अनुभव के आधार पर “click here” को noun में बदलना अक्सर बहुत मुश्किल होता है
“Ubuntu Server installs don't suffer from this problem; but before choosing an Ubuntu Server install, you should read the Ubuntu Server section of the "Installing on Ubuntu" page.” जैसे वाक्य में तो और भी ज़्यादा
तब सवाल उठता है कि “here” को reference target के pronoun के रूप में इस्तेमाल करने में आखिर गलती क्या है
इस use case में link उस वाक्य के अंदर है जो ज़रूरी पूरा context देता है, इसलिए शायद कोई वास्तविक accessibility problem नहीं है
पहला example भी एक webpage की lead sentence है, जहाँ संक्षिप्तता अहम है
“To download PiPedal, click here.” क्या सच में accessibility problem है? खासकर अगर ठीक ऊपर
[ Download ] [ Documentation ]buttons होंयहाँ सच में important metric यह है कि लोग download page पर कितनी बार जाते हैं
उस नज़रिए से, “To download PiPedal, visit the Download Page.” बेहतर होगा या नहीं, इस पर काफ़ी शक है
निजी तौर पर, उनका avoid करने को कहा गया दूसरा example मुझे बेहतर लगता है: “To download Amaya, go to the Amaya_Website and get the necessary software.”
सिर्फ़ “Amaya” वाला link यह नहीं बताता कि यह internal link है या external, और context से Amaya download करने का उद्देश्य साफ़ होने पर भी यह समझना मुश्किल है कि यह सीधे file पर जाता है या download page पर
उम्र बढ़ने की वजह से शायद ऐसा हो, लेकिन मैंने links को हमेशा instinctively noun की ओर इशारा करने वाला माना है
Link किसी जगह की ओर इशारा करता है, और उस जगह का नाम होता है, verb या adjective नहीं
इसलिए “मेरी website” पर जाने वाला link ठीक है, लेकिन “मेरी website पर जाना” जैसा link मूल रूप से सही नहीं लगता
imperative tone भी मुझे बहुत नापसंद है, इसलिए “go to my website” या “follow this link” जैसे वाक्य मैं कभी नहीं लिखता
लेकिन अगर link download जैसी कोई action शुरू करता है तो ambiguity आ जाती है। फिर भी इसे “download” या “downloader” जैसे noun के रूप में देखें तो यह अब भी noun ही है
यह शायद ऐसा internet argument है जिसे मैं आख़िर तक निभाऊँगा
call-to-action copy अलग मुद्दा है, लेकिन जो page सिर्फ़ “here” शब्द को link करता है, वह hypertext medium को न समझने वाले लेखक की साफ़ failure है
“click here” गलती से छोड़े गए stage direction जैसा दिखता है
ज़्यादातर लेखक लिखते समय hypertext context में नहीं लिखते, और Markdown जैसे link notation के बजाय stage direction को default मान लेते हैं
“I forgot my password” लिखे लिंक के बारे में एक पोस्ट याद आती है
सोचा था कि “click here if...” लिखने से क्या यह बेहतर होगा, लेकिन सहज रूप से पता था कि वह भी सही नहीं है
वेबपेज के बेकार elements को नज़रअंदाज़ करना कुछ लोगों के लिए मौजूद skill ही नहीं है, और यह कैसे सिखाया जाए, समझ नहीं आता
जब भी बिना background knowledge वाले किसी व्यक्ति को web इस्तेमाल करने में मदद करता हूं, यह बात याद आती है। कुछ users के लिए पेज का शाब्दिक रूप से पहला item अगर “Please enable notifications” हो, तो वे दूसरे item को देखने से पहले ही उसे गंभीरता से सोचने लगते हैं
Google Search भी अब असली results से पहले कई screens भर कचरा दिखाता है, इसलिए यह और भी सच है
इससे जुड़ी समस्या यह है कि पेज के text की epistemic status को अलग-अलग तरह से समझ नहीं पाते
उदाहरण के लिए, “I forgot my password” नाम का clickable link देखकर कुछ users यह मानते हैं कि इसका मतलब यह नहीं है कि password भूलने पर यहां क्लिक करना है, बल्कि यह एक वाक्य है जो बता रहा है कि वे अपना password भूल गए हैं
बेशक UI standardization की मौत ने इस समस्या को कहीं ज़्यादा खराब कर दिया है
https://mstdn.io/@mattskala/113188291223682980
याद है जब Microsoft ने UI में बहुत सारे buttons हटाकर उन्हें अस्पष्ट रूप से रंगे हुए text links में बदल दिया था। उसके बाद यह पता लगाना बहुत मुश्किल हो गया कि किस पर click करना है
Users सहज रूप से machine के अनुकूल होते हैं, और developers users के अनुकूल होते हैं, जिससे feedback loop बनता है
दूसरे शब्दों में, बहुत सारी websites और apps में “I forgot my password” link होने के कारण भाषा का अर्थ भी शायद बदल गया हो
कम-से-कम उस context में ज़्यादातर लोग intent समझने के लिए adapt कर जाएंगे
युवा पीढ़ी, जिसे कोई दूसरा तरीका पता नहीं है, शायद इसे ध्यान देने लायक चीज़ भी न माने
इसलिए convention को अलग से देखने पर भले ही वह बेमानी लगे, convention बनाए रखने की भी value है
अगर सभी examples लगातार इसी premise पर हैं कि वे सच में “Amaya” download करते हैं, तो simply hyperlink Download Amaya बेहतर होगा
हो सके तो यह दिखाने वाला download icon भी अच्छा रहेगा कि यह actual file पर जाता है
क्योंकि इससे पता चलता है कि असली download button चार ads के बीच छिपे किसी और पेज का link नहीं है
Dragan Espenschied(despens) ने 2022 में लिखा था कि link text समय के साथ कैसे बदला: https://despens.systems/2022/06/button-pushes-you/
उन्होंने call-to-action phrases से user को describe करने वाले button text की ओर हुए shift को रेखांकित किया
“इसके बजाय उन्हें user की state को फिर से frame करना चाहिए। User को अगली जानकारी access करने से पहले लिखे हुए मंत्र को स्वीकार करना और अपना attitude बदलना होगा” जैसी बात
“Get Amaya.”, “Tell me more about Amaya.” सुरुचिपूर्ण नहीं लगते