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

Make it easy to link to sections of a page #425

Open
joelanman opened this issue Jul 3, 2018 · 11 comments · May be fixed by #2481
Open

Make it easy to link to sections of a page #425

joelanman opened this issue Jul 3, 2018 · 11 comments · May be fixed by #2481
Labels
design website Issues relating to the Design System website itself

Comments

@joelanman
Copy link
Contributor

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
Copy link
Contributor Author

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

#295

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

image

@joelanman
Copy link
Contributor Author

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
Copy link
Contributor Author

joelanman commented Jul 3, 2018

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 joelanman changed the title Make it easy to link to a sections of a page Make it easy to link to sections of a page Jul 6, 2018
@kr8n3r
Copy link
Contributor

kr8n3r commented Aug 15, 2018

@dashouse
Copy link

dashouse commented Jan 8, 2019

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

@NickColley
Copy link
Contributor

NickColley commented Jan 8, 2019

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.

@edwardhorsford
Copy link
Contributor

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.

@kr8n3r
Copy link
Contributor

kr8n3r commented Feb 6, 2019

alternative is to expose all heading levels to the search

@edwardhorsford
Copy link
Contributor

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?

@36degrees
Copy link
Member

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 36degrees added this to Upcoming sprints in Design System Sprint Board via automation Jul 30, 2019
@36degrees 36degrees moved this from Upcoming sprints to Sprint Backlog in Design System Sprint Board Jul 30, 2019
@kellylee-gds kellylee-gds moved this from Sprint Backlog to Upcoming sprints in Design System Sprint Board Aug 28, 2019
@kellylee-gds kellylee-gds removed this from Upcoming sprints in Design System Sprint Board Sep 4, 2019
@36degrees 36degrees added the awaiting triage Needs triaging by team label Oct 26, 2020
@kellylee-gds kellylee-gds added design and removed awaiting triage Needs triaging by team labels Oct 26, 2020
@kellylee-gds kellylee-gds added this to Upcoming sprints in Design System Sprint Board via automation Oct 26, 2020
@kellylee-gds kellylee-gds moved this from Upcoming sprints to Sprint Backlog in Design System Sprint Board Oct 26, 2020
@kellylee-gds kellylee-gds moved this from Sprint Backlog 🗄 to Upcoming sprints in Design System Sprint Board Feb 25, 2021
@kellylee-gds kellylee-gds removed this from Upcoming sprints in Design System Sprint Board Apr 12, 2021
@36degrees 36degrees added the website Issues relating to the Design System website itself label Jun 18, 2021
@Ciandelle
Copy link
Contributor

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?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
design website Issues relating to the Design System website itself
Projects
None yet
10 participants