WCAG Başarı Kriterleri · Level A

WCAG 2.5.2: İşaretçi İptali

WCAG 2.5.2, tek bir işaretçi (fare, dokunma veya kalem) ile tetiklenen işlevlerin iptal edilebilmesini veya geri alınabilmesini, böylece kazara etkinleştirmelerin önlenmesini gerektirir. Bu, istemeden dokunma veya tıklama yapabilen motor bozuklukları olan kullanıcıları korur.

Bu Kuralın Anlamı

WCAG 2.5.2 İşaretçi İptali, tek bir işaretçi kullanılarak işletilen tüm işlevsellik için geçerlidir — buna fare tıklamaları, dokunmatik ekran dokunuşları, kalemle basmalar ve ekrandaki bir noktayı etkinleştiren diğer tüm giriş cihazları dahildir. Bu ölçüt, istenmeyen bir basma veya dokunma sonucu oluşan kazara etkinleştirmelerin, etkilerini göstermeden önce geri alınabilmesini sağlamak için vardır.

Tek işaretçili bir etkileşimin bu ölçüte uygun olması için, WCAG spesifikasyonunda tanımlanan aşağıdaki dört koşuldan en az birini sağlaması gerekir:

  • Aşağı-Olay Yok: İşlevsellik aşağı-olayında tetiklenmez (örneğin, mousedown, touchstart veya pointerdown). Etkinleştirme yalnızca yukarı-olayında (mouseup, touchend veya pointerup) gerçekleşir.
  • İptal veya Geri Alma: Eylemi tamamlanmadan önce iptal etmek veya tamamlandıktan sonra geri almak için bir mekanizma mevcuttur.
  • Yukarı Tersleme: Yukarı-olayı, aşağı-olayında tetiklenen herhangi bir sonucu tersine çevirir — örneğin, işaretçi hedefin dışında bırakıldığında başlangıç konumuna geri dönen bir sürükleme işlemi.
  • Temel İstisna: Aşağı-olayında tetikleme, işlevsellik için temeldir — örneğin, tuşa basıldığı anda sesin başlaması gereken ekrandaki bir piyano klavyesi. Ancak bu istisna çok dardır ve yalnızca aşağı-olayının zamanlaması gerçekten temel bir gereklilik olduğunda geçerlidir.

Pratik HTML ve JavaScript açısından bu, geliştiricilerin olay dinleyicilerini nereye ekledikleri konusunda dikkatli olmaları gerektiği anlamına gelir. mousedown, touchstart veya pointerdown kullanarak bir eylemi — bir formu göndermek, bir kaydı silmek veya bir sayfadan ayrılmak gibi — derhal ve geri döndürülemez şekilde yürütmek ve bu eylemi iptal etmek veya geri almak için herhangi bir yol sunmamak, bu ölçütün açık bir ihlalidir. Yerel <button> ve <a> öğeleri için standart tarayıcı davranışı, varsayılan olarak etkinleştirmeyi yukarı-olayında tetikler; bu da doğru şekilde uygulanmış yerel kontrollerin genellikle ek çaba gerekmeksizin bu ölçütü karşıladığı anlamına gelir.

JavaScript ile oluşturulan özel etkileşimli bileşenler — sürükle-bırak arayüzleri, jest tabanlı kaydırıcılar, karusel kontrolleri ve resim haritaları gibi — en yaygın hata kaynaklarıdır. Geri alma veya iptal imkânı sunmadan geri döndürülemez mantığı bir aşağı-olayı dinleyicisine bağlayan herhangi bir bileşen bu ölçütte başarısız olur.

Neden Önemlidir

İşaretçi İptali öncelikle motor engeli olan kullanıcıları korumak için tasarlanmış bir ölçüttür, ancak faydaları titreme, spastisite, sınırlı ince motor kontrolü veya dikkat ve hassasiyeti etkileyen bilişsel engelleri olanlar da dahil olmak üzere geniş bir kullanıcı yelpazesine yayılır.

Bir dokunmatik ekranda bir e-ticaret ödeme sayfasında gezinmekte olan Parkinson hastalığı olan bir kullanıcıyı düşünün. El titremesi, parmağının istemeden bir “Satın Almayı Onayla” düğmesine gelmesine neden olabilir. Eğer satın alma, parmak ekrana dokunduğu anda — touchstart olayında — tetiklenirse, işlem iptal etme imkânı olmadan anında işlenir. Etkinleştirme touchend olayına bağlı olsaydı, kullanıcı parmağını kaldırmadan önce düğmeden uzaklaştırarak eylemi iptal edebilirdi. Yukarı-olayı ve aşağı-olayı bağlama arasındaki bu basit fark, milyonlarca kullanıcı için sinir bozucu bir deneyim ile erişilebilir bir deneyim arasındaki fark anlamına gelebilir.

