İki giriş için tek etiket

Question

Şu anda bir forma bir tarih girişi ekliyorum. Bir 'Başlangıç ​​Tarihi' ve 'Bitiş Tarihi' girdim ancak her iki giriş için sadece tek bir etiket ('Tarihler') kullanmak istiyorum.

Bunu yapmak mümkün mü? Erişilebilirlik endişeleri nelerdir?

Şu anki düşüncem, gösterilen 'Tarihler' etiketinin ekran okuyucular için her giriş için iki gizli etiketine sahip olması. Bu yol gitmek için mi? Bu tür şeyleri yapan büyük web sitelerinin örnekleri var mı? (Mümkünse Hükümet internet siteleri)?

Bu, bir devlet kurumu tarafından kullanıcı olabilecek bir projedir, bu nedenle erişilebilirliğe uygun olarak katı kurallar vardır.

Answer 1

benzer bir şey aracılığıyla CSS kullanarak sayfanın dışına ayarlanabilir Ben en iyi işaretlemeyi düşünüyorum

HTML

: etiketler, "Öpücük" için legend kullanın fieldset yılında girdi sarın hem inputs için labels kullanabilir ve gizlemek olurdu

CSS

Ayrıca

fieldset { 
    border: none; 
} 
label { 
    margin-left: -999em; 
} 
input { 
    display: block; 
} 

Fiddle here

bkz: WCAG 2, H71: Providing a description for groups of form controls using fieldset and legend elements

Answer 2

Buradaki sorun, her etiket için yalnızca bir tane for belirtebilmenizdir. Erişilebilirlik amaçları için, her bir tarih için iki adet labels birini göstermenin en iyi olacağını düşünürdüm. Bu şekilde, bir ekran okuyucu kullanan herkes vb. Her giriş için geçerli bir etiket alır.

<label for="x">x name</label><input name="x"/> 
<label for="y">y name</label><input name="y"/> 

Answer 3

Bence en iyi bahis, her girişe bir etiket eklemektir. Sonra aslında sayfada görüntülemek istemiyorsanız etiket için basitçe

.hide { 
    position: absolute; 
    left: -9999em; 
} 

... ya da bu durumda