Bonjour à tous,

J'espère que vous me pardonnerez ma question peut-être simpliste mais je suis bloqué depuis plusieurs jours tout en ayant le sentiment que la réponse à mon problème est simple.

J'ai entrepris de refondre un premier site créé en novembre dernier sur lequel la navigation laissait à désirer.

J'ai trouvé sur ce site quelques astuces pour créer de fausses colonnes (header, menu et principal) afin d'améliorer la navigation car le menu contient 150 liens... Je sais c'est de la folie mais ce site est destiné à illustrer photographiquement toutes les espèces d'un genre de cactus et il n'est guère possible de procéder autrement.

Le problème réside dans le fait que je n'arrive pas trouver la façon de faire s'ouvrir un lien du menu dans ma fenêtre principale...

Je suis bête ou bien ?

ah oui, je suis en xhtml strict.

Merci pour tout début d'aide.

jj42
Bonjour,

Ce que tu cherches à reproduire est une frame, cela n'a rien à voir avec le pseudo-colonnes et n'est pas vraiment recommandé (problèmes d'accessibilité et de référencement).

Par contre il n'est absolument pas nécessaire de recourrir à cette technique pour avoir un menu fonctionnel et identique sur toutes les pages. La meilleure solution, ici, serait d'utiliser un peu de PHP, en particulier la fonction "include" qui permet de "coller" une portion de texte provennant d'un autre fichier dans ta page.
Bonjour et merci pour ton avis.

J'ai peur de comprendre que je n'ai rien compris...

Ou alors je me suis mal fait comprendre.

Effectivement, je cherche à copier le mode de fonctionnement des frames mais sans y avoir recours puisque j'ai bien vu que cette pratique n'était plus recommandable. J'ai trouvé sur ce site des exemples de positionnement fluide avec positionnement flottant. Je me suis donc inspiré de ces tuto mais bute sur le point évoqué plus haut.
Tu sembles donc me dire que mon souhait de voir un menu dans une colonne et l'affichage de la cible dans l'autre n'est pas réalisable de cette manière.

Pour être concret, voici le site actuel que j'ai bricolé comme j'ai pu <http://houdste.free.fr/index.html> et qui présente l'inconvénient majeur d'avoir le menu copié 150 fois, c'est à dire autant qu'il y a de pages dans ce menu. Je ne te dis pas la lourdeur, la difficulté à maintenir dès lors que je veux ajouter une espèce... Par ailleurs le menu à gauche défile en même temps que la page, ce qui n'est pas pratique du tout.

Que me conseilles tu pour remédier à ces inconvénients majeurs ?
C'est très simple. Tu as deux façons d'envisager les choses : soit tu considères que c'est au contenu de la page de venir se greffer dans le design, soit que c'est au design de se greffer autour du contenu. Le premier doit être traîté avec précautions à cause des problèmes de sécurité qu'il peut engendrer, l'autre est sans doute moins "intuitif".

Partons du principe que tu veux utiliser la première méthode. Le but va être que tu aies une page unique contenant ton design : index.php, et dans cette page tu vas inclure du contenu en fonction d'un paramètre passé à cette page. Ainsi tes différentes pages seront reconnues par ce genre d'URL :
http://monsite.fr/index.php?page=rubrique1.
index.php ressemblera en gros à ceci (c'est très très schématisé et très incomplet) :
<!doctype>
<html>
   <head>
      <title>mon site</title>
   </head>
   <body>
      <div class="header"><!-- mon header --></div>
      <div class="menu"><!-- mon menu --></div>
      <div class="contenu">
         <?php include $_GET['page'].'.php'; ?>
      </div>
      <div class="footer"><!-- mon footer --></div>
   </body>
</html>
Ainsi, ça te permet de n'avoir qu'un seul fichier contenant le design de ton site avec son menu, etc., et lorsqu'un utilisateur voudra cliquer sur un lien de ce fameux menu, il suffira de le rediriger vers la même page, en changeant simplement le paramètre dans l'URL. Ce dernier ressemblerait donc à quelque chose du genre :
<ul>
   <li><a href="index.php?page=rubrique1">rubrique1</a></li>
   <li><a href="index.php?page=rubrique2">rubrique2</a></li>
   <li><a href="index.php?page=rubrique3">rubrique3</a></li>
   ...
</ul>
Le problème de sécurité que cette méthode pose c'est qu'il est donné à n'importe qui de modifier l'URL, et donc le paramètre qui y est présent, et d'écrire par exemple quelque chose du style :
http://monsite.fr/index.php?page=script_hacker.php
...ce qui aurait pour effet de faire exécuter un script malveillant à ton site. Pour éviter ça, il suffit de bien protéger la variable $_GET['page'], que ce soit avec la fonction htmlspecialchars(), ou bien simplement en n'autorisant qu'une liste prédéfinies de valeurs.

Le jour où tu voudras mettre ton design à jour, tu n'auras alors plus qu'une seule page à modifier. Smiley cligne

Concernant la mobilité du menu par rapport au scroll, sache qu'il est possible de le "fixer" via du CSS, avec la propriété position: fixed, mais elle n'est pas reconnue par IE6, même s'il est possible de contourner le problème.
Modifié par phpdoesnotcare (04 May 2010 - 15:52)