Dünya Sağlık Örgütü’ne göre, dünya genelinde yaklaşık 1,3 milyar insan bir tür engelle yaşamaktadır ve motor engeller bu nüfusun önemli bir bölümünü temsil etmektedir. Engelliliğin ötesinde, kazara etkinleştirmeler küçük dokunmatik ekranlı cihazlarda herhangi bir kullanıcı için yaygın bir sıkıntı kaynağıdır; bu da bu ölçütü genel kullanılabilirlik açısından da ilgili kılar.

Bilişsel engellilik de önemli bir husustur. Bilgiyi daha yavaş işleyen kullanıcılar bir düğmeye basıp ardından yanlış seçeneği seçtiklerini fark edebilirler. Eylem geri döndürülemez ise — aşağı-olayında tetikleniyorsa — hiçbir çareleri yoktur. Bir geri alma mekanizması veya yukarı-olayı etkinleştirmesi, bu kullanıcılara niyetlerini teyit etmek için ihtiyaç duydukları zamanı verir.

İş açısından bakıldığında, kazara form gönderimlerini, satın almaları ve silmeleri azaltmak kullanıcı memnuniyetini artırır, destek taleplerini azaltır ve işlem terk etme oranlarını düşürür. Erişilebilir bir işaretçi etkileşim modeli, Türkiye’de ve uluslararası alanda erişilebilirlik düzenlemeleri kapsamında hukuki sorumluluk riskini de azaltır.

İlgili Axe-core Kuralları

WCAG 2.5.2 manuel test gerektirir ve yalnızca otomatik erişilebilirlik tarayıcılarıyla güvenilir şekilde değerlendirilemez. Bu ölçüte doğrudan karşılık gelen belirli bir axe-core otomatik kuralı yoktur. Otomatik tespitin neden yetersiz olduğuna dair açıklama şöyledir:

  • İşaretçi iptali için otomasyonun neden başarısız olduğu: axe-core gibi otomatik araçlar HTML’yi ayrıştırabilir ve belirli ARIA veya yapısal sorunları tespit edebilir, ancak JavaScript olay işleyicilerinin anlamsal niyetini ve geri döndürülebilirliğini güvenilir şekilde belirleyemezler. Bir araç, bir öğe üzerinde bir mousedown olay dinleyicisi olduğunu tespit edebilir, ancak bu dinleyicinin geri döndürülemez bir eylemi tetikleyip tetiklemediğini, uygulamanın başka bir yerinde bir geri alma mekanizmasının bulunup bulunmadığını veya aşağı-olayı zamanlamasının işlevsellik için gerçekten temel olup olmadığını belirleyemez. Bu ölçütü değerlendirmek için gereken çalışma zamanı davranışı, uygulama durumu ve kullanıcı bağlamı kombinasyonu, statik veya DOM tabanlı otomatik analiz kapsamının ötesindedir.
  • Manuel testçilerin nelere bakması gerektiği: Testçilerin her etkileşimli kontrolle bir işaretçi cihazı kullanarak etkileşime girmesi ve eylemin tam olarak ne zaman tetiklendiğini — basma anında mı yoksa bırakma anında mı — gözlemlemesi gerekir. Ayrıca, işaretçiyi bırakmadan önce öğeden uzaklaştırmanın eylemi iptal edip etmediğini ve etkinleştirmeden sonra erişilebilir bir iptal veya geri alma mekanizmasının bulunup bulunmadığını doğrulamalıdırlar.
  • Otomasyondan gelen kısmi sinyaller: Bazı lint araçları veya özel axe kuralları, onmousedown, ontouchstart veya onpointerdown özniteliklerine sahip öğeleri inceleme gerektiren öğeler olarak işaretleyebilir, ancak bu işaretler uygunluk veya uygunsuzluk hakkında karar vermek için insan yargısı gerektirir. Bu tür otomatik işaretleri, kesin bir başarısızlık raporu değil, manuel inceleme için bir uyarı olarak değerlendirin.

