HTML5辅助功能/ ARIA：我应该在翻译的文章中使用什么角色？

我想改善我正在处理的博客中的辅助功能。该博客是双语的，默认情况下以匈牙利文出现。点击标志会触发语言更改（JavaScript会从class=js-en中删除nodisplay类，并将其与class=js-hu添加到div中）。HTML5辅助功能/ ARIA：我应该在翻译的文章中使用什么角色？

我想分开每篇文章的两个部分。我曾考虑过使用<aside>，但它不准确（当用英文查看时，它也是主要的博客内容）。

你有什么建议来提高可访问性，有效的标签和ARIA角色？

帖子是这个样子：
[编辑：改<div class="js-en nodisplay">到<div class="js-en" hidden>]

<article> 
 
    
 
    <div class="js-hu"> <!-- blog post in Hungarian --> 
 
    <p> 
 
     magyar szöveg, nem értenéd 
 
    </p> 
 
    </div> 
 

 
    <div class="js-en" hidden> <!-- blog post in English --> 
 
    <p> 
 
     same text in English 
 
    </p> 
 
    </div> 
 
    
 
</article>

来源

2016-05-18 c0derabbit

是不是更多的lang属性的作用是什么？

另一方面，您可以使用:lang pseudo-class根据语言设置内容的样式。

来源

2016-05-18 03:50:15 Knu

嗯，我没有想到这一点。这可能就是我正在寻找的。 '：lang'也会有用。感谢那！ – c0derabbit

虽然lang属性是通信的重要组成部分，但它并不代表您的问题的答案。

对于通信的可访问性的变化，你可以使用一个WAI-ARIA 状态，不是作用。在这种情况下，要更改每个元素的状态是aria-hidden属性。

但是，使用html hidden属性为您做。根据W3C的ARIA in HTML草案规范，咏叹调隐藏状态会自动反映hidden属性。因此，当您已经使用隐藏属性时，不需要进一步的更改。

来源

2016-05-18 07:15:26 Alohci

'lang'属性是问题的完美答案*“您对提高可访问性有什么建议？”*。无可否认。你不会仅仅依靠'hidden'属性来传达语言的变化。 – Adam

@Adam - 真的，这就是为什么我说lang属性很重要。但是设置隐藏属性会传达* change *，它引导AT告诉用户新的可见文本。 – Alohci

HTML5辅助功能/ ARIA：我应该在翻译的文章中使用什么角色？

回答

相关问题