[1.11.2] - better accessibility in HTML page

This commit is contained in:
Cyrille L 2024-01-11 17:37:59 +01:00
parent b296223ec7
commit 3046899ae9
7 changed files with 68 additions and 57 deletions

View File

@ -8,6 +8,9 @@ Tyto - Littérateur
# CURRENTLY IN DEV (in devel branch) ! # CURRENTLY IN DEV (in devel branch) !
## [1.11.2]
- better HTML code for accessibility
## [1.11.1] ## [1.11.1]
- [help article]: added div box help - [help article]: added div box help
- fix meta keywords, including domain tags in HTML pages - fix meta keywords, including domain tags in HTML pages

2
debian/control vendored
View File

@ -1,5 +1,5 @@
Package: tyto Package: tyto
Version: 1.11.1 Version: 1.11.2
Section: custom Section: custom
Priority: optional Priority: optional
Architecture: all Architecture: all

View File

@ -1,6 +1,6 @@
#!/usr/bin/env python3 #!/usr/bin/env python3
# version: 1.11.1 # version: 1.11.2
# date: 2024-01-08 1704734310 # date: 2024-01-11 1704988389
# Tyto - Littérateur # Tyto - Littérateur
# Copyright (C) 2023 Cyrille Louarn <echolib+tyto@a-lec.org> # Copyright (C) 2023 Cyrille Louarn <echolib+tyto@a-lec.org>

View File

@ -280,11 +280,14 @@ def set_footer_raw(mod):
# ---------------------------------- " # ---------------------------------- "
footer_menu = "<!-- Links from domain configuration [WEBSITE_FOOTER] -->" footer_menu = "<!-- Links from domain configuration [WEBSITE_FOOTER] -->"
footer_link = \ footer_link = \
'\n<li class="footer_item">' + \ '\n<li role="listitem" class="footer_item">' + \
'<a class="footer_item_link" href="%s" title="%s %s">%s</a>' + \ '<a class="footer_item_link" href="%s" title="%s %s">%s</a>' + \
'</li>' '</li>'
for key, value in domain.cf.items("WEBSITE_FOOTER"): for key, value in domain.cf.items("WEBSITE_FOOTER"):
if not value:
continue
try: try:
tupvalues = ast.literal_eval(value) tupvalues = ast.literal_eval(value)
footer_menu = footer_menu + \ footer_menu = footer_menu + \
@ -315,10 +318,11 @@ def set_footer_raw(mod):
tyto_site_link = "https://tyto.echolib.re/" tyto_site_link = "https://tyto.echolib.re/"
tyto_code_link = "https://forge.a-lec.org/echolib/tyto-litterateur" tyto_code_link = "https://forge.a-lec.org/echolib/tyto-litterateur"
footer_tyto = \ footer_tyto = \
'%s <a class="footer_cr_link" href="%s" title="%s">'%( '%s <a role="link" class="footer_cr_link" href="%s" title="%s">'%(
langs.site.tyto_credit, tyto_site_link, langs.site.off_website) + \ langs.site.tyto_credit, tyto_site_link, langs.site.off_website) + \
'Tyto - Littérateur' + \ 'Tyto - Littérateur' + \
'</a> [<a class="footer_cr_link" href="%s" title="Tyto - Littérateur">'%tyto_code_link + \ '</a> [<a role="link" class="footer_cr_link" href="%s" '%tyto_code_link + \
'title="Tyto - Littérateur">' + \
'%s'%langs.site.source_code + \ '%s'%langs.site.source_code + \
'</a>]' '</a>]'
@ -360,21 +364,21 @@ def set_footer_raw(mod):
#----------------------------# #----------------------------#
def create_htmls(mod): def create_htmls(mod):
html_file = "<!-- %s from user file configuration: %s.raw -->"%(mod, mod) html_file = "<!-- %s from user file configuration: %s.raw -->"%(mod, mod)
if mod == "navbar": if mod == "navbar":
html_file = create_navbar_html(html_file) html_file = create_navbar_html(html_file)
elif mod == "sidebar": elif mod == "sidebar":
html_file = create_sidebar_html(html_file) html_file = create_sidebar_html(html_file)
else: else:
with open(files[mod]["wrk"], "r") as f: with open(files[mod]["wrk"], "r") as f:
for line in f.read().rsplit("\n"): for line in f.read().rsplit("\n"):
if not line or line.isspace() or line.lstrip().startswith("#"): if not line or line.isspace() or line.lstrip().startswith("#"):
continue continue
html_file = "%s\n%s"%(html_file, line) html_file = "%s\n%s"%(html_file, line)
tools.create_file(files[mod]["wip"], html_file) tools.create_file(files[mod]["wip"], html_file)
debug.out(250, mod, files[mod]["wip"], True, 0, False) debug.out(250, mod, files[mod]["wip"], True, 0, False)
@ -565,7 +569,7 @@ metas_raw = """
# Header # # Header #
#--------# #--------#
header_raw = """ header_raw = """
<a id="site_link" href="/" title="%s"> <a role="link" id="site_link" href="/" title="%s">
<header id="header"> <header id="header">
<div id="header_logo"> <div id="header_logo">
<img id="header_logo_image" src="%s" alt="%s"> <img id="header_logo_image" src="%s" alt="%s">
@ -583,12 +587,12 @@ header_raw = """
#--------# #--------#
navbar_html = """ navbar_html = """
<nav id="menu" aria-labelledby="navigation-1"> <nav id="menu" aria-labelledby="navigation-1">
<menu id="menu_items"> <menu role="menu" id="menu_items">
%s %s
</menu> </menu>
</nav> </nav>
""" """
navbar_link = '<li class="menu_item">' + \ navbar_link = '<li role="menuitem" class="menu_item">' + \
'<a class="menu_link" href="%s" title="%s">%s</a>' + \ '<a class="menu_link" href="%s" title="%s">%s</a>' + \
'</li>' '</li>'
@ -597,16 +601,18 @@ navbar_link = '<li class="menu_item">' + \
#---------# #---------#
sidebar_html = """ sidebar_html = """
<aside id="sidebar"> <aside id="sidebar">
<h2 id="sidebar_title">%s</h2> <div id="sidebar_title">%s</div>
<nav id="sidebar_menu" aria-labelledby="navigation-2"> <nav role="navigation" id="sidebar_menu" aria-labelledby="navigation-2">
<ul id="sidebar_items"> <ul role="list" id="sidebar_items">
%s %s
</ul> </ul>
</nav> </nav>
</aside> </aside>
""" """
sidebar_item = """<li class="sidebar_item"> sidebar_item = """<li class="sidebar_item">
<h3 class="sidebar_post_title"><a class="sidebar_post_link" href="%s">%s</a></h3> <div class="sidebar_post_title">
<a role="link" class="sidebar_post_link" href="%s">%s</a>
</div>
<div class="sidebar_post_about"> <div class="sidebar_post_about">
<p class="sidebar_post_about_p" title="%s -- %s, %s">%s</p> <p class="sidebar_post_about_p" title="%s -- %s, %s">%s</p>
</div> </div>
@ -617,13 +623,13 @@ sidebar_item = """<li class="sidebar_item">
#--------# #--------#
footer_raw = """ footer_raw = """
<footer id="footer"> <footer id="footer">
<h2 id="footer_title">%s %s</h2> <div id="footer_title">%s <strong>%s</strong></div>
<div id="footer_about_menu"> <div id="footer_about_menu">
<div id="footer_about"> <div id="footer_about">
%s %s
</div> </div>
<nav id="footer_menu" aria-labelledby="navigation-3"> <nav id="footer_menu" aria-labelledby="navigation-3">
<ul id="footer_items"> <ul role="list" id="footer_items">
%s %s
</ul> </ul>
</nav> </nav>

View File

@ -180,7 +180,7 @@ template = """<!-- %s - %s (page generated by Tyto - Littérateur) -->
<time datetime="%s"> <time datetime="%s">
<header id="article_header"> <header id="article_header">
%s %s
<h1 id="article_title"> <h1 role="heading" aria-level="1" id="article_title">
<a id="article_title_link" href="%s" title="%s -- %s, %s">%s</a> <a id="article_title_link" href="%s" title="%s -- %s, %s">%s</a>
</h1> </h1>
%s %s

