# पहुँचयोग्य वेबपेजहरू बनाउने ![सर्वसुलभता सम्बन्धी सबै कुरा](../../../../translated_images/webdev101-a11y.8ef3025c858d897a403a1a42c0897c76e11b724d9a8a0c0578dd4316f7507622.ne.png) > स्केच नोट [टोमोमी इमुरा](https://twitter.com/girlie_mac) द्वारा ## प्रि-लेक्चर क्विज [प्रि-लेक्चर क्विज](https://ff-quizzes.netlify.app/web/quiz/5) > वेबको शक्ति यसको सर्वव्यापकतामा छ। अपाङ्गता भए पनि सबैले पहुँच पाउनु यसको एक महत्वपूर्ण पक्ष हो। > > \- सर टिमोथी बर्नर्स-ली, W3C निर्देशक र वर्ल्ड वाइड वेबका आविष्कारक यो उद्धरणले पहुँचयोग्य वेबसाइटहरू बनाउने महत्त्वलाई पूर्ण रूपमा झल्काउँछ। जुन एप्लिकेसन सबैले पहुँच गर्न सक्दैन, त्यो स्वभावैले बहिष्करणकारी हुन्छ। वेब विकासकर्ताको रूपमा हामीले सधैं पहुँचयोग्यता ध्यानमा राख्नुपर्छ। सुरुबाटै यसमा ध्यान दिएर तपाईंले सबैले तपाईंले बनाएका पृष्ठहरू पहुँच गर्न सक्ने सुनिश्चित गर्न सक्नुहुन्छ। यस पाठमा, तपाईंले पहुँचयोग्यता सुनिश्चित गर्न मद्दत गर्ने उपकरणहरू र पहुँचयोग्यता ध्यानमा राखेर निर्माण गर्ने तरिकाहरू सिक्नुहुनेछ। > तपाईं यो पाठ [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101/accessibility/?WT.mc_id=academic-77807-sagibbon) मा लिन सक्नुहुन्छ! ## प्रयोग गर्नुपर्ने उपकरणहरू ### स्क्रिन रिडरहरू सबैभन्दा प्रख्यात पहुँचयोग्यता उपकरणहरूमध्ये एक हो स्क्रिन रिडर। [स्क्रिन रिडरहरू](https://en.wikipedia.org/wiki/Screen_reader) दृष्टि समस्या भएका व्यक्तिहरूका लागि सामान्यतया प्रयोग गरिने क्लाइन्ट हुन्। हामीले ब्राउजरले हामीले साझा गर्न चाहेको जानकारी सही रूपमा प्रस्तुत गर्न सुनिश्चित गर्ने प्रयास गर्छौं भने, स्क्रिन रिडरले पनि त्यही गर्न सुनिश्चित गर्नुपर्छ। स्क्रिन रिडरले आधारभूत रूपमा पृष्ठलाई माथिदेखि तलसम्म श्रव्य रूपमा पढ्छ। यदि तपाईंको पृष्ठ पूर्ण रूपमा पाठ मात्र हो भने, रिडरले ब्राउजरजस्तै जानकारी प्रस्तुत गर्नेछ। तर, वेब पृष्ठहरू प्रायः पाठ मात्र हुँदैनन्; तिनीहरूमा लिङ्क, ग्राफिक्स, रङ, र अन्य दृश्य घटकहरू हुन्छन्। स्क्रिन रिडरले यी जानकारीहरू सही रूपमा पढ्न सक्ने सुनिश्चित गर्न ध्यान दिनुपर्छ। हरेक वेब विकासकर्ताले स्क्रिन रिडरसँग परिचित हुनुपर्छ। माथि उल्लेख गरेझैं, यो तपाईंका प्रयोगकर्ताहरूले प्रयोग गर्ने क्लाइन्ट हो। जसरी तपाईं ब्राउजर कसरी काम गर्छ भनेर जान्नुहुन्छ, त्यसरी नै स्क्रिन रिडर कसरी काम गर्छ भनेर पनि जान्नुपर्छ। सौभाग्यवश, अधिकांश अपरेटिङ सिस्टमहरूमा स्क्रिन रिडरहरू समावेश गरिएका हुन्छन्। केही ब्राउजरहरूमा पनि पाठलाई आवाजमा पढ्ने वा केही आधारभूत नेभिगेसन सुविधाहरू प्रदान गर्ने उपकरणहरू र एक्सटेन्सनहरू हुन्छन्, जस्तै [यी पहुँचयोग्यता केन्द्रित Edge ब्राउजर उपकरणहरू](https://support.microsoft.com/help/4000734/microsoft-edge-accessibility-features)। यी पनि महत्त्वपूर्ण पहुँचयोग्यता उपकरण हुन्, तर स्क्रिन रिडर परीक्षण उपकरणहरूसँग भ्रमित हुनु हुँदैन। ✅ स्क्रिन रिडर र ब्राउजर टेक्स्ट रिडर प्रयास गर्नुहोस्। Windows मा [Narrator](https://support.microsoft.com/windows/complete-guide-to-narrator-e4397a0d-ef4f-b386-d8ae-c172f109bdb1/?WT.mc_id=academic-77807-sagibbon) डिफल्ट रूपमा समावेश गरिएको छ, र [JAWS](https://webaim.org/articles/jaws/) र [NVDA](https://www.nvaccess.org/about-nvda/) पनि स्थापना गर्न सकिन्छ। macOS र iOS मा, [VoiceOver](https://support.apple.com/guide/voiceover/welcome/10) डिफल्ट रूपमा समावेश गरिएको छ। ### जुम दृष्टि समस्या भएका व्यक्तिहरूले प्रायः प्रयोग गर्ने अर्को उपकरण हो जुम। जुमको सबैभन्दा आधारभूत प्रकार हो स्थिर जुम, जुन `Control + प्लस साइन (+)` वा स्क्रिन रिजोल्युसन घटाएर नियन्त्रण गरिन्छ। यस प्रकारको जुमले सम्पूर्ण पृष्ठलाई पुनःआकार दिन्छ, त्यसैले [उत्तरदायी डिजाइन](https://developer.mozilla.org/docs/Learn/CSS/CSS_layout/Responsive_Design) प्रयोग गरेर उच्च जुम स्तरमा राम्रो प्रयोगकर्ता अनुभव प्रदान गर्नु महत्त्वपूर्ण छ। जुमको अर्को प्रकार विशेष सफ्टवेयरमा निर्भर गर्दछ जसले स्क्रिनको एउटा क्षेत्रलाई ठूलो बनाउँछ र प्यान गर्छ, ठीक वास्तविक आवर्धक गिलास प्रयोग गरेजस्तै। Windows मा, [Magnifier](https://support.microsoft.com/windows/use-magnifier-to-make-things-on-the-screen-easier-to-see-414948ba-8b1c-d3bd-8615-0e5e32204198) समावेश गरिएको छ, र [ZoomText](https://www.freedomscientific.com/training/zoomtext/getting-started/) तेस्रो-पक्ष आवर्धन सफ्टवेयर हो जसमा थप सुविधाहरू र ठूलो प्रयोगकर्ता आधार छ। macOS र iOS दुवैमा [Zoom](https://www.apple.com/accessibility/mac/vision/) नामक बिल्ट-इन आवर्धन सफ्टवेयर छ। ### कन्ट्रास्ट चेकरहरू वेबसाइटहरूमा रङहरू सावधानीपूर्वक चयन गर्नुपर्छ ताकि रङ अन्धोपन भएका प्रयोगकर्ताहरू वा कम कन्ट्रास्ट रङहरू देख्न गाह्रो हुने व्यक्तिहरूको आवश्यकताहरू पूरा गर्न सकियोस्। ✅ तपाईंले मन पराउने कुनै वेबसाइटलाई ब्राउजर एक्सटेन्सन जस्तै [WCAG को कलर चेकर](https://microsoftedge.microsoft.com/addons/detail/wcag-color-contrast-check/idahaggnlnekelhgplklhfpchbfdmkjp?hl=en-US&WT.mc_id=academic-77807-sagibbon) प्रयोग गरेर रङ प्रयोगको लागि परीक्षण गर्नुहोस्। तपाईंले के सिक्नुहुन्छ? ### लाइटहाउस तपाईंको ब्राउजरको डेभलपर टुल क्षेत्रमा, तपाईंले लाइटहाउस उपकरण फेला पार्नुहुनेछ। यो उपकरण वेबसाइटको पहुँचयोग्यता (र अन्य विश्लेषण) को पहिलो झलक पाउन महत्त्वपूर्ण छ। यद्यपि लाइटहाउसमा मात्र भर पर्नु हुँदैन, १००% स्कोर आधारभूत रूपमा धेरै उपयोगी हुन्छ। ✅ तपाईंको ब्राउजरको डेभलपर टुल प्यानलमा लाइटहाउस फेला पार्नुहोस् र कुनै पनि साइटमा विश्लेषण चलाउनुहोस्। तपाईंले के पत्ता लगाउनुहुन्छ? ## पहुँचयोग्यताका लागि डिजाइन गर्ने पहुँचयोग्यता एकदम ठूलो विषय हो। तपाईंलाई सहयोग गर्नका लागि, धेरै स्रोतहरू उपलब्ध छन्। - [Accessible U - मिनेसोटा विश्वविद्यालय](https://accessibility.umn.edu/your-role/web-developers) हामीले पहुँचयोग्य साइटहरू सिर्जना गर्ने हरेक पक्षलाई समेट्न सक्दैनौं, तर तलका केही मुख्य सिद्धान्तहरू तपाईंले लागू गर्न चाहनुहुनेछ। सुरुबाटै पहुँचयोग्य पृष्ठ डिजाइन गर्नु **सधैं** सजिलो हुन्छ, पहिले नै बनेको पृष्ठलाई पहुँचयोग्य बनाउनुभन्दा। ## राम्रो प्रदर्शन सिद्धान्तहरू ### रङ सुरक्षित प्यालेटहरू मानिसहरूले संसारलाई फरक तरिकाले हेर्छन्, जसमा रङ पनि समावेश छ। तपाईंको साइटको लागि रङ योजना चयन गर्दा, तपाईंले यो सुनिश्चित गर्नुपर्छ कि यो सबैका लागि पहुँचयोग्य हो। [रङ प्यालेटहरू उत्पन्न गर्नको लागि एक उत्कृष्ट उपकरण हो Color Safe](http://colorsafe.co/)। ✅ रङको प्रयोगमा धेरै समस्या भएको कुनै वेबसाइट पहिचान गर्नुहोस्। किन? ### सही HTML प्रयोग गर्नुहोस् CSS र JavaScript को साथमा कुनै पनि तत्वलाई कुनै पनि प्रकारको नियन्त्रण जस्तो देखाउन सम्भव छ। `` लाई `