Nasıl Test Edilir

  1. Otomatik tarama (ilk inceleme): Sayfadaki etkileşimli öğeleri ve manuel inceleme için işaretlenmiş özel olay bağlamalarını belirlemek için sayfada axe DevTools veya Lighthouse çalıştırın. Chrome DevTools’ta, düğmelere, bağlantılara ve özel kontrollere eklenmiş olay dinleyicilerini incelemek için Elements panelini kullanın — geri döndürülemez eylemleri tetikleyen öğelerde mousedown, touchstart veya pointerdown işleyicilerini arayın.
  2. Fare işaretçisi testi — tıklayıp sürükleyerek iptal: Sayfadaki her etkileşimli düğme, bağlantı ve özel kontrol için, fare düğmesini öğe üzerinde basılı tutun, ardından işaretçiyi öğenin sınırlarının dışına sürükleyip bırakın. Eylem, düğme hâlâ basılıyken (bırakmadan önce) tetiklenirse bu bir başarısızlıktır. Uzaklaştırma, bırakma anında eylemin tetiklenmesini engelliyorsa, bu yukarı-tersleme veya aşağı-olayı yok koşulları için bir geçiştir.
  3. Dokunmatik cihaz testi: Bir dokunmatik ekranlı cihazda veya tarayıcı öykünücüsünde (Chrome DevTools cihaz modu) her etkileşimli öğeye dokunup basılı tutun, ardından parmağınızı kaldırmadan önce uzaklaştırın. Eylem, parmağınız ekrana dokunur dokunmaz (parmağınızı kaldırmadan önce) tetiklenirse, aşağı-olayı zamanlaması temel olmadığı sürece bu bir başarısızlıktır. Parmağınızı öğenin dışında kaldırmanın eylemi tetiklemediğini doğrulayın.
  4. Klavye kontrolü kontrolü: Bu ölçüt özellikle işaretçi etkileşimleriyle ilgili olsa da, tüm etkileşimli öğelerin klavye ile de çalıştırılabildiğini doğrulayın. Her öğeye odaklanmak için Tab tuşuna ve etkinleştirmek için Enter veya Space tuşuna basın; öğenin işaretçi olmadan erişilebilir ve işlevsel olduğunu doğrulayın — bu, daha geniş erişilebilirlik resmini destekler.
  5. Geri alma/iptal mekanizması doğrulaması: Aşağı-olaylarına bağlı eylemler için (temel istisnanın geçerli olabileceği durumlarda), açık bir geri alma veya iptal mekanizmasının bulunduğunu ve yardımcı teknolojiler kullananlar da dahil olmak üzere tüm kullanıcılar için erişilebilir olduğunu doğrulayın. Örneğin, bir sürükle-bırak eyleminden sonra, klavye ve ekran okuyucu ile erişilebilen bir “geri al” düğmesi var mı?
  6. Ekran okuyucu ve işaretçi kombinasyon testi (NVDA + Firefox, JAWS + Chrome, VoiceOver + Safari): Etkileşimli öğeleri hem işaretçiyle hem de ekran okuyucunun sanal imleciyle etkinleştirin. İşaretçiyle tetiklenen eylemlerin ekran okuyucuyla tetiklenen eylemlerle tutarlı olduğunu ve beklenmedik şekilde anında geri döndürülemez eylemler tetiklenmediğini doğrulayın.
  7. Kod incelemesi: Kod tabanında olay dinleyici bağlamalarını arayın: addEventListener('mousedown', addEventListener('touchstart', addEventListener('pointerdown' ve satır içi onmousedown, ontouchstart öznitelikleri. Her bir örnek için, işleyicinin geri döndürülemez bir eylemi tetikleyip tetiklemediğini ve dört WCAG koşulundan herhangi birinin karşılanıp karşılanmadığını değerlendirin.

Nasıl Düzeltilir

mousedown üzerinde geri döndürülemez eylem — Hatalı

<!-- BAŞARISIZ: Silme işlemi mousedown üzerinde hemen tetikleniyor, iptal mümkün değil -->
<button onmousedown='deleteRecord(recordId)'>Kaydı Sil</button>

<script>
function deleteRecord(id) {
  // Kayıt, kullanıcı bırakmadan önce düğmeye basar basmaz siliniyor
  fetch('/api/records/' + id, { method: 'DELETE' });
}
</script>

mousedown üzerinde geri döndürülemez eylem — Doğru

<!-- GEÇER: Silme işlemi tıklamada (yukarı-olayı) tetikleniyor, yerel düğme davranışı -->
<button onclick='deleteRecord(recordId)'>Kaydı Sil</button>

<!-- Daha da iyisi: ek bir iptal mekanizması olarak onay iletişim kutusu sağla -->
<button onclick='confirmDelete(recordId)'>Kaydı Sil</button>

<script>
function confirmDelete(id) {
  // Kullanıcı iletişim kutusu üzerinden iptal edebilir — İptal veya Geri Alma koşulunu karşılar
  if (confirm('Bu kaydı silmek istediğinizden emin misiniz? Bu işlem geri alınamaz.')) {
    fetch('/api/records/' + id, { method: 'DELETE' });
  }
}
</script>

Dokunma hareketi touchstart üzerinde tetikleniyor — Hatalı

<!-- BAŞARISIZ: Eylem touchstart üzerinde hemen tetikleniyor, iptal imkânı yok -->
<div id='buy-btn'>Şimdi Satın Al</div>

<script>
document.getElementById('buy-btn').addEventListener('touchstart', function() {
  // Parmak öğeye dokunduğu anda satın alma başlatılıyor
  initiatePurchase();
});
</script>

Dokunma hareketi touchstart üzerinde tetikleniyor — Doğru

<!-- GEÇER: Yerel bir düğme kullan ve tıklamaya bağla; tıklama touchend üzerinde tetiklenir -->
<button id='buy-btn'>Şimdi Satın Al</button>

<script>
// Yerel bir düğmedeki 'click' olayı yukarı-olayında (touchend/mouseup) tetiklenir
// kullanıcılara parmaklarını kaldırmadan önce uzaklaştırarak iptal etme imkânı verir
document.getElementById('buy-btn').addEventListener('click', function() {
  initiatePurchase();
});
</script>

Yukarı-tersleme olmadan özel sürükle-bırak — Hatalı

<!-- BAŞARISIZ: Öğe pointerup yerine pointerdown üzerinde yeni konuma taşınıyor -->
<div class='draggable' onpointerdown='moveItemToTarget(this)'>
  Beni sürükle
</div>

Yukarı-terslemeli özel sürükle-bırak — Doğru

<!-- GEÇER: Öğe yalnızca işaretçi bırakma alanı üzerinde bırakıldığında hedefe taşınıyor -->
<!-- Kullanıcı bırakmadan önce uzaklaştırırsa, öğe orijinal konumuna döner -->
<div
  class='draggable'
  draggable='true'
  ondragstart='handleDragStart(event)'
>
  Beni sürükle
</div>
<div
  class='drop-zone'
  ondragover='event.preventDefault()'
  ondrop='handleDrop(event)'
  aria-label='Bırakma alanı'
>
  Buraya bırak
</div>

<script>
function handleDragStart(event) {
  // Yalnızca niyeti kaydeder; öğeyi henüz taşımaz
  event.dataTransfer.setData('text/plain', event.target.id);
}
function handleDrop(event) {
  event.preventDefault();
  // Öğe yalnızca bırakma anında (yukarı-olayı eşdeğeri) taşınır
  // Kullanıcı bırakma alanı dışında bırakırsa, öğe başlangıç konumuna döner — yukarı-tersleme sağlanır
  const id = event.dataTransfer.getData('text/plain');
  event.currentTarget.appendChild(document.getElementById(id));
}
</script>

Yaygın Hatalar

  • Form gönderimi, kayıt silme veya gezinme gibi geri döndürülemez eylemleri, varsayılan olarak yukarı-olayında tetiklenen ve sürükleyerek uzaklaştırarak iptale izin veren click yerine mousedown veya pointerdown olaylarına bağlamak.
  • Bir anlık parmak temasının onaylanmış kullanıcı niyeti olarak değerlendirilmemesi gereken e-ticaret veya bankacılık arayüzlerinde, satın alma, onay veya veri değişikliklerini tetiklemek için touchstart kullanmak.
  • Bir düğmenin yerel bir <button> öğesi kullanması nedeniyle ona eklenen tüm JavaScript’in otomatik olarak uyumlu olduğunu varsaymak — addEventListener ile eklenen bir mousedown dinleyicisi, geri döndürülemez bir eylemi tetikliyorsa hâlâ bu ölçütü ihlal eder.
  • Bir işaretçinin aşağı-olayında modal iletişim kutuları, örtüşen katmanlar veya tam sayfa gezinme değişiklikleri çağırmak; bu, kontrolü etkinleştirmek istemeyen ve geri dönme imkânı olmayan kullanıcıların kafasını karıştırır.
  • Bir değeri sunucuya pointerup veya ayrı bir onay eylemini beklemek yerine pointerdown üzerinde işleyen özel kaydırıcı veya aralık kontrolleri uygulamak.
  • Bir aşağı-olayı eylemi için tek geri alma mekanizması olarak tarayıcının varsayılan confirm() iletişim kutusuna güvenmek ve yıkıcı eylem tamamlanmadan önce yardımcı teknolojilerin bu iletişim kutusuna güvenilir şekilde erişip erişemediğini ve onu kullanıp kullanamadığını test etmemek.
  • Bir aşağı-olayı eyleminin beklemede olduğuna dair herhangi bir görsel veya programatik geri bildirim sağlamamak; bu da kullanıcıların, bırakmadan önce işaretçiyi uzaklaştırarak iptal edebileceklerini anlamalarını imkânsız kılar.
  • Temel istisnayı çok geniş yorumlamak — örneğin, gerçek bir zamanlama kısıtı olmadığı ve iddia işlevsel bir zorunluluk değil ürün kolaylığı olduğu hâlde, bir “hızlı satın al” düğmesinin hız için mousedown üzerinde tetiklenmesi gerektiğini iddia etmek.
  • Hem fare hem de dokunmatik giriş cihazlarında test yapmamak — bir arayüz fare etkileşimleri için yukarı-olaylarını doğru kullanabilir, ancak ayrı bir mobil özel kod yolunda geri döndürülemez eylemleri hâlâ touchstart’a bağlayabilir.
  • Yalnızca klavye kısayolu (örneğin, Ctrl+Z) ile erişilebilen geri alma işlevselliği uygulamak ve aşağı-olayı etkinleştirmesinden sonra işaretçiyle etkileşen kullanıcıları iptal mekanizması olmadan bırakmak.

Türkiye’nin Erişilebilirlik Düzenlemeleriyle İlişkisi

21 Haziran 2025 tarihli ve 32933 sayılı Resmî Gazete’de yayımlanan Türkiye Cumhurbaşkanlığı Genelgesi 2025/10, WCAG 2.2 standartlarıyla uyumlu zorunlu web erişilebilirliği gerekliliklerini belirlemektedir. Bu genelge kapsamında, WCAG 2.5.2 İşaretçi İptali de dahil olmak üzere Seviye A ölçütlerine uyum, Türkiye’de dijital hizmetler sunan çok sayıda kamu ve özel sektör kuruluşu için yasal bir zorunluluktur.

Genelge, geniş bir kurum yelpazesini kapsamaktadır. Kamu kurumları ve devlet kuruluşları, genelgenin yayım tarihinden itibaren bir yıl içinde tam Seviye A uyumu sağlamak zorundadır. Düzenleme kapsamındaki özel sektör kuruluşları — e-ticaret platformları, bankalar ve finans kuruluşları, hastaneler ve sağlık hizmeti sağlayıcıları, 200.000 veya daha fazla abonesi olan telekomünikasyon şirketleri, seyahat acenteleri, özel ulaşım şirketleri ve Millî Eğitim Bakanlığı (MEB) tarafından yetkilendirilmiş özel okullar dahil — iki yıllık bir uyum süresine sahiptir.

Bu kapsamdaki kuruluşlar için, İşaretçi İptali’ni doğru şekilde uygulamamak gerçek bir düzenleyici risk taşır. Örneğin, mobil ödeme sayfası ödeme onayını touchstart üzerinde tetikleyen bir Türk e-ticaret platformunu düşünün — böyle bir uygulama, WCAG 2.5.2’nin ve dolayısıyla Cumhurbaşkanlığı Genelgesi’nin doğrudan ihlali anlamına gelir. Titreme, motor engel veya basit bir yanlış dokunma nedeniyle bu platformda kazara satın alma başlatan kullanıcılar, platformun erişilebilirlik yükümlülüklerini yerine getirmediğini ileri sürmek için hukuki dayanağa sahip olacaktır.

Düzenleyici uyumun ötesinde, Türk kuruluşları İşaretçi İptali’nin yalnızca teknik bir onay kutusu değil, kullanıcıların dijital hizmetlerle güvenli ve kasıtlı şekilde etkileşim kurma yeteneğini koruyan temel bir tasarım ilkesi olduğunu kabul etmelidir. Alışveriş sepetlerinden randevu alma sistemlerine ve doküman yönetim araçlarına kadar etkileşimli bileşenlerde yukarı-olayı etkinleştirmesi ve geri alma mekanizmaları uygulamak, yalnızca engelli kullanıcıların değil, tüm kullanıcıların yararına olan kapsayıcı tasarıma bağlılığı gösterir.

Genelgeye tabi kuruluşlar, özellikle mobil uyumlu sayfalarda ve özel etkileşimli bileşenlerde JavaScript olay işleme kalıplarına yönelik sistematik denetimler yapmalı, iptal veya tersleme mekanizması olmayan aşağı-olayı etkinleştirmelerini tespit edip düzeltmelidir. Bu iyileştirme çalışmalarının belgelenmesi, genelgenin yaptırım hükümleri kapsamında gerekebilecek uyum raporlama yükümlülüklerini destekleyecektir.