Twenty Fifteen: Use a heading heirarchy to provide a better navigation experience when using screenreading software.

Props davidakennedy, rianrietveld, iamtakashi, afercia, davidakennedy, fixes #30065.

Built from https://develop.svn.wordpress.org/trunk@30072


git-svn-id: http://core.svn.wordpress.org/trunk@30072 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-content/themes/twentyfifteen/author-bio.php

@@ -24,7 +24,7 @@
 		?>
 	</div><!-- .author-avatar -->
 	<div class="author-description">
-		<h2 class="author-title"><?php echo get_the_author(); ?></h2>
+		<h3 class="author-title"><?php echo get_the_author(); ?></h3>
 		<p class="author-bio">
 			<?php the_author_meta( 'description' ); ?>
 			<a class="author-link" href="<?php echo esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ); ?>" rel="author">

wp-content/themes/twentyfifteen/content-link.php

@@ -14,7 +14,13 @@
 	<?php twentyfifteen_post_thumbnail(); ?>
 
 	<header class="entry-header">
-		<?php the_title( sprintf( '<h1 class="entry-title"><a href="%s" rel="bookmark">', esc_url( twentyfifteen_get_link_url() ) ), '</a></h1>' ); ?>
+		<?php
+			if ( is_single() ) :
+				the_title( sprintf( '<h1 class="entry-title"><a href="%s">', esc_url( twentyfifteen_get_link_url() ) ), '</a></h1>' );
+			else :
+				the_title( sprintf( '<h2 class="entry-title"><a href="%s">', esc_url( twentyfifteen_get_link_url() ) ), '</a></h2>' );
+			endif;
+		?>
 	</header>
 	<!-- .entry-header -->
 

wp-content/themes/twentyfifteen/content-search.php

@@ -14,7 +14,7 @@
 	<?php twentyfifteen_post_thumbnail(); ?>
 
 	<header class="entry-header">
-		<?php the_title( sprintf( '<h1 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h1>' ); ?>
+		<?php the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' ); ?>
 	</header><!-- .entry-header -->
 
 	<div class="entry-summary">

wp-content/themes/twentyfifteen/content.php

@@ -18,7 +18,7 @@
 			if ( is_single() ) :
 				the_title( '<h1 class="entry-title">', '</h1>' );
 			else :
-				the_title( sprintf( '<h1 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h1>' );
+				the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' );
 			endif;
 		?>
 	</header><!-- .entry-header -->

wp-content/themes/twentyfifteen/functions.php

@@ -119,8 +119,8 @@ function twentyfifteen_widgets_init() {
 		'description'   => __( 'Add widgets here to appear in your sidebar.', 'twentyfifteen' ),
 		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
 		'after_widget'  => '</aside>',
-		'before_title'  => '<h1 class="widget-title">',
+		'before_title'  => '<h2 class="widget-title">',
-		'after_title'   => '</h1>',
+		'after_title'   => '</h2>',
 	) );
 }
 add_action( 'widgets_init', 'twentyfifteen_widgets_init' );

wp-content/themes/twentyfifteen/header.php

@@ -29,8 +29,18 @@
 	<div id="sidebar" class="sidebar">
 		<header id="masthead" class="site-header" role="banner">
 			<div class="site-branding">
-				<h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
+				<?php
-				<p class="site-description"><?php bloginfo( 'description' ); ?></p>
+					if ( is_front_page() && is_home() ) : ?>
+						<h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
+					<?php else : ?>
+						<p class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></p>
+					<?php endif;
+
+					$description = get_bloginfo( 'description', 'display' );
+					if ( ! empty( $description ) ) : ?>
+						<p class="site-description"><?php echo esc_html( $description ); ?></p>
+					<?php endif;
+				?>
 				<button class="secondary-toggle"><?php esc_html_e( 'Menu and widgets', 'twentyfifteen' ); ?></button>
 			</div><!-- .site-branding -->
 		</header><!-- .site-header -->

wp-content/themes/twentyfifteen/inc/template-tags.php

@@ -34,7 +34,7 @@ function twentyfifteen_paging_nav() {
 	if ( $links ) :
 	?>
 	<nav class="navigation pagination" role="navigation">
-		<h1 class="screen-reader-text"><?php esc_html_e( 'Posts navigation', 'twentyfifteen' ); ?></h1>
+		<h2 class="screen-reader-text"><?php esc_html_e( 'Posts navigation', 'twentyfifteen' ); ?></h2>
 		<div class="nav-links">
 			<?php echo $links; ?>
 		</div><!-- .nav-links -->
@@ -71,7 +71,7 @@ function twentyfifteen_post_nav() {
 
 	?>
 	<nav class="navigation post-navigation" role="navigation">
-		<h1 class="screen-reader-text"><?php esc_html_e( 'Post navigation', 'twentyfifteen' ); ?></h1>
+		<h2 class="screen-reader-text"><?php esc_html_e( 'Post navigation', 'twentyfifteen' ); ?></h2>
 		<div class="nav-links">
 			<?php
 			if ( is_attachment() ) :
@@ -98,7 +98,7 @@ function twentyfifteen_comment_nav() {
 	if ( get_comment_pages_count() > 1 && get_option( 'page_comments' ) ) :
 	?>
 	<nav class="navigation comment-navigation" role="navigation">
-		<h1 class="screen-reader-text"><?php esc_html_e( 'Comment navigation', 'twentyfifteen' ); ?></h1>
+		<h2 class="screen-reader-text"><?php esc_html_e( 'Comment navigation', 'twentyfifteen' ); ?></h2>
 		<div class="nav-links">
 			<?php
 				if ( $prev_link = get_previous_comments_link( esc_html__( 'Older Comments', 'twentyfifteen' ) ) ) :

wp-content/themes/twentyfifteen/index.php

@@ -22,6 +22,12 @@ get_header(); ?>
 
 		<?php if ( have_posts() ) : ?>
 
+			<?php if ( is_home() && ! is_front_page() ) : ?>
+				<header>
+					<h1 class="page-title screen-reader-text"><?php echo esc_html( get_the_title( get_option( 'page_for_posts' ) ) ); ?></h1>
+				</header>
+			<?php endif; ?>
+
 			<?php while ( have_posts() ) : the_post(); ?>
 
 				<?php

wp-content/themes/twentyfifteen/style.css

@@ -1284,7 +1284,9 @@ img.aligncenter {
 	font-family: "Noto Sans", sans-serif;
 	font-size: 22px;
 	font-size: 2.2rem;
+	font-weight: 700;
 	line-height: 1.3636;
+	margin-bottom: 0;
 }
 
 .site-description {

wp-includes/version.php

@@ -4,7 +4,7 @@
  *
  * @global string $wp_version
  */
-$wp_version = '4.1-alpha-30071';
+$wp_version = '4.1-alpha-30072';
 
 /**
  * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.