web-dev-qa-db-fra.com

Google bot et navigation sur un site Web d'une page

Étant donné le code suivant:

<section id="about-us">
    <div class="Employee">
        <h2>Lorem</h2>
    </div>
    <div class="Employee">
        <h2>Lorem</h2>
    </div>
</section>

<section id="contact">
    <form>
        <input>
    </form>
</section>

Avec la navigation suivante

<nav>
    <ul>
        <li><a href="/about-us">About us</a></li>
        <li><a href="/contact">Contact</a></li>
    </ul>
</nav>

Si un utilisateur cliquait sur un lien, je le rattraperais avec JavaScript et me diriger vers la section correspondante, mais Google comprendrait ma logique et indexerait les pages / à propos de nous et / contact en deux pages séparées? Ou aurais-je intérêt à structurer la navigation de la manière suivante:

<nav>
    <ul>
        <li><a href="#about-us">About us</a></li>
        <li><a href="#contact">Contact</a></li>
    </ul>
</nav>
googlegooglebotnavigation
2
Wouter Rutgers

La réponse claire est non!

L'indexation Google est basée sur les URL et example.com/about est égal à example.com/about#anykey

Vous devez donc créer deux URL distinctes. Un pour À propos de nous et un pour Contact. Sinon, Google comprend que vous avez les deux sujets (À propos et Contact) dans une URL.

1
Mohsen Tavoosi محسن طاوسی

Ceci est basé sur mon expérience et les bons résultats que j'ai obtenus.

Je crée une version HTML de chaque "page" et utilise un iframe, un modèle ou un js pour capturer la page externe. Ainsi, même s’il reste un site Web d’une page en apparence, il s’agit en fait de plusieurs pages vous permettant d’écrire plus de méta-informations orientées SEO par page.

Quelque chose comme ça.

<html>
 <head>
    <script>
      function show(shown, hidden) {
      document.getElementById(shown).style.display='block';
      document.getElementById(hidden).style.display='none';
      return false;
      }
    </script>
 </head>
 <body>
    <a href="#" onclick="return show('Contact','Employee');">Contact</a>
    <a href="#" onclick="return show('Employee','Contact');">Employee</a>
    <div id="employee">
      <iframe src="employee.html" border="0"></iframe>
    </div>
    <div id="contact" style="display:none">
      <iframe src="contact.html" border="0"></iframe>
    </div>
 </body>
</html>

ou comme ça.

<body>
    <a name="employee"></a>        
    <iframe src="employee.html" border="0"></iframe>
    <a name="contact"></a>    
    <iframe src="contact.html" border="0"></iframe>
</body>
1
norcal johnny