Report: Explore the Backend Login page

[zwiastunsw]

The Backend login page has passed the accessibility tests (thanks Yannick Berges). Although the page is accessible, several issues need to be considered and possible adjustments should be made.

Inadequate title of page

Page TITLE element does not describe its function or purpose. The title of the page shall be 'Administrator'. In fact it is the "Login page" (or "Login to the Backend"). See:

• 2.4.2 Page Titled - Level A. Web pages have titles that describe topic or purpose.
• G88: Providing descriptive titles

  Redundant and incorrect tabindex attribute

  A positive tabindex value is present in two input field and in button element. Tabindex values of 1 or greater specify an explicit tab/navigation order for page elements. Because it modifies the default tab order, cause confusion, and result in decreased keyboard accessibility, it should be avoided. How to fix it If the natural tab order is already logical, remove the tabindex. Otherwise, consider restructuring the page so that tabindex is not needed. If tabindex is maintained, ensure that the resulting navigation is logical and complete. See:

• 2.4.3 Focus Order - Level A

  Fieldset missing legend

  A fieldset legend presents a description of the form elements within a fieldset and is especially useful to screen reader users. A legend should be provided when a higher level description is necessary for groups of form controls.

  It is required that the fieldset and legend are used conjuction. A fieldset cannot be used without a legend and visa versa. (by Steve Faulkner, The Pacciello Group)

How to fix it If a higher level description is necessary for the user to understand the function or purpose of the controls within the fieldset, provide this description within the legend. If this description or grouping is not necessary, the fieldset should probably be removed. See:

• 1.3.1 Info and Relationships - Level A
• 2.4.6 Headings and Labels - Level AA
• 3.3.2 Labels or Instructions - Level A
• Fieldsets, Legends and Screen Readers

  The page has no main landmark

  Content should be contained in a landmark region. This is not a requirement for accessibility, it is good practice. The page should have at least a main landmark. See:

• 1.3.1 Info and Relationships - Level A
• Content should be contained in a landmark region
• There must only be one main landmark to navigate...

Ask for comments, suggestions or patches and PR submissions.

[brianteeman]

Re fieldsets and legends

It is required that the fieldset and legend are used conjuction. A fieldset cannot be used without a legend and visa versa. (by Steve Faulkner, The Pacciello Group)

This is outdated as it refers to the html4.1 specification. The html5 specification does not make it a requirement. see https://www.w3.org/TR/html52/sec-forms.html#elementdef-fieldset

This was also confirmed to me by the Drupal accessibility lead AND Leonie Watson of the Pacciello Group

[zwiastunsw]

I agree. The HTML 5.2 specification does not specify that the two elements have to be present together. The legend is an optional element. There was no such condition in the HTML 4.1 specification either.

The legend element provides a name for the fieldset element. Without the legend element, the fieldset element does not have a name. The name describes the purpose of the fieldset, making it easy for the user to understand. If there is no name, the purpose of the fieldset element is unclear. This raises the question of whether this element is needed at all. That is why I wrote: If this description or grouping is not necessary, the fieldset should probably be removed.

The earlier specifications (HTML 4.1) explicit stated that the legends improve accessibility, especially for users of assistive technologies.

The FIELDSET element allows authors to group thematically related controls and labels. Grouping controls makes it easier for users to understand their purpose while simultaneously facilitating tabbing navigation for visual user agents and speech navigation for speech-oriented user agents. The proper use of this element makes documents more accessible. The LEGEND element allows authors to assign a caption to a FIELDSET. The legend improves accessibility when the FIELDSET is rendered non-visually. HTML 4.01 Specification. 17.10 Adding structure to forms: the FIELDSET and LEGEND elements.

That is why I continue to maintain my opinion.

I will be happy to hear a different opinion and argument on this issue.

[brianteeman]

Can you tell me where the tabindex is please - I don't see it

[zwiastunsw]

Hi, already fixed. https://github.com/joomla/joomla-cms/pull/21088

[brianteeman]

ok - and I just fixed the title https://github.com/joomla/joomla-cms/pull/21603/

[brianteeman]

As there is only a login box on this page I don't think there is a need for a < main > but I will add it if you think its needed

[zwiastunsw]

I also have a problem with that. But because:

It is a best practice to include ALL content on the page in landmarks, so that screen reader users who rely on them to navigate from section to section do not lose track of content.

I think it is no mistake to add the main role here. But it will not be a violation if we don't add it, either.

[brianteeman]

its a 2 second thing so i will do that in the morning

[brianteeman]

Re main landmark https://github.com/joomla/joomla-cms/pull/21604

[brianteeman]

Is there anything left to do for this?

[zwiastunsw]

@micker : Please, test