Bundled Themes: Accessibility additions to the site title link

[bschneidewind]

In most bundled themes, the aria-current and rel="home" attributes are missing on the site logo.

Can be seen at: ​https://wp-themes.com/twentytwenty/

In Twenty Twenty theme, adds the aria-current="page" (when applicable) and rel="home" to the site logo.

Trac ticket: https://core.trac.wordpress.org/ticket/62895

[hiabhaykulkarni]

Test Report:

Patch Tested: ​https://github.com/WordPress/wordpress-develop/pull/8237

I have tested the above PR, and the header logo includes the rel="home" and aria-current="page" attributes.

Environment:

OS: macOS 15.2 (24C101)
Browser: Microsoft Edge Version 132.0.2957.127 (Official build) (arm64)
Screenshot: ​https://share.cleanshot.com/yyspBNJP95d7p2J5vHwS

[sabernhardt]

I think you mean the site title (text) link; the site logo gets its link from get_custom_logo().

The PR replaces the title argument with two new arguments. The title argument should remain usable, but you could add rel="home" to the default:

		'title'       => '<a href="%1$s" rel="home">%2$s</a>',

Then you could add the aria-current attribute

1. if it matches the conditions in get_custom_logo() (see #62879 for any updates) and
2. if the title argument matches the default value.

   		$contents  = sprintf( $args['title'], esc_url( get_home_url( null, '/' ) ), esc_html( $site_title ) );
   		if (
   			( is_front_page() || is_home() && ( (int) get_option( 'page_for_posts' ) !== get_queried_object_id() ) )
   			&& ! is_paged()
   			&& $args['title'] === $defaults['title']
   		) {
   			$contents = str_replace( ' rel=', ' aria-current="page" rel=', $contents );
   		}
   		$classname = $args['title_class'];
   

I purposely did not use the condition argument because it can be customized, and even its default value does not include ! is_paged(). The condition determines whether the wrapping element is a heading, but aria-current would be more exclusive.

[bschneidewind]

Thank you @sabernhardt ~ just took care of those updates!

[bschneidewind]

Updated the scope to include all bundled themes:
TwentyTen
TwentyEleven
TwentyTwelve
TwentyThirteen
TwentyFourteen
TwentyFifteen
TwentySixteen
TwentySeventeen
TwentyNineteen
TwentyTwenty
TwentyTwentyOne

[joedolson]

I've reviewed the PR and added support for the rel and aria-current attributes on linked header images where appropriate, and made a couple minor fixes. Marking for commit.

[joedolson]

Removed the logic for aria-current from Twenty Twenty One. The intent on Twenty Twenty One is that there shouldn't be a link when the front page is shown, and any changes there should be about handling edge cases that can show a link rather than marking it as current.

[joedolson]

In 59907:

Bundled Themes: Add aria-current="page" on header links.

Mark links that point to the current URL in bundled theme headers with aria-current="page" to inform screen reader users that this link is the current page.

Changes to Twenty Ten through Twenty Twenty add aria-current and rel="home" where appropriate, Twenty Twenty One only adds rel="home".

Props bschneidewind, joedolson, hiabhaykulkarni, sabernhardt.
Fixes #62895.