View File

@ -193,11 +193,13 @@ def titles():
# loop into titles: first the the longer length # loop into titles: first the the longer length
for title in sorted_titles: for title in sorted_titles:
n = int(title[1]) + 1
line = HTMLs["title"]%( line = HTMLs["title"]%(
(int(title[1]) + 1), # #"1" = h"2"... n,
n, # #"1" = h"2"...
titles[title], domain.web["css"], # nbr fot toc_X CSS ID titles[title], domain.web["css"], # nbr fot toc_X CSS ID
title[3:], # title without marker title[3:], # title without marker
(int(title[1]) + 1) # </h of marker ID> n # </h of marker ID>
) )
replace_article(title, line) replace_article(title, line)
@ -257,10 +259,10 @@ def toc():
else: tyto_list = "%s\n%s"%(tyto_list, line) else: tyto_list = "%s\n%s"%(tyto_list, line)
l = convert_list(tyto_list, mark_ul, mark_ol) l = convert_list(tyto_list, mark_ul, mark_ol)
l = l.replace(">", ' class="toc_items">', 1) # First ul> or ol> l = l.replace(">", ' role="list" class="toc_items">', 1) # First ul> or ol>
l = l.replace("<li>", ' <li class="toc_item">') l = l.replace("<li>", ' <li role="listitem" class="toc_item">')
l = '<h2 class="toc_title">%s</h2>\n'%langs.site.toc + \ l = '<h2 role="heading" aria-level="2" class="toc_title">%s</h2>\n'%langs.site.toc + \
'<nav class="toc" aria-labelledby="navigation-0">\n' + \ '<nav role="navigation" class="toc" aria-labelledby="navigation-0">\n' + \
'%s'%l + \ '%s'%l + \
'</nav>' '</nav>'
@ -294,8 +296,8 @@ def lists():
else: tyto_list = "%s\n%s"%(tyto_list, line) else: tyto_list = "%s\n%s"%(tyto_list, line)
cl = convert_list(tyto_list, mark_ul, mark_ol) cl = convert_list(tyto_list, mark_ul, mark_ol)
cl = cl.replace(">", ' class="%s">'%css, 1) cl = cl.replace(">", ' role="list" class="%s">'%css, 1)
cl = cl.replace("<li>", ' <li class="%s">'%css) cl = cl.replace("<li>", ' <li role="listitem" class="%s">'%css)
replace_article(l, cl) replace_article(l, cl)
@ -793,30 +795,30 @@ def create_db():
# HTML (generic values) # # HTML (generic values) #
#-----------------------# #-----------------------#
HTMLs = { HTMLs = {
"link" : '<a class="%s" href="%s" title="%s">%s</a>', "link" : '<a role="link" class="%s" href="%s" title="%s">%s</a>',
"file" : '<a class="%s file" href="%s" title="%s">%s</a>', "file" : '<a role="link" class="%s file" href="%s" title="%s">%s</a>',
"abbr" : '<abbr class="%s" title="%s" lang="%s">%s</abbr>', "abbr" : '<abbr class="%s" title="%s" lang="%s">%s</abbr>',
"title" : '<h%s id="toc_%s" class="%s">%s</h%s>', "title" : '<h%s role="heading" aria-level="%s" id="toc_%s" class="%s">%s</h%s>',
"toc" : '%s <a class="toc_item_link %s" href="#toc_%s">%s</a>', "toc" : '%s <a class="toc_item_link %s" href="#toc_%s">%s</a>',
"strongs" : ('<strong class="%s">', "</strong>"), "strongs" : ('<strong class="%s">', "</strong>"),
"bolds" : ('<b class="%s">', "</b>"), "bolds" : ('<b class="%s">', "</b>"),
"underlines" : ('<u class="%s">', "</u>"), "underlines" : ('<u class="%s">', "</u>"),
"emphasis" : ('<em class="%s">', "</em>"), "emphasis" : ('<em class="%s">', "</em>"),
"italics" : ('<i class="%s">', "</i>"), "italics" : ('<i class="%s">', "</i>"),
"quotes" : ('<q class="%s">', "</q>"), "quotes" : ('<q class="%s">', "</q>"),
"cites" : ('<cite class="%s">', "</cite>"), "cites" : ('<cite class="%s">', "</cite>"),
"icodes" : ('<code class="%s">', "</code>"), "icodes" : ('<code class="%s">', "</code>"),
"anc_links" : ('<a class="%s" href="#%s">', "</a>"), "anc_links" : ('<a class="%s" href="#%s">', "</a>"),
"bquotes" : '<blockquote class="%s"%s%s%s>%s\n%s\n%s%s</blockquote>', "bquotes" : '<blockquote class="%s"%s%s%s>%s\n%s\n%s%s</blockquote>',
"dels" : ('<del class="%s">', "</del>"), "dels" : ('<del class="%s">', "</del>"),
"customs" : ('<span class="%s">', "</span>"), "customs" : ('<span class="%s">', "</span>"),
"image" : '<a class="%s image" href="%s">%s</a>', "image" : '<a role="link" class="%s image" href="%s">%s</a>',
"bcodes" : '<li class="bcode_item">' + \ "bcodes" : '<li role="listitem" class="bcode_item">' + \
'<code class="bcode_code">%s</code>' + \ '<code class="bcode_code">%s</code>' + \
"</li>", "</li>",
"hrs" : '<hr class="%s">', "hrs" : '<hr class="%s">',
"brs" : '<br class="%s">', "brs" : '<br class="%s">',
} }
sl_ptags = { sl_ptags = {
"divs" : ('<div class="%s">', '</div>'), "divs" : ('<div class="%s">', '</div>'),

View File

@ -122,11 +122,11 @@ a.menu_link {}
* Sidebar navbar (Website) * Sidebar navbar (Website)
*/ */
aside#sidebar {} aside#sidebar {}
h2#sidebar_title {} div#sidebar_title {}
nav#sidebar_menu {} nav#sidebar_menu {}
ul#sidebar_items {} ul#sidebar_items {}
li.sidebar_item {} li.sidebar_item {}
h3.sidebar_post_title {} div.sidebar_post_title {}
a.sidebar_post_link {} a.sidebar_post_link {}
div.sidebar_post_about {} div.sidebar_post_about {}
p.sidebar_post_about_p {} p.sidebar_post_about_p {}
@ -136,7 +136,7 @@ p.sidebar_post_about_p {}
* Footer (Website) * Footer (Website)
*/ */
footer#footer {} footer#footer {}
h2#footer_title {} div#footer_title {}
div#footer_about_menu {} div#footer_about_menu {}
div#footer_about {} div#footer_about {}
p#footer_about_p {} p#footer_about_p {}