அணுகல்தன்மையும் ஒப்புதலும் இப்போது ஏன் ஒன்றுடன் ஒன்று மேற்பொருந்துகின்றன

ஒப்புதல் பேனரைப் பார்க்கவும் கிளிக் செய்யவும் முடிந்தவர்களிடமிருந்து மட்டுமல்லாமல், ஒவ்வொரு பயனரிடமிருந்தும் ஒப்புதல் பெறக்கூடியதாக இருக்க வேண்டும் என்று GDPR கோருகிறது. ஒரு தரவு பொருள் ஒப்புதல் இடைமுகத்துடன் அர்த்தமுள்ள வகையில் தொடர்பு கொள்ள முடியாவிட்டால் — தளம் இடமளிக்காத ஒரு குறைபாட்டால் — ஒப்புதல் செல்லுபடியாகப் பெறப்படவில்லை என்று ஐரோப்பிய தரவுப் பாதுகாப்பு வாரியம் தெளிவுபடுத்தியுள்ளது. அதாவது குக்கீகள் முதலிலேயே ஏற்றப்பட்டிருக்கக் கூடாது.

அணுகல்தன்மைப் பக்கத்தில், ஐரோப்பிய ஒன்றிய உறுப்பு நாடுகளில் தேசிய சட்டத்தில் இணைக்கப்பட்ட ஐரோப்பிய அணுகல்தன்மைச் சட்டம் (EAA), நுகர்வோர் சேவைகளை வழங்கும் தனியார்-துறை வலைத்தளங்கள் மற்றும் பயன்பாடுகளுக்கு WCAG 2.1 AA-வை குறைந்தபட்சமாக்குகிறது. அபராத ஆட்சி நாட்டிற்கு நாடு மாறுபடும் ஆனால் பொதுவாக ஒரு மீறலுக்கு €50,000 முதல் €500,000 வரை இருக்கும், மேலும் நிலையான இணக்கமின்மைக்கு சந்தை திரும்பப்பெறும் உத்தரவுகள்.

குக்கீ பேனர்களுக்கான முக்கிய WCAG தேவைகள்

விசைப்பலகை இயக்கத்தன்மை

ஒவ்வொரு பேனர் கட்டுப்பாடும் — ஏற்க, நிராகரி, விருப்பங்களை நிர்வகி, மூடு — விசைப்பலகையால் மட்டுமே அடையக்கூடியதாகவும் இயக்கக்கூடியதாகவும் இருக்க வேண்டும். பயனர்கள் தர்க்கரீதியான வரிசையில் பொத்தான்களின் வழியாக Tab செய்யவும், Enter அல்லது Space மூலம் அவற்றைச் செயல்படுத்தவும் முடிய வேண்டும். கவனம் பின்னணிக்கு எதிராக குறைந்தபட்சம் 3:1 மாறுபாட்டுடன் தெரியக்கூடியதாக இருக்க வேண்டும்.

மாடல் பேனர்களில் கவனம் சிக்கவைத்தல்

பேனர் பக்கத்தின் மற்ற பகுதியுடனான தொடர்பைத் தடுத்தால், பயனர் தேர்வு செய்யும் வரை விசைப்பலகை கவனம் பேனருக்குள் சிக்கவைக்கப்பட வேண்டும். பயனர்கள் கீழ் பக்கத்தை உருட்ட பேனரிலிருந்து Tab செய்து வெளியேற முடியாது. கவனம் சிக்கவைக்கப்பட்டு பேனர் மூடப்படும்போது, கவனம் பேனரைத் தூண்டிய உறுப்புக்கு அல்லது ஒரு நியாயமான இயல்புநிலைக்குத் திரும்ப வேண்டும்.

திரை வாசிப்பி அறிவிப்புகள்

பேனர் அணுகக்கூடிய பெயர் மற்றும் பாத்திரத்துடன் ஒரு உரையாடலாக அறிவிக்கப்பட வேண்டும். பேனர் தலைப்பைச் சுட்டிக்காட்டும் `aria-labelledby` மற்றும் விளக்க உரையைச் சுட்டிக்காட்டும் `aria-describedby` உடன் `role="dialog"` அல்லது `role="alertdialog"` ஐப் பயன்படுத்துங்கள்.

நிற மாறுபாடு

உள்ளடக்க உரை பின்னணிக்கு எதிராக 4.5:1 மாறுபாட்டைப் பூர்த்தி செய்ய வேண்டும்; பெரிய உரை (18pt+ அல்லது 14pt தடித்த) 3:1 தேவை. பொத்தான் உரை, ஐகான்கள், கவனக் குறிகாட்டிகள் அனைத்திற்கும் தங்கள் சொந்த மாறுபாட்டுக் குறைந்தபட்சங்கள் உள்ளன. வெள்ளை பின்னணியில் ஒரு வெளிர்-சாம்பல் «நிராகரி» பொத்தான் தணிக்கைகளில் நாங்கள் காணும் அடிக்கடி வரும் WCAG தோல்வி.

நிறம் மட்டுமேயான குறிப்புகள் வேண்டாம்

«ஏற்க» மற்றும் «நிராகரி»-யை வேறுபடுத்த நிறத்தை மட்டுமே நம்பாதீர்கள். நிறக்குருடு உள்ள பயனர்கள் பொத்தான்களை வேறுபடுத்த வேறுபட்ட லேபிள்கள், ஐகான்கள், அல்லது வடிவங்களைப் பயன்படுத்துங்கள்.

இருண்ட வடிவங்களும் அணுகல்தன்மையும்

WCAG 2.2 இருண்ட வடிவங்களை நேரடியாக இலக்காகக் கொண்ட புதிய அளவுகோல்களை அறிமுகப்படுத்துகிறது — குறிப்பாக ஒப்புதலுக்கு பொருத்தமானவை:

