WordPress.org

Make WordPress Core

Changeset 45416


Ignore:
Timestamp:
05/25/2019 03:18:24 PM (7 months ago)
Author:
afercia
Message:

Accessibility: Improve settings tables and forms after [45403].

  • adds role="presentation" to the edit comment table
  • removes a few pointless <fieldset> elements
  • adds a few missing <label> elements
  • adds the CSS class class="td-full" to table rows spanning to multiple cells
  • adds explicit scope="row" attribute to the table headers in options-permalink.php: this table is better communicated as data table
  • uses consistent label association in the "Privacy Settings" page
  • in the installation page "Set up your database connection": associates descriptions to their inout fields using aria-describedby
  • improves the link to gravatar.com in the user-edit.php page

See #46899.
Fixes #47390.

Location:
trunk/src/wp-admin
Files:
13 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-admin/edit-form-comment.php

    r44712 r45416  
    4444<fieldset>
    4545<legend class="screen-reader-text"><?php _e( 'Comment Author' ); ?></legend>
    46 <table class="form-table editcomment">
     46<table class="form-table editcomment" role="presentation">
    4747<tbody>
    4848<tr>
  • trunk/src/wp-admin/includes/ms.php

    r45403 r45416  
    985985            } else {
    986986                ?>
    987                 <td><fieldset><p><legend><?php _e( 'User has no sites or content and will be deleted.' ); ?></legend></p>
     987                <td><p><?php _e( 'User has no sites or content and will be deleted.' ); ?></p></td>
    988988            <?php } ?>
    989989            </tr>
  • trunk/src/wp-admin/includes/network.php

    r45403 r45416  
    348348        <?php endif; ?>
    349349            <tr>
    350                 <th scope='row'><?php esc_html_e( 'Network Title' ); ?></th>
    351                 <td>
    352                     <input name='sitename' type='text' size='45' value='<?php echo esc_attr( $site_name ); ?>' />
     350                <th scope='row'><label for="sitename"><?php esc_html_e( 'Network Title' ); ?></label></th>
     351                <td>
     352                    <input name='sitename' id='sitename' type='text' size='45' value='<?php echo esc_attr( $site_name ); ?>' />
    353353                    <p class="description">
    354354                        <?php _e( 'What would you like to call your network?' ); ?>
     
    357357            </tr>
    358358            <tr>
    359                 <th scope='row'><?php esc_html_e( 'Network Admin Email' ); ?></th>
    360                 <td>
    361                     <input name='email' type='text' size='45' value='<?php echo esc_attr( $admin_email ); ?>' />
     359                <th scope='row'><label for="email"><?php esc_html_e( 'Network Admin Email' ); ?></label></th>
     360                <td>
     361                    <input name='email' id='email' type='text' size='45' value='<?php echo esc_attr( $admin_email ); ?>' />
    362362                    <p class="description">
    363363                        <?php _e( 'Your email address.' ); ?>
  • trunk/src/wp-admin/network/settings.php

    r45403 r45416  
    453453             * @param string[] $admin_menus Associative array of the menu items available.
    454454             */
    455             $menu_items   = apply_filters( 'mu_menu_items', array( 'plugins' => __( 'Plugins' ) ) );
    456             $fieldset_end = '';
    457             if ( count( (array) $menu_items ) > 1 ) {
    458                 echo '<fieldset><legend class="screen-reader-text">' . __( 'Enable menus' ) . '</legend>';
    459                 $fieldset_end = '</fieldset>';
    460             }
     455            $menu_items = apply_filters( 'mu_menu_items', array( 'plugins' => __( 'Plugins' ) ) );
     456
     457            echo '<fieldset><legend class="screen-reader-text">' . __( 'Enable menus' ) . '</legend>';
     458
    461459            foreach ( (array) $menu_items as $key => $val ) {
    462460                echo "<label><input type='checkbox' name='menu_items[" . $key . "]' value='1'" . ( isset( $menu_perms[ $key ] ) ? checked( $menu_perms[ $key ], '1', false ) : '' ) . ' /> ' . esc_html( $val ) . '</label><br/>';
    463461            }
    464             echo $fieldset_end;
     462
     463            echo '</fieldset>';
    465464            ?>
    466465                </td>
  • trunk/src/wp-admin/network/site-info.php

    r45403 r45416  
    167167            ?>
    168168        <tr class="form-field form-required">
    169             <th scope="row"><?php _e( 'Site Address (URL)' ); ?></th>
     169            <th scope="row"><label for="url"><?php _e( 'Site Address (URL)' ); ?></label></th>
    170170            <td><input name="blog[url]" type="text" id="url" value="<?php echo $parsed_scheme . '://' . esc_attr( $details->domain ) . esc_attr( $details->path ); ?>" /></td>
    171171        </tr>
  • trunk/src/wp-admin/network/site-new.php

    r45403 r45416  
    282282        </tr>
    283283        <tr class="form-field">
    284             <td colspan="2"><p id="site-admin-email"><?php _e( 'A new user will be created if the above email address is not in the database.' ); ?><br /><?php _e( 'The username and a link to set the password will be mailed to this email address.' ); ?></p></td>
     284            <td colspan="2" class="td-full"><p id="site-admin-email"><?php _e( 'A new user will be created if the above email address is not in the database.' ); ?><br /><?php _e( 'The username and a link to set the password will be mailed to this email address.' ); ?></p></td>
    285285        </tr>
    286286    </table>
  • trunk/src/wp-admin/network/site-users.php

    r45403 r45416  
    355355        </tr>
    356356        <tr class="form-field">
    357             <td colspan="2"><?php _e( 'A password reset link will be sent to the user via email.' ); ?></td>
     357            <td colspan="2" class="td-full"><?php _e( 'A password reset link will be sent to the user via email.' ); ?></td>
    358358        </tr>
    359359    </table>
  • trunk/src/wp-admin/network/user-new.php

    r45403 r45416  
    131131        </tr>
    132132        <tr class="form-field">
    133             <td colspan="2"><?php _e( 'A password reset link will be sent to the user via email.' ); ?></td>
     133            <td colspan="2" class="td-full"><?php _e( 'A password reset link will be sent to the user via email.' ); ?></td>
    134134        </tr>
    135135    </table>
  • trunk/src/wp-admin/options-discussion.php

    r45403 r45416  
    222222<tr>
    223223<th scope="row"><?php _e( 'Avatar Display' ); ?></th>
    224 <td><fieldset><legend class="screen-reader-text"><span><?php _e( 'Avatar Display' ); ?></span></legend>
     224<td>
    225225    <label for="show_avatars">
    226226        <input type="checkbox" id="show_avatars" name="show_avatars" value="1" <?php checked( $show_avatars, 1 ); ?> />
    227227        <?php _e( 'Show Avatars' ); ?>
    228228    </label>
    229 </fieldset></td>
     229</td>
    230230</tr>
    231231<tr class="avatar-settings<?php echo $show_avatars_class; ?>">
     
    256256<td class="defaultavatarpicker"><fieldset><legend class="screen-reader-text"><span><?php _e( 'Default Avatar' ); ?></span></legend>
    257257
     258<p>
    258259<?php _e( 'For users without a custom avatar of their own, you can either display a generic logo or a generated one based on their email address.' ); ?><br />
     260</p>
    259261
    260262<?php
  • trunk/src/wp-admin/options-permalink.php

    r45403 r45416  
    198198<table class="form-table permalink-structure">
    199199    <tr>
    200         <th><label><input name="selection" type="radio" value="" <?php checked( '', $permalink_structure ); ?> /> <?php _e( 'Plain' ); ?></label></th>
     200        <th scope="row"><label><input name="selection" type="radio" value="" <?php checked( '', $permalink_structure ); ?> /> <?php _e( 'Plain' ); ?></label></th>
    201201        <td><code><?php echo get_option( 'home' ); ?>/?p=123</code></td>
    202202    </tr>
    203203    <tr>
    204         <th><label><input name="selection" type="radio" value="<?php echo esc_attr( $structures[1] ); ?>" <?php checked( $structures[1], $permalink_structure ); ?> /> <?php _e( 'Day and name' ); ?></label></th>
     204        <th scope="row"><label><input name="selection" type="radio" value="<?php echo esc_attr( $structures[1] ); ?>" <?php checked( $structures[1], $permalink_structure ); ?> /> <?php _e( 'Day and name' ); ?></label></th>
    205205        <td><code><?php echo get_option( 'home' ) . $blog_prefix . $prefix . '/' . date( 'Y' ) . '/' . date( 'm' ) . '/' . date( 'd' ) . '/' . _x( 'sample-post', 'sample permalink structure' ) . '/'; ?></code></td>
    206206    </tr>
    207207    <tr>
    208         <th><label><input name="selection" type="radio" value="<?php echo esc_attr( $structures[2] ); ?>" <?php checked( $structures[2], $permalink_structure ); ?> /> <?php _e( 'Month and name' ); ?></label></th>
     208        <th scope="row"><label><input name="selection" type="radio" value="<?php echo esc_attr( $structures[2] ); ?>" <?php checked( $structures[2], $permalink_structure ); ?> /> <?php _e( 'Month and name' ); ?></label></th>
    209209        <td><code><?php echo get_option( 'home' ) . $blog_prefix . $prefix . '/' . date( 'Y' ) . '/' . date( 'm' ) . '/' . _x( 'sample-post', 'sample permalink structure' ) . '/'; ?></code></td>
    210210    </tr>
    211211    <tr>
    212         <th><label><input name="selection" type="radio" value="<?php echo esc_attr( $structures[3] ); ?>" <?php checked( $structures[3], $permalink_structure ); ?> /> <?php _e( 'Numeric' ); ?></label></th>
     212        <th scope="row"><label><input name="selection" type="radio" value="<?php echo esc_attr( $structures[3] ); ?>" <?php checked( $structures[3], $permalink_structure ); ?> /> <?php _e( 'Numeric' ); ?></label></th>
    213213        <td><code><?php echo get_option( 'home' ) . $blog_prefix . $prefix . '/' . _x( 'archives', 'sample permalink base' ) . '/123'; ?></code></td>
    214214    </tr>
    215215    <tr>
    216         <th><label><input name="selection" type="radio" value="<?php echo esc_attr( $structures[4] ); ?>" <?php checked( $structures[4], $permalink_structure ); ?> /> <?php _e( 'Post name' ); ?></label></th>
     216        <th scope="row"><label><input name="selection" type="radio" value="<?php echo esc_attr( $structures[4] ); ?>" <?php checked( $structures[4], $permalink_structure ); ?> /> <?php _e( 'Post name' ); ?></label></th>
    217217        <td><code><?php echo get_option( 'home' ) . $blog_prefix . $prefix . '/' . _x( 'sample-post', 'sample permalink structure' ) . '/'; ?></code></td>
    218218    </tr>
    219219    <tr>
    220         <th>
     220        <th scope="row">
    221221            <label><input name="selection" id="custom_selection" type="radio" value="custom" <?php checked( ! in_array( $permalink_structure, $structures ) ); ?> />
    222222            <?php _e( 'Custom Structure' ); ?>
  • trunk/src/wp-admin/privacy.php

    r45384 r45416  
    192192
    193193    <hr>
    194     <table class="form-table tools-privacy-policy-page">
     194    <table class="form-table tools-privacy-policy-page" role="presentation">
    195195        <tr>
    196             <th scope="row">
     196            <th scope="row"><label for="page_for_privacy_policy">
    197197                <?php
    198198                if ( $privacy_policy_page_exists ) {
     
    202202                }
    203203                ?>
    204             </th>
     204            </label></th>
    205205            <td>
    206206                <?php
     
    219219                    ?>
    220220                    <form method="post" action="">
    221                         <label for="page_for_privacy_policy">
    222                             <?php _e( 'Select an existing page:' ); ?>
    223                         </label>
    224221                        <input type="hidden" name="action" value="set-privacy-page" />
    225222                        <?php
  • trunk/src/wp-admin/setup-config.php

    r45403 r45416  
    211211        <tr>
    212212            <th scope="row"><label for="dbname"><?php _e( 'Database Name' ); ?></label></th>
    213             <td><input name="dbname" id="dbname" type="text" size="25" value="wordpress"<?php echo $autofocus; ?>/></td>
    214             <td><?php _e( 'The name of the database you want to use with WordPress.' ); ?></td>
     213            <td><input name="dbname" id="dbname" type="text" aria-describedby="dbname-desc" size="25" value="wordpress"<?php echo $autofocus; ?>/></td>
     214            <td id="dbname-desc"><?php _e( 'The name of the database you want to use with WordPress.' ); ?></td>
    215215        </tr>
    216216        <tr>
    217217            <th scope="row"><label for="uname"><?php _e( 'Username' ); ?></label></th>
    218             <td><input name="uname" id="uname" type="text" size="25" value="<?php echo htmlspecialchars( _x( 'username', 'example username' ), ENT_QUOTES ); ?>" /></td>
    219             <td><?php _e( 'Your database username.' ); ?></td>
     218            <td><input name="uname" id="uname" type="text" aria-describedby="uname-desc" size="25" value="<?php echo htmlspecialchars( _x( 'username', 'example username' ), ENT_QUOTES ); ?>" /></td>
     219            <td id="uname-desc"><?php _e( 'Your database username.' ); ?></td>
    220220        </tr>
    221221        <tr>
    222222            <th scope="row"><label for="pwd"><?php _e( 'Password' ); ?></label></th>
    223             <td><input name="pwd" id="pwd" type="text" size="25" value="<?php echo htmlspecialchars( _x( 'password', 'example password' ), ENT_QUOTES ); ?>" autocomplete="off" /></td>
    224             <td><?php _e( 'Your database password.' ); ?></td>
     223            <td><input name="pwd" id="pwd" type="text" aria-describedby="pwd-desc" size="25" value="<?php echo htmlspecialchars( _x( 'password', 'example password' ), ENT_QUOTES ); ?>" autocomplete="off" /></td>
     224            <td id="pwd-desc"><?php _e( 'Your database password.' ); ?></td>
    225225        </tr>
    226226        <tr>
    227227            <th scope="row"><label for="dbhost"><?php _e( 'Database Host' ); ?></label></th>
    228             <td><input name="dbhost" id="dbhost" type="text" size="25" value="localhost" /></td>
    229             <td>
     228            <td><input name="dbhost" id="dbhost" type="text" aria-describedby="dbhost-desc" size="25" value="localhost" /></td>
     229            <td id="dbhost-desc">
    230230            <?php
    231231                /* translators: %s: localhost */
     
    236236        <tr>
    237237            <th scope="row"><label for="prefix"><?php _e( 'Table Prefix' ); ?></label></th>
    238             <td><input name="prefix" id="prefix" type="text" value="wp_" size="25" /></td>
    239             <td><?php _e( 'If you want to run multiple WordPress installations in a single database, change this.' ); ?></td>
     238            <td><input name="prefix" id="prefix" type="text" aria-describedby="prefix-desc" value="wp_" size="25" /></td>
     239            <td id="prefix-desc"><?php _e( 'If you want to run multiple WordPress installations in a single database, change this.' ); ?></td>
    240240        </tr>
    241241    </table>
  • trunk/src/wp-admin/user-edit.php

    r45403 r45416  
    569569                /* translators: %s: Gravatar URL */
    570570                $description = sprintf(
    571                     __( 'You can change your profile picture on <a href="%s">Gravatar</a>.' ),
     571                    __( '<a href="%s">You can change your profile picture on Gravatar</a>.' ),
    572572                    __( 'https://en.gravatar.com/' )
    573573                );
Note: See TracChangeset for help on using the changeset viewer.