govuk-design-system icon indicating copy to clipboard operation
govuk-design-system copied to clipboard

Make it easy to link to sections of a page

Open joelanman opened this issue 6 years ago • 11 comments

I think this is primarily a support need, but other users might have it too.

Sometimes you need to link someone to a specific section on a page, for example:

https://design-system.service.gov.uk/styles/typography/#lists

Currently you have to right click, 'Inspect' and add the 'id' attribute to the url

joelanman avatar Jul 03 '18 12:07 joelanman

We tried one approach here: anchor link icons that appear on hover:

https://github.com/alphagov/govuk-design-system/pull/295

The downside is they are not accessible to mobile users, and the icon is probably not widely understood

image

joelanman avatar Jul 03 '18 13:07 joelanman

Another approach would be to add in-page navigation, like Elements did:

https://govuk-elements.herokuapp.com/typography/

Downside - this adds a lot of nav to the top of the page that most users might not need

joelanman avatar Jul 03 '18 13:07 joelanman

Idea: Add a little dropdown menu to each heading:

image

Downside: the dropdown arrow could be confusing, might indicate there is more you can do than just share that section.

joelanman avatar Jul 03 '18 13:07 joelanman

Trello ticket: https://trello.com/c/EOkrfNkF/1343-make-it-easy-to-link-to-a-section-on-a-page

kr8n3r avatar Aug 15 '18 13:08 kr8n3r

With the work done to link to sections within long pages cover this or do we still think it's worthwhile looking at something for all headings?

screen shot 2019-01-08 at 13 34 53

dashouse avatar Jan 08 '19 13:01 dashouse

I think this is more a support need than a user need so I'd be happy to close it, but I'd really like to get in this feature to make support easier so we can link people to sections without having to inspect the page...

Will leave it to you @dashouse to make the decision to close.

NickColley avatar Jan 08 '19 14:01 NickColley

I'd really really really appreciate this. Right now I'm inspecting element 3-5 times a day so I can cite a specific section.

FWIW in my use case I'm not trying to cite from mobile - so for me it being an enhancement for mouse based is fine.

@dashouse my use case it to cite very specific paragraphs - I don't think the nav necessarily goes to that granularity.

edwardhorsford avatar Jan 18 '19 13:01 edwardhorsford

alternative is to expose all heading levels to the search

kr8n3r avatar Feb 06 '19 10:02 kr8n3r

alternative is to expose all heading levels to the search

Does that mean when I'm on a thing that I want to link to, I'd have to go to the search to search for that phrase?

edwardhorsford avatar Feb 06 '19 12:02 edwardhorsford

Most pages in the Design System follow the same content pattern, which means the same headings are generally re-used across every page – the exception being the styles section, where headings are more likely to be unique.

I'm not sure how useful adding them into search would be because of that – seems like a lot of noise.

36degrees avatar Feb 06 '19 13:02 36degrees

Can we look at adding this to the headings section of the typography part of the website? And write a blog explaining why/how users can copy?

Ciandelle avatar Jun 08 '22 15:06 Ciandelle