Fragments are used to load different sections of the Info Page
mahasneh opened this issue · comments
Describe the bug
In Info Pages, sections within the pages are not (1) discoverable and cannot be (2) referenced and (3) shared/bookmarked. This is caused by loading different sections of the page without updating the (1) URL and (2) the Browser history.
To Reproduce
Steps to reproduce the behavior:
- Go to an Info Page, like Code of Conduct, available at: https://www.josa.ngo/info/code-of-conduct
- Click on a section from the sidebar, for example ''Workplace ethics"
- The section of the page is loaded.
4a. Clicking on 'back' on the browser will not revert to the previous state in Browser history, (Introduction in this case),
4b, Additionally, the linked / loaded sections cannot be referenced (i.e deep-linked).
4c, The content of the section is not crawled by search engines.
Expected behavior
First, the Browser should retain the statuses as content is loaded, i.e. when a section is loaded, the user should be able to return to the previous section by clicking the Browser's 'back' button, similarly, she should be able to navigate to the next section loaded, by clicking 'next'.
Second, the URL should change so it can be shared/copied/bookmarked, by using the SectionId
entered by the editor, e.g. when the user first visits the page she should get https://www.josa.ngo/info/code-of-conduct
, when the ''Workplace ethics" section is loaded, the URL should switch to https://www.josa.ngo/info/code-of-conduct#work-ethics
. Note that work-ethics
after the hash is the SectionId
of that specific section. A request to a specific section in the Info page should eventually load that section, e.g. a request to https://www.josa.ngo/info/code-of-conduct#work-ethics
will open the Code of Conduct on the "Workplace ethics" section.
Third, crawlers should be able to discover content, refer to: https://developers.google.com/search/docs/advanced/javascript/javascript-seo-basics
Screenshots
N/A
Desktop (please complete the following information):
Irrelevant.
Smartphone (please complete the following information):
Irrelevant.
Additional context
None.