How should routing/navigation be handled when converting this into a multi-page static site?

[kiwigitops]

I’m planning to refactor this template into a multi-page setup instead of a single-page layout.

Before I do that, I want to understand the intended structure:

Should each page be a full HTML duplicate with shared components manually synced?
Is there any pattern in this repo for reusing layout sections (navbar/footer) across pages?
Are relative asset paths (CSS/JS/images) set up in a way that supports nested routes, or will that require refactoring?

I’m trying to avoid breaking navigation or asset loading when moving away from a single entry point, so any guidance on best practices with this template would help.

[AdamHanafi]

✅ Converting to Multi-Page Static Site – Quick Guide
Here's the recommended approach for refactoring this template:

1. Page Structure
   Each page should be a complete standalone HTML file.

Duplicate index.html for every new page (about.html, services.html, contact.html, etc.)
Keep the full , navbar, footer, and scripts in every file
Remove content that doesn't belong on that specific page

2. Navigation
   Update your navbar links to point to real pages instead of sections:
   HTML
   Home
   About
   Services
   Contact
   Remove any JavaScript that was handling smooth scrolling between sections.
3. Asset Paths (Important)
   Use root-relative paths for all CSS, JS, and images so they work from any page:
   HTML

<script src="/assets/js/main.js"></script>

This also makes it easy to add nested folders later. Quick Tips

Test locally using npx serve or VS Code Live Server
file:// protocol can hide path issues, so always test with a local server
For small sites, manual duplication is perfectly fine
For larger sites, consider adding Eleventy or Astro later to reuse navbar/footer easily

This keeps navigation clean and prevents broken assets when moving away from the single-page setup.