0

I am quite novice to SEO and I own a website called pierre-alexandre.io. Since it's a single page with a lot of HTML, I decided to split the html source into 3 different files. So my index.html looks like this:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description"
        content="Pierre-Alexandre Mousset, Computer Science student at Northeastern University, Boston.">
    <meta name="image" property="og:image" content="img/overview.jpg">
    <link rel="shortcut icon" type="image/x-icon" href="./img/logo.ico">
    <link rel="stylesheet" href="styles.css">
    <link href="https://fonts.googleapis.com/css?family=Varela:400,700,900&display=swap" rel="stylesheet">
    <title>Pierre-Alexandre Mousset | Software Developer</title>
    <meta name="google-site-verification" content="xyggjPTWK5WmpNKSbQduvv******kC9GXb1g7ruQ6E" />
</head>

<body>

    <nav>
        <ul>
            <li class="logo">P-A Mousset</li>
            <li class="items"><a href="#about">About me</a></li>
            <li class="items"><a href="#projects">Portfolio</a></li>
            <li class="items"><a href="#contact">Contact</a></li>
            <li class="items"><a target="_blank" href="https://github.com/Pierre-Alexandre35">Github</a></li>
            <li class="btn btn-nav"><a onclick="toggleNav()"><i class="fas fa-bars"></i></a></li>
        </ul>
    </nav>

    <section id="about" class="about"></section>
    <section id="projects" class="projects"></section>
    <section id="contact" class="contact"></section>

    <footer>
        <p> &copy; All Rights Reserved 2020</p>
        <p>Designed by Pierre-Alexandre Mousset</p>
    </footer>

    <script src="https://kit.fontawesome.com/a076d05399.js"></script>
    <script src="scripts/app.js"></script>
</body>

</html>
<!DOCTYPE html>

I am loading each html component on app.js

window.onload = function() {
    fetch("sections/about.html").then(data => data.text()).then(data => {
        document.querySelector("#about").innerHTML = data
      })
      fetch("sections/projects.html").then(data => data.text()).then(data => {
        document.querySelector("#projects").innerHTML = data
      })
      fetch("sections/contact.html").then(data => data.text()).then(data => {
        document.querySelector("#contact").innerHTML = data
      })
}

Whenever I run an SEO audit, they told me that the length of my page is too short. How can I fix it?

2
  • Fragment identifier URLs with the hash sign are not recommended for SEO. Could you find a way to implement it using normal URL paths? – Stephen Ostermiller Jan 9 at 1:11
  • or you could make it a .php file and use include() – Steve Jan 9 at 2:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.