processing / p5.js-website

New p5.js website!
http://p5js.org
MIT License
18 stars 92 forks source link

Broken Links #444

Open sambensim opened 4 months ago

sambensim commented 4 months ago

Most appropriate sections of the p5.js website?

Contribute

What is your operating system?

Mac OS

Web browser and version

126.0.6478.126 (Official Build) (arm64)

Actual Behavior

Various links on the Contribute page are broken (lead to "page not found") Starting here:

Expected Behavior

To be taken to the correct page:

Steps to reproduce

  1. Go to https://p5js.org/contribute/readme/
  2. Click on hyperlinked text described above

Would you like to work on the issue?

Yes (but I think it'll take like 3 secs so idc)

sambensim commented 4 months ago

Also, if I've found typos in the docs, how do I report them? If I open an issue, is a typo a bug? (everything's still working, but I'm not advocating for something new either.)

Haiz14 commented 4 months ago

Yep, some links are all broken, especially the getting-started one.

Screenshot_2024-07-06-14-52-46-33_40deb401b9ffe8e1df2f1cc5ba480b12

Qianqianye commented 4 months ago

Thanks @sambensim, I will assign you on this. Please feel free to open an pull request with the links fixed. If you find typos, please open an issue using 'Find a bug' template.

Thanks @Haiz14 for raising the issue about the 'Get started' link, it should be at https://p5js.org/tutorials/get-started. Could you let us know where the links are broken?

wagedu commented 4 months ago

Hi, I found a broken link too. Not sure if it's better to open a new issue or add it here, following the subject... Just in case: when searching for HSB, the result (Reference: HSB) takes me to a 404 page: https://p5js.org/reference/p5/constants/HSB

Stefterv commented 3 months ago

A lot of Google's search results still use the old site's links, they are not broken so I suppose why they aren't updated yet a quick redirect in the JS would be helpful

example: https://p5js.org/reference/#p5/windowResized is still referenced from Google, should be https://p5js.org/reference/p5/windowResized/

aleannab commented 3 months ago

@Qianqianye Not sure if it's better to add it here or open a new issue, but there are a TON of additional broken links spread across many of the Contribute Subpages.

I saw that #461 has been opened specific to Contributor Guidelines. So here is a comprehensive list of all the other pages. I added what I assumed the link should direct to. There are a few (marked ???) that I am unsure about.

Our Focus on Access

Source link text Should direct to:
At the 2019 Contributors Conference, p5.js made the commitment to only add new features that increase access (inclusion and accessibility). https://p5js.org/hi/events/contributors-conference-2019/
Making p5.js error messages more helpful and supportive to people using the tool (e.g., the p5.js Friendly Error System (FES)) https://github.com/processing/p5.js/blob/main/contributor_docs/friendly_error_system.md
Hosting community events (e.g., p5.js Access Day 2022, https://p5js.org/events/p5js-access-day-2022/
I am Disabled: On Identity-First Versus People-First Language. ??? (page no longer exists)

Contributing to the p5.js Reference

Source link text Should direct to:
For more on describe() visit the web accessibility contributor documentation. https://p5js.org/contribute/contributor_guidelines/#accessibility
The contributor guidelines document is also a good place to start. https://p5js.org/contribute/contributor_guidelines/

Documentation Style Guide

Source link text Should direct to:
The only exception is explaining how to create libraries. https://p5js.org/contribute/creating_libraries/
Examples: src/data/examples/assets ???
Reference Pages: src/templates/pages/reference/assets ???
Learn Pages: src/assets/learn ???

Friendly Errors System Contribution Guide

Source link text Should direct to:
See the Friendly Error performance test. https://github.com/processing/p5.js-website/blob/main/src/content/contributor-docs/en/friendly_error_system.mdx

🌸 p5.js Friendly Error System (FES)

Source link text Should direct to:
The FES is a part of the p5.js’ internationalization effort. ???

How to add Friendly Error Messages(https://p5js.org/contribute/friendly_error_system/)

Source link text Should direct to:
First, ensure your method has inline documentation with the full list of your parameters. https://github.com/processing/p5.js/blob/main/contributor_docs/contributing_to_the_p5.js_reference.md
Unit Testing and Test Driven Development by Andy Timmons ??? (linked document is private)
Contributors Doc: Unit Testing https://github.com/processing/p5.js/blob/main/contributor_docs/unit_testing.md
For more in-depth information about the design and technical aspects of FES, please refer to the FES README document. https://github.com/processing/p5.js/blob/main/contributor_docs/friendly_error_system.md

Release process

Source link text Should direct to:
The GitHub Action “New p5.js release” is triggered on a tag that matches the pattern v*.*.* ???

Steward Guidelines

Source link text Should direct to:
ToC: Issues https://p5js.org/contribute/steward_guidelines/#issues
ToC: Bug report https://p5js.org/contribute/steward_guidelines/#bug-report
ToC: Feature request https://p5js.org/contribute/steward_guidelines/#feature-request
ToC: Feature enhancement https://p5js.org/contribute/steward_guidelines/#feature-enhancement
ToC: Discussion https://p5js.org/contribute/steward_guidelines/#discussionn
ToC: Pull Requests https://p5js.org/contribute/steward_guidelines/#pull-requests
ToC: Simple fix https://p5js.org/contribute/steward_guidelines/#simple-fix
ToC: Bug fix https://p5js.org/contribute/steward_guidelines/#bug-fix
ToC: New feature/feature enhancement https://p5js.org/contribute/steward_guidelines/#new-feature-feature-enhancement
ToC: Dependabot https://p5js.org/contribute/steward_guidelines/#dependabot
ToC: Build Process https://p5js.org/contribute/steward_guidelines/#build-process
ToC: Main build task https://p5js.org/contribute/steward_guidelines/#main-build-task
ToC: Miscellaneous tasks https://p5js.org/contribute/steward_guidelines/#miscellaneous-tasks
ToC: Release Process https://p5js.org/contribute/steward_guidelines/#release-process
ToC: Tips & Tricks https://p5js.org/contribute/steward_guidelines/#tips--tricks
ToC: Reply templates https://p5js.org/contribute/steward_guidelines/#reply-templates
ToC: GitHub CLI https://p5js.org/contribute/steward_guidelines/#github-cli
ToC: Managing notifications https://p5js.org/contribute/steward_guidelines/#managing-notifications
Please refer to p5.js’ design principles when making this decision on a case-by-case basis. https://p5js.org/contribute/contributor_guidelines/#software-design-principles
As part of p5.js’ commitment to increase access, a feature request must make a case for how it increases access of p5.js to communities that are historically marginalized in the field. More details are available here. https://github.com/processing/p5.js/blob/main/contributor_docs/web_accessibility.md
Does the feature fit into the project scope and design principles of p5.js? https://github.com/processing/p5.js/blob/main/contributor_docs/contributor_guidelines.md#software-design-principles
Pull request template can be found here. https://github.com/processing/p5.js/blob/main/.github/PULL_REQUEST_TEMPLATE.md
Next in lint:samples is eslint-samples:source, which is a custom written task whose definition is in ./tasks/build/eslint-samples.js ??? (local file path reference - remove link?)
Tasks that start with browserify are defined in ./tasks/build/browserify.js. ??? (local file path reference - remove link?)
This step is defined in ./tasks/test/mocha-chrome.js. ??? (local file path reference - remove link?)
Please see release_process.md. https://p5js.org/contribute/release_process/
See the docs here for how to create an addon: https://github.com/processing/p5.js/blob/main/contributor_docs/creating_libraries.md https://p5js.org/contribute/creating_libraries/

p5.js Web Accessibility

Source link text Should direct to:
If you want to use p5.js with a screen reader, visit the Using p5.js with a Screen Reader tutorial. https://p5js.org/tutorials/p5js-with-screen-reader/

WebGL Contribution Guide

Source link text Should direct to:
Read our p5.js WebGL architecture overview to understand how WebGL mode differs from 2D mode. https://github.com/processing/p5.js/blob/main/contributor_docs/webgl_mode_architecture.md
Read our contributor guidelines for information on how to create issues, set up the codebase, and test changes. https://p5js.org/contribute/contributor_guidelines/

p5.js WebGL Mode Architecture

Source link text Should direct to:
If you are looking for help using WebGL mode in your sketches, consider reading the WebGL tutorials on the p5.js Learn page instead. https://p5js.org/tutorials/#webgl
Qianqianye commented 3 months ago

Hi all, thanks for listing all the broken links. This is related to issue #461.

To share some context: all the pages included in p5js.org/contribute are generated directly from the contributor_docs folder within p5.js library GitHub repo. So there are two types of links for one documentation, below are two examples:

The .md extension in some link path causes some known broken link issues.

We think that all links in the documentations, including all the pages in p5js.org/contribute and their source md files in the contributor_docs folder in p5.js library GitHub repo, will go to the website page link, not GitHub library contributor_docs link. So if we fix the links, we'd fix the link in both p5js.org/contribute and the contributor_docs folder, to keep everything in sync.

@davepagurek @limzykenneth We discussed before that we could potentially solve this with some scripts. Before the automation script is done, would it make sense to assign some interested contributors to fix the broken links manually? If so, different contributors can take on fixing links in different docs to better organize the effort.

lindapaiste commented 1 week ago

A lot of Google's search results still use the old site's links, they are not broken so I suppose why they aren't updated yet a quick redirect in the JS would be helpful

example: https://p5js.org/reference/#p5/windowResized is still referenced from Google, should be https://p5js.org/reference/p5/windowResized/

There are going to be lots and lots of links in the old format around the web in places that we do not control. What should be done is to redirect the legacy URLs to new version. Ideally the server would return a 301 moved permanently code. Astro does support redirects: https://docs.astro.build/en/guides/routing/#redirects, though I'm not sure if the # presents a problem. If it does then we can definitely throw in some JS to redirect on the client side. Like this is super janky but works:

if (window.location.pathname.toLowerCase() === '/reference/' && window.location.hash.startsWith('#p5')) {
  const newUrl = window.location.href.replace('#', '');
  window.location.replace(newUrl);
}
davepagurek commented 1 week ago

I suspect as long as we're serving a static GitHub Pages site, we'll need to do this via JavaScript. It looks like the way Astro does redirects in static mode is by outputting HTML files for each source page that includes a <meta http-equiv="refresh" content="0;url=LOCATION" /> tag. Since all of our reference redirects would be in one page, /reference (since the stuff after # won't affect how GitHub's pages server looks up the content to serve), Astro wouldn't be able to make a separate destination for each old URL.

Your js snippet looks like just what we need though! It could probably be added right into the reference index layout.