Make WordPress Core

Opened 3 years ago

Last modified 8 months ago

#40361 assigned defect (bug)

Improvements for wp-signup.php and wp-activate.php markup and CSS

Reported by: afercia Owned by: allisonplus
Milestone: Future Release Priority: normal
Severity: normal Version:
Component: Login and Registration Keywords: has-screenshots good-first-bug has-patch
Focuses: accessibility, multisite Cc:

Description (last modified by afercia)

Splitting this out from #23197.

First time trying to customize the network registration screens and noticed a few issues.

Bugs that should be addressed, also related to accessibility:

  • labels not correctly associated (see screenshot)
  • mixed use of explicitly and implicitly associated labels: explicitly associated ones should be preferred
  • text not wrapped in semantic elements, often just within <div>s
  • an <ul> list (noemail-tips) output within a paragraph
  • buttons have a very unique styling, pretty inconsistent with the default WP styles. They don't use the .button CSS class so loading the .buttons.css stylesheet won-t have any effect; the body element also would need a wp-core-ui CSS class
  • indentation: spaces instead of tabs

Possible improvements, maybe to split out in separate tickets:

  • I'm not sure to understand why wpmu_signup_stylesheet() and wpmu_activate_stylesheet() output inline styles, maybe it's just for historical reasons; ideally, deprecate them or move the styles to login.css
  • wp-activate fails to output a proper document <title> tag, not sure this can be solved (see #23197)
  • when customizing the registration/activation screens, it's very difficult to distinguish all the screens for styling purposes: there's $stage that can be used to some extent, for example to add CSS classes on the body but it doesn't cover all the cases. Ideally, there should be an easy way to add CSS classes for each step or they should be built-in

Two labels for the same element, the first one should be a fieldset legend together with the sentence "Allow search engines...":


Attachments (1)

40361.patch (3.6 KB) - added by allisonplus 3 years ago.
converts spaces to tabs, extracts <ul> from within <p>

Download all attachments as: .zip

Change History (18)

#1 @afercia
3 years ago

  • Focuses accessibility added

#2 @afercia
3 years ago

  • Description modified (diff)

This ticket was mentioned in Slack in #accessibility by afercia. View the logs.

3 years ago

#4 in reply to: ↑ description @SergeyBiryukov
3 years ago

Replying to afercia:

wp-activate fails to output a proper document <title> tag, not sure this can be solved (see #23197)

This was previously fixed in #13638 and #24960, looks like it was reintroduced at some point.

#5 @afercia
3 years ago

  • Keywords good-first-bug added
  • Milestone changed from Awaiting Review to Future Release

The first part related to markup and CSS could be ideal for a good first bug. Moving to future release.

3 years ago

converts spaces to tabs, extracts <ul> from within <p>

#6 @allisonplus
3 years ago

  • Keywords reporter-feedback added

My patch is partial in nature. I wanted to clarify with @afercia if these were the buttons were the ones you were referencing (see screenshots below) that needed the button class added (with other alignment adjustments as well)


#7 @afercia
3 years ago

  • Keywords reporter-feedback removed

@allisonplus thanks! I was referring to the buttons in the signup form, the ones you get on a multisite installation when you register on the front-end.


P.S. The form changes depending on the registration option enabled.

Last edited 3 years ago by afercia (previous) (diff)

#8 @afercia
3 years ago

Related #23637

#9 follow-up: @DrewAPicture
3 years ago

  • Keywords has-patch added
  • Owner set to allisonplus
  • Status changed from new to assigned

Assigning ownership to mark the good-first-bug as "claimed".

This ticket was mentioned in Slack in #accessibility by afercia. View the logs.

2 years ago

This ticket was mentioned in Slack in #core-multisite by flixos90. View the logs.

2 years ago

#12 @jeremyfelt
2 years ago

Also related: #34149

#13 in reply to: ↑ 9 @allisonplus
2 years ago

I'm unable to replicate this on my end multi-site-wise so if someone else is able to, please feel free to transfer ownership.

This ticket was mentioned in Slack in #accessibility by afercia. View the logs.

18 months ago

#15 @afercia
18 months ago

@jeremyfelt anyone in the Network and Sites team willing to have a look at this for 5.2?

This ticket was mentioned in Slack in #core-multisite by jeremyfelt. View the logs.

18 months ago

#17 @SteelWagstaff
8 months ago

Don't know if this is the appropriate place for this, but we had an a11y issue filed in our WordPress based project noting that the wp-signup.php page lacks a main landmark role. See https://github.com/pressbooks/pressbooks/issues/1786 & https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Main_role. Is that in scope for already planned work?

Note: See TracTickets for help on using tickets.