Page tree

Versions Compared


  • This line was added.
  • This line was removed.
  • Formatting was changed.


  1. Our in-page navigation is currently sitting on the right side of the course description, which has been formatted to accommodate it alongside the body text. If we were going to implement the sticky function straightaway in its current form, the in-page navigation is going to overlap with the content further down the page. As a result, we need to create a design story to revisit our in-page navigation style and position. 

  2. We need to have a look at how we should indicate the 'active' state of the navigation. Example of solutions: Different colours of the headings when users are in that section? Bold text?  
  3. We need to keep in mind to create a new in-page navigation component that would work with other third party elements such as Gecko chat or the Ask a question bar. In implementation, some of the elements might also be set as 'hidden'. This is to avoid the accessibility issue stated in Accessibility section. 

The requirements from our Developers


Reference from GOV.UK, 2018, Sticky elements: functionality and accessibility testing, main issue with accessibility is the sticky header overlapped some content on the page , and navigating backwards through elements often left the focused element obscured by the sticky element. As a result, I recommend that we have a thorough manual accessibility testing once the floating in-page navigation was implemented.