1485 sujets

Web Mobile et responsive web design

Bonjour à tous
J'ai un site wordpress que je développe et j'ai un petit souci de duplication de contenu cause à des éléments responsives bootstrap car j'utilise des balises en css de type none ou hidden pour éviter de le rendre visible en fonction des appareils, comme la barre de recherche qui n'est pas au meme endroit en fonction des dispositifs.

Je souhaiterais s'avoir quelle fonction php pour que le menu se charge en fonction des résolutions et ainsi supprimer les éléments css pour faire un menu mobile et un menu desktop bien distinct.

Cordialement tony
Modifié par promomoto (17 Sep 2017 - 01:59)
En attendant un support correct du module CSS Grid Layout - qui nous évitera de nous poser ce genre de questions - il ne me semble pas utile de devoir passer du côté serveur pour éliminer une barre de recherche, ou même un menu de navigation dupliqué. Je ne pense pas que cela impacte sur le référencement.

Si le layout reste simple à appréhender vous pouvez aussi utiliser flexbox et les order (ex : "order: -1") pour changer un élément de place dans le flux html.
La duplication de contenu survint quand tu as plusieurs urls qui sont indexées pour la même page ou que tu as une page au contenu similaire à celle d'un autre site.
Pour éviter le "duplicate content", le recours à l'URL canonique est une solution. Une petite recherche sur Google avec les mots clés "duplicate content canonical url" fournira toutes les explications nécessaires sur le sujet.
Quand au code php cela renvoie du code html fixe donc il n'y a pas de variante par résolution.

Cela n'est pas bien grave d'avoir des éléments masqués sur mobile. Beaucoup de sites responsives ont des éléments masqués sur diverses résolutions, c'est une nécessité.

Pour éviter d'avoir des éléments en double dans le code, comme parfois on est obligé de déplacer l'emplacement d'un menu sur mobile, le plus simple reste de le déplacer avec javascript.
Modifié par bzh (17 Sep 2017 - 11:47)