Switching between pages
At some point, the user will need to go to another page or change context. We are going to make them think this is happening, but in reality, it is going to be a magic trick since really, they will never move from the first HTML we gave them at the beginning. However, and here’s the key, they will perceive that the page is being changed. To achieve this deception (sorry, achievement), we will carry out the following tasks:
- Change the HTML of the main content or everything that belongs to
<main>. Meanwhile, we will always keep the static sections of the pages, such as<header>,<aside>, or<footer>. - Implement server-side rendering to render the HTML belonging to each URL.
- Visually mark in the
<nav>where we are with a CSS style. - Modify the browser URL via the JavaScript API. It is an aesthetic change but the URL acts as breadcrumbs to guide the visitor.
