96 lines
3.4 KiB
Markdown
96 lines
3.4 KiB
Markdown
Here is a patch for page.tmpl to add these landmarks.
|
|
|
|
--[Patrick](https://www.google.com/accounts/o8/id?id=AItOawlnBLXDQbzD3OCcqZshcmExPNwlgD0tJ7A)
|
|
|
|
> This can't be applied as a patch as-is because it's based on Tails'
|
|
> modified `page.tmpl`, but I get the general idea. A reviewer will need
|
|
> to check the ARIA meanings of those roles to confirm that they
|
|
> are appropriate (I haven't done that yet). [[!tag patch]] --[[smcv]]
|
|
|
|
[[!format diff """
|
|
diff --git a/templates/page.tmpl b/templates/page.tmpl
|
|
index 5efad1a..cb76590 100644
|
|
--- a/templates/page.tmpl
|
|
+++ b/templates/page.tmpl
|
|
@@ -30,7 +30,7 @@
|
|
</head>
|
|
<body>
|
|
|
|
-<div class="banner">
|
|
+<div class="banner" role="banner">
|
|
<a class="tails" href="<TMPL_VAR HOMEPAGEURL>">
|
|
<span class="acronym">Tails</span><br/>
|
|
<span class="slogan">The Amnesic Incognito Live System</span>
|
|
@@ -155,20 +155,20 @@
|
|
<TMPL_IF HTML5></section><TMPL_ELSE></div></TMPL_IF>
|
|
|
|
<TMPL_IF SIDEBAR>
|
|
-<TMPL_IF HTML5><aside class="sidebar"><TMPL_ELSE><div class="sidebar"></TMPL_IF>
|
|
+<TMPL_IF HTML5><aside class="sidebar" role="navigation"><TMPL_ELSE><div class="sidebar" role="navigation"></TMPL_IF>
|
|
<TMPL_VAR SIDEBAR>
|
|
<TMPL_IF HTML5></aside><TMPL_ELSE></div></TMPL_IF>
|
|
</TMPL_IF>
|
|
|
|
<div id="pagebody">
|
|
|
|
-<TMPL_IF HTML5><section id="content"><TMPL_ELSE><div id="content"></TMPL_IF>
|
|
+<TMPL_IF HTML5><section id="content" role="main"><TMPL_ELSE><div id="content" role="main"></TMPL_IF>
|
|
<TMPL_VAR CONTENT>
|
|
<TMPL_IF HTML5></section><TMPL_ELSE></div></TMPL_IF>
|
|
|
|
<TMPL_UNLESS DYNAMIC>
|
|
<TMPL_IF COMMENTS>
|
|
-<TMPL_IF HTML5><section id="comments"><TMPL_ELSE><div id="comments"></TMPL_IF>
|
|
+<TMPL_IF HTML5><section id="comments" role="complementary"><TMPL_ELSE><div id="comments" role="complementary"></TMPL_IF>
|
|
<TMPL_VAR COMMENTS>
|
|
<TMPL_IF ADDCOMMENTURL>
|
|
<div class="addcomment">
|
|
@@ -183,7 +183,7 @@
|
|
|
|
</div>
|
|
|
|
-<TMPL_IF HTML5><footer id="footer" class="pagefooter"><TMPL_ELSE><div id="footer" class="pagefooter"></TMPL_IF>
|
|
+<TMPL_IF HTML5><footer id="footer" class="pagefooter" role="contentinfo"><TMPL_ELSE><div id="footer" class="pagefooter" role="contentinfo"></TMPL_IF>
|
|
<TMPL_UNLESS DYNAMIC>
|
|
<TMPL_IF HTML5><nav id="pageinfo"><TMPL_ELSE><div id="pageinfo"></TMPL_IF>
|
|
|
|
"""]]
|
|
|
|
----
|
|
|
|
Here is a review. Please "sign" any responses so we can keep track of
|
|
who is talking to who :-)
|
|
|
|
General points:
|
|
|
|
The `role` attribute is not allowed by the XHTML 1.0 Strict DTD, so we
|
|
should only emit it in HTML5 mode (and we should probably
|
|
[[todo/generate_HTML5_by_default]]).
|
|
|
|
Specific roles:
|
|
|
|
[[!format diff """
|
|
-<div class="banner">
|
|
+<div class="banner" role="banner">
|
|
"""]]
|
|
|
|
There is no such class in IkiWiki's page.tmpl, so this part can't be applied.
|
|
After this is applied to the main IkiWiki, you'll need to talk to the
|
|
maintainers of the Tails wiki about changing that in their fork of the template.
|
|
|
|
[[!format diff """
|
|
-<TMPL_IF HTML5><aside class="sidebar"><TMPL_ELSE><div class="sidebar"></TMPL_IF>
|
|
+<TMPL_IF HTML5><aside class="sidebar" role="navigation"><TMPL_ELSE><div class="sidebar" role="navigation"></TMPL_IF>
|
|
"""]]
|
|
|
|
I don't think the sidebar is *necessarily* navigation, although it's a
|
|
reasonable guess. I would hope that the fact that it's an `<aside>`
|
|
in HTML5 mode is enough to give accessibility tools a clue already?
|
|
Would declaring this to be a `note` be sufficient?
|
|
|
|
I've applied your suggested roles for #main, #comments and #footer,
|
|
but only in HTML5 mode for the reason given above. I have not applied
|
|
a role to the sidebar just yet.
|
|
|
|
--[[smcv]]
|