• 3.3.8 அணுகக்கூடிய அங்கீகாரம் — ஒப்புதல் உராய்வாக அறிவாற்றல் புதிர்களைத் தடைசெய்கிறது.
• 3.3.7 மீண்டும் உள்ளீடு — ஒப்புதலைத் திரும்பப் பெற மட்டும் பயனர்கள் தகவலை மீண்டும் உள்ளிட வேண்டியதில்லை.
• 2.4.11 கவனம் மறைக்கப்படவில்லை — பேனரே அதன் பின்னால் உள்ள உறுப்புகளின் கவனக் குறிகாட்டியை மறைக்கக் கூடாது.
• 2.5.7 இழுக்கும் இயக்கங்கள் — உங்கள் பேனர் இழுத்து-ஏற்கும் தொடர்பைப் பயன்படுத்தினால், ஒற்றை-சுட்டி மாற்று இருக்க வேண்டும்.

RTL மற்றும் சர்வதேசமயமாக்கல்

அணுகல்தன்மை வலமிருந்து இடம் எழுத்து மொழிகளுக்கும் (அரபு, ஹீப்ரு, பாரசீகம், உருது) திரை வாசிப்பி உச்சரிப்புக்கும் நீள்கிறது:

• ஆவண மொழி RTL ஆக இருக்கும்போது பேனரில் `dir="rtl"` அமைக்கவும் இதனால் பொத்தான் வரிசையும் கவன ஓட்டமும் வாசிப்புத் திசையுடன் பொருந்தும்.
• மொழிபெயர்க்கப்பட்ட பேனர் நகலில் சரியான `lang` பண்புக்கூறுகளைப் பயன்படுத்துங்கள் இதனால் திரை வாசிப்பிகள் சொற்களைச் சரியான ஒலியியலுடன் உச்சரிக்கும்.
• ஐகான்களை பிரதிபலிக்கவும் — செவ்ரான்கள், அம்புகள், முன்னேற்றக் குறிகாட்டிகள் RTL உள்ளூர்மொழிகளுக்குப் புரட்ட வேண்டும்.

WCAG இணக்கத்திற்கு உங்கள் பேனரைச் சோதித்தல்

ஒரே கருவியை நம்பாதீர்கள். தானியங்கு ஸ்கேனிங்கை உண்மையான உதவித் தொழில்நுட்பச் சோதனையுடன் இணைக்கவும்:

• axe DevTools அல்லது Lighthouse — சுமார் 30–40% WCAG தோல்விகளைத் தானாகப் பிடிக்கின்றன.
• Windows-இல் NVDA அல்லது JAWS, Mac/iOS-இல் VoiceOver, Android-இல் TalkBack — உண்மையான திரை வாசிப்பிகளுடன் சோதிக்கவும். திரை வாசிப்பியை மட்டுமே பயன்படுத்தி பேனரை அறிவிக்க, வழிசெலுத்த, மூட முடியுமா?
• விசைப்பலகை மட்டும் வழிசெலுத்தல் — உங்கள் மவுஸைக் கழற்றுங்கள். நீங்கள் ஏற்க, நிராகரிக்க, விருப்பங்களை நிர்வகிக்க முடியாவிட்டால், விசைப்பலகை பயனர்களாலும் முடியாது.
• நிறக்குருடு உருவகப்படுத்துதல் — Chrome DevTools-இல் உள்ளமைக்கப்பட்ட பார்வைக் குறைபாடு உருவகப்படுத்திகள் உள்ளன. ப்ரோட்டானோபியா, டியூட்டரனோபியா, ட்ரிட்டனோபியாவின் கீழ் «ஏற்க» மற்றும் «நிராகரி» வேறுபடுத்தக்கூடியதா எனச் சரிபார்க்கவும்.
• 400% வரை பெரிதாக்கல் — கிடைமட்ட உருளல் இல்லாமல் 400% பெரிதாக்கலில் உள்ளடக்கம் பயன்படுத்தக்கூடியதாக இருக்க வேண்டும் என்று WCAG கோருகிறது. நிலையான-நிலை பேனர்கள் பெரும்பாலும் இந்தச் சோதனையில் தோல்வியடைகின்றன.

நாங்கள் காணும் பொதுவான அணுகல்தன்மை தோல்விகள்

• பல் சக்கர ஐகானுக்குப் பின்னால் மறைக்கப்பட்ட நிராகரி — இருண்ட வடிவம் மற்றும் அணுகல்தன்மை தோல்வி (ஐகான் பொத்தானில் அணுகக்கூடிய பெயர் இல்லை).
• கவனம் ஒருபோதும் பேனரை அடையாது — காட்சி கவனத்தைத் திருடும் ஆனால் Tab வரிசையில் தவிர்க்கப்படும் பேனர்கள்.
• கவனம் சிக்கவைத்தல் இல்லாத மாடல் பேனர் — பேனர் தொடர்பைத் தடுப்பதாகக் கூறும்போது பயனர்கள் பின்னணிப் பக்கத்திற்கு Tab செய்யலாம்.
• விருப்ப மாற்றங்களில் `aria-live` இல்லை — திரை வாசிப்பி பயனர்கள் தங்கள் தேர்வு சேமிக்கப்பட்டதற்கான உறுதிப்படுத்தலைக் கேட்கவில்லை.
• `lang` பண்புக்கூறு இல்லாத மொழிபெயர்க்கப்பட்ட பேனர்கள் — திரை வாசிப்பிகள் ஸ்பானிஷ் நகலை ஆங்கில ஒலியியலுடன் உச்சரிக்கின்றன.

FlexyConsent அணுகல்தன்மையை எவ்வாறு வழங்குகிறது