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

nbsp spaces missing in heading slug values #12970

Closed
1 task done
jurajkapsz opened this issue Jan 11, 2025 · 4 comments
Closed
1 task done

nbsp spaces missing in heading slug values #12970

jurajkapsz opened this issue Jan 11, 2025 · 4 comments
Labels
needs triage Issue needs to be triaged

Comments

@jurajkapsz
Copy link
Contributor

Astro Info

Astro                    v5.1.5
Node                     v22.11.0
System                   Linux (x64)
Package Manager          pnpm
Output                   static
Adapter                  none
Integrations             @astrojs/mdx
                         @astrojs/sitemap

If this issue only occurs in one browser, which browser is a problem?

No response

Describe the Bug

As shown in stackblitz example, non-breaking spaces in heading text aren't recognized as spaces in heading ID slug — or slug-like — values.

Example:

## A fox jumped over a fence

will have an ID value afox-jumped-over-afence.

<h2 id="afox-jumped-over-afence">A&nbsp;fox jumped over a fence</h2>

More over, the ID value does not necessary follow kebab-case.

Example:

## 😄 A&#8239;bird 😄 😄 is a&#160;word 😄 😄 😄

will have an -abird---is-aword-- ID value.

<h2 id="-abird---is-aword--">😄 A bird 😄 😄 is a&nbsp;word 😄 😄 😄</h2>

What's the expected result?

For every use case, the generated ID value could be in "SEO-friendly" kebab-case, eg lorem-ipsum-dolor-sit-amet.
This would be more human/machine readable if need-be, and potentially have a more persistent link value.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-umpwjgrj?file=src%2Fdata%2Fblog%2Fpost-1.md

Participation

  • I am willing to submit a pull request for this issue.
@github-actions github-actions bot added the needs triage Issue needs to be triaged label Jan 11, 2025
@ematipico
Copy link
Member

ematipico commented Jan 13, 2025

We use github-slugger, and that's an expected case. I suggest you to open a discussion about changing how the slugger behaves in Astro, because that could be a breaking change as many users have been using this slugger for a long time.

Plus, I would argue that adding emojis and Unicode characters to an h1 is already a fight against SEO in the first place.

@ematipico ematipico closed this as not planned Won't fix, can't repro, duplicate, stale Jan 13, 2025
@jurajkapsz
Copy link
Contributor Author

Thanks for the review. Discussions are being held on discord?

Plus, I would argue that adding emojis and Unicode characters to an h1 is already a fight against SEO in the first place.

On side note, I don't think using unicode chars eg non breaking spaces should be against SEO, as they are a part of well or properly formatted text, numbers, SI values, handling text orphans/widows etc. The emoji example I took from github-slugger readme, as it breaks kebab-case as well, otherwise I don't mind them that much - if anything, it could be nice if one could play around with them in headings and have a steady slug, if they [emoji] don't contribute to the text content in kebab-case.

In any case, yes, this would be a breaking change then. If this feature should matter, maybe a solution would be to have a configuration option to enable kebab-case slugs.

Thanks again!

@ematipico
Copy link
Member

Discussions happen in this repository: https://github.com/withastro/roadmap

@jurajkapsz
Copy link
Contributor Author

Ah, right, thanks, will look onto it!

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

Successfully merging a pull request may close this issue.

2 participants