2011-06-28 6 views

cevap

6

Belirli elemanın bilmek veya bağlamak için öznitelik, ancak ARIA niteliğini aria-describedby kullanarak bunu yapabilirsiniz yoktur:

<label for="firstname">First Name</label> 
<input type="text" id="firstname" aria-describedby="firstname-explanation" /> 
<p id="firstname-explanation">e.g. John</p> 

Ama label her şeyi dahil olmak üzere iyi görünüyor bana da (aynı zamanda bir - semantik - konteyner gibi iyi tasarım yetenekleri verir):

Ya da iki'u bile karıştırabilirsiniz.

başka bir yaklaşım (@Alohci önerdiği gibi veya placeholder) title içinde input elemanın niteliğini açıklamasını koymak olabilir (anlamsal bu nitelendirerek biridir), ancak bu durumda bunu eklemek zorunda Javascript ile işaretleme (veya @Alohci tarafından önerilen input:after { content : "e.g. " attr(placeholder) } kullanarak CSS).

+0

Bu işe yarayabilir. Bunu doğru olarak işaretlemeden önce ansiklopedik bilgi birikimine sahip herhangi bir HTML uzmanının kesin bir cevap verebileceğini görmek için bir süre bekleyeceğim. –

+2

aria-describeby cesur bir girişimdir, ancak birkaç problemi vardır. İlk olarak, HTML5 özellikleri, aria özniteliklerinin tarayıcıya * yalnızca içeriğin platformun erişilebilirlik API'sine nasıl içerik vermesi gerektiği ve anlamsal bilgileri iletmediği yönergelerinin * * direktifleri olduğunu açıkça belirtir. İkincisi, örnekler açıklama değildir. İdeal anlamsal bir çözüm, örneklerin yer tutucu niteliklerini oluşturmak ve bunları sorguda gösterildiği gibi giriş kutusunun dışında şekillendirmek olabilir, fakat bu şimdi değil, gelecek için. Şimdilik, ikinci bir '

+0

@Alohci Söylediğiniz çoğu şeye katılıyorum. Bazen bir örnekle bir şeyi en iyi şekilde tanımlayabilirsiniz ('yer tutucu' hala geçerli bir fikirdir, ancak burada 'başlık' ile aynı sorunu vardır). En iyi sonuç için, önerilen 2 'etiketinin yerine, her şeyin etrafında bir' etiket 'ile devam ediyorum (ki bu tam olarak geçerli). – kapa

İlgili konular