Download
We're evolving to serve you better! This current forum has transitioned to read-only mode. For new discussions, support, and engagement, we've moved to GitHub Discussions.

Title tag in the Back To Top button

  • #4978
    Avatar photo[anonymous]

    I am using the simple theme. Bing Webmaster tools complains of there being more than one title tag on the page. On examination the first title is in the head tag (no surprises there!) and the second title is in the footer, associated with the Back to Top button. The HTML generated by Publii appears to be correct, but perhaps not quite as accessible as it should be.

    <button class="footer__bttop js-footer__bttop" aria-label="Back to top">
    <svg>
    <title>Back to top</title>
    <use xlink:href="https://www.fullonecommerce.com/assets/svg/svg-map.svg#toparrow"/>
    </svg>
    </button>

    According to this (apparently authoritative) article on accessibility, the use of title is supported when the aria-labelledby attribute is set in the svg tag.

    <button class="menu-trigger" > 
    
        <svg focusable="false" width="24" height="28" viewBox="0 0 24 28"
                role="img" aria-labelledby="svg-title">
            <title id="svg-title"> Menu </title>
            <!-- svg content -->
        </svg>
    
    </button>

    You might want to consider making this small modification. Not sure if this is just a theme mod, or if a Publii change is required.

    #4984
    Avatar photo[anonymous]

    That looks like a bug in Bing webmaster tools. The <title> element is permissible in <svg> documents. And html5 documents can contain <svg> elements inline, with no namespaces. (The aria labels don’t really have any impact on whether the document has errors or not, at least in this case.)

    Bottom line, your markup looks fine to me.