Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ensure footer links look clickable #1672

Merged
merged 2 commits into from
Dec 12, 2019

Conversation

NickColley
Copy link
Contributor

@NickColley NickColley commented Dec 4, 2019

We originally removed the underlines from these links to make them consistent with the approach we have for the header component.

Many community members have asked why we have made this change, and justification seems to be related to allowing a better hover state.

This makes sense but is not consistent with our other components, for example:

  • back link
  • breadcrumbs
  • error summary links
  • tabs component

do not have a distinct hover state.

I think we should consider hover states (and touch states) at a system level separately.

In the meantime we can make sure that the links in the footer have the affordance of links, as we did not have any evidence from users that removing these underlines is helpful.

Original reasoning for removing underlines: #1321 (comment)

Screenshots

Before without underlines

After with underlines

@NickColley NickColley added the awaiting triage Needs triaging by team label Dec 4, 2019
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1672 December 4, 2019 11:17 Inactive
@NickColley
Copy link
Contributor Author

From @timpaul :

I chatted to Ste McC about this today [...]. On reflection we both agree that we should reinstate them. The context of the header is pretty ambiguous compared to other navigation - some things are links, some things aren't, so we need to provide additional context with underlines.

@NickColley NickColley force-pushed the add-underlines-to-footer-component-links branch from efbebba to 690c1f9 Compare December 9, 2019 16:09
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1672 December 9, 2019 16:09 Inactive
@NickColley NickColley removed the awaiting triage Needs triaging by team label Dec 9, 2019
@NickColley NickColley added this to the Next milestone Dec 9, 2019
We originally removed the underlines from these links to make them consistent with the approach we have for the header component.

In order to make sure these links look like links in this component I have reverted this change.

Original reasoning for removing underlines:
"
I believe the intention was to treat the links in the footer in the same way we treat other navigational elements – like the header, or in the case of the Design System the side navigation. Where the ‘thing’ is a ‘list of links’, the thinking is/was that they don’t need the underlining because there’s no wider context in which they need to be distinguished. The exception is any link that does appear within e.g. a paragraph, in which case it does need the underline to distinguish it. It has been questioned a few times on support recently though.

The benefit, I believe, is that it allows us to have a clear hover state for those links, which we didn’t previously have
"
@NickColley NickColley force-pushed the add-underlines-to-footer-component-links branch from 690c1f9 to a552760 Compare December 12, 2019 13:58
@NickColley NickColley merged commit 12f0d6c into master Dec 12, 2019
@NickColley NickColley deleted the add-underlines-to-footer-component-links branch December 12, 2019 14:01
@edwardhorsford
Copy link
Contributor

👏

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Development

Successfully merging this pull request may close these issues.

4 participants