𝗔𝗰𝗰𝗲𝘀𝘀𝗶𝗯𝗶𝗹𝗶𝘁𝘆-𝗙𝗶𝗿𝘀𝘁 𝗪𝗲𝗯 𝗗𝗲𝘃𝗲𝗹𝗼𝗽𝗺𝗲𝗻𝘁
ഒരു വെബ്സൈറ്റ് നിർമ്മിക്കുമ്പോൾ മിക്ക ബിസിനസ്സുകളും ചോദിക്കുന്നത് തെറ്റായ ചോദ്യങ്ങളാണ്. എല്ലാവർക്കും അത് ഉപയോഗിക്കാൻ കഴിയുമോ എന്ന് അവർ ചോദിക്കാറില്ല.
വേഗതയേറിയ ലാപ്ടോപ്പുകളും മികച്ച കാഴ്ചശക്തിയുമുള്ളവർക്ക് വേണ്ടിയാണ് അവർ വെബ്സൈറ്റുകൾ നിർമ്മിക്കുന്നത്. സ്ക്രീൻ റീഡർ (screen reader) ഉപയോഗിക്കുന്നവരെ അവർ മറന്നുപോകുന്നു. മൗസിന് പകരം കീബോർഡിനെ ആശ്രയിക്കുന്ന ഉപയോക്താക്കളെ അവർ മറന്നുപോകുന്നു. ഉള്ളടക്കം മനസ്സിലാക്കാൻ വ്യക്തമായ ലേഔട്ടുകൾ ആവശ്യമുള്ളവരെ അവർ പരിഗണിക്കാറില്ല.
നിങ്ങളുടെ സൈറ്റ് ഈ ആളുകൾക്ക് ഉപയോഗിക്കാൻ കഴിയില്ലെങ്കിൽ, അത് ശരിക്കും പ്രവർത്തിക്കുന്നില്ല എന്ന് തന്നെ കരുതുക.
ആക്സസിബിലിറ്റി പലപ്പോഴും അവസാന നിമിഷം മാത്രം ശ്രദ്ധിക്കുന്ന ഒരു കാര്യമായിട്ടാണ് കാണാറുള്ളത്. ഇത് ഒരു തെറ്റാണ്. ആദ്യ ദിവസം മുതൽ തന്നെ ആക്സസിബിലിറ്റി മുൻനിർത്തി നിർമ്മിക്കുന്നത് മികച്ച വെബ്സൈറ്റുകൾ ഉണ്ടാക്കാൻ സഹായിക്കും. ഇതിലൂടെ വേഗതയേറിയ ലോഡിംഗ് ടൈം, വൃത്തിയുള്ള കോഡ്, മികച്ച SEO എന്നിവ നിങ്ങൾക്ക് ലഭിക്കുന്നു.
അനുസരിക്കാൻ കഴിയുന്ന ഒരു പ്രായോഗിക രീതി (framework) താഴെ നൽകുന്നു:
Use Semantic HTML ഓരോ ജോലിക്കും അനുയോജ്യമായ എലമെന്റുകൾ ഉപയോഗിക്കുക. കോഡിൽ ഒരു ബട്ടൺ എന്നത് ഒരു ബട്ടൺ തന്നെയായിരിക്കണം. ഒരു ബട്ടണിന് പകരം സ്റ്റൈൽ ചെയ്ത ഒരു
divഉപയോഗിക്കുന്നത് നിങ്ങളുടെ സൈറ്റിനെ അസിസ്റ്റീവ് ടൂളുകൾക്ക് (assistive tools) കണ്ടെത്താൻ കഴിയാത്തതാക്കും. ഇത് പിന്നീട് ശരിയാക്കുന്നത് ചിലവേറിയ കാര്യമാണ്. ഇപ്പോൾ തന്നെ ചെയ്യുന്നത് സൗജന്യമാണ്.Build for Keyboard Navigation പല ഉപയോക്താക്കളും മൗസ് ഉപയോഗിക്കാറില്ല. എല്ലാ ലിങ്കുകളും ബട്ടണുകളും ഫോമുകളും Tab, Enter കീകൾ ഉപയോഗിച്ച് പ്രവർത്തിക്കുന്നതായിരിക്കണം. പേജിൽ ഉപയോക്താവ് എവിടെയാണെന്ന് മനസ്സിലാക്കാൻ 'ഫോക്കസ് ഇൻഡിക്കേറ്റർ' (focus indicator) വ്യക്തമായി കാണുന്നുണ്ടെന്ന് ഉറപ്പാക്കുക.
Check Color Contrast ടെക്സ്റ്റ് അതിന്റെ ബാക്ക്ഗ്രൗണ്ടിൽ നിന്ന് വേറിട്ട് കാണപ്പെടണം. കുറഞ്ഞത് 4.5:1 എന്ന കോൺട്രാസ്റ്റ് റേഷ്യോ ലക്ഷ്യമിടുക. അർത്ഥം വ്യക്തമാക്കാൻ നിറത്തെ മാത്രം ആശ്രയിക്കരുത്. ഒരു പിശക് (error) ചുവന്ന നിറത്തിൽ മാത്രം കാണിച്ചാൽ, കളർബ്ലൈൻഡ് ആയ ഒരാൾക്ക് അത് തിരിച്ചറിയാൻ കഴിയില്ല. അതിനാൽ ഒരു ഐക്കണോ ലേബലോ കൂടി ചേർക്കുക.
Write Meaningful Alt Text "image1.jpg" പോലുള്ള ഫയൽ പേരുകൾ Alt text ആയി ഉപയോഗിക്കുന്നത് ഒഴിവാക്കുക. ചിത്രം എന്താണ് കാണിക്കുന്നതെന്നും അത് എന്തുകൊണ്ട് പ്രധാനമാണെന്നും വിവരിക്കുക. ഒരു ചിത്രം വെറും അലങ്കാരത്തിന് മാത്രമാണെങ്കിൽ, സ്ക്രീൻ റീഡറുകൾ അത് ഒഴിവാക്കാൻ വേണ്ടി ഒരു empty alt attribute ഉപയോഗിക്കുക.
Test with Real Tools ഓട്ടോമേറ്റഡ് ടൂളുകൾക്ക് പ്രശ്നങ്ങളുടെ ഏകദേശം 40% മാത്രമേ കണ്ടെത്താൻ കഴിയൂ. NVDA, JAWS അല്ലെങ്കിൽ VoiceOver പോലുള്ള യഥാർത്ഥ സ്ക്രീൻ റീഡറുകൾ ഉപയോഗിച്ച് നിങ്ങൾ പരിശോധിക്കണം. സോഫ്റ്റ്വെയറുകളെ മാത്രം ആശ്രയിച്ചാൽ യഥാർത്ഥ പോരായ്മകൾ നിങ്ങൾക്ക് കണ്ടെത്താൻ കഴിയില്ല.
നിങ്ങൾ അരികുകളിലുള്ളവർക്കായി (edges) നിർമ്മിക്കുമ്പോൾ, അത് എല്ലാവർക്കും ഗുണകരമാകും. കഠിനമായ വെയിലത്ത് ഫോൺ ഉപയോഗിക്കുന്ന ഒരാൾക്കോ, ഒരു കൈകൊണ്ട് കുഞ്ഞിനെ പിടിച്ചുനിൽക്കുന്ന മാതാപിതാക്കൾക്കോ നിങ്ങളുടെ ആക്സസിബിൾ ഡിസൈൻ വലിയ സഹായമാകും.
ആക്സസിബിലിറ്റിയെ ഒരു നിയമപരമായ ബാധ്യതയായി കാണുന്നത് നിർത്തുക. അതിനെ ഗുണനിലവാരത്തിന്റെ ഒരു മാനദണ്ഡമായി കാണുക.