Structuration d'une page avec un menu.
Bonjour,
Ce sujet concerne également HTML/CSS (la balise <a>) mais je crois que je recherche une réponse côté PHP voir JS. À vous de m'aiguiller. C'est une question d'ordre général. Je vous explique.
J'ai l'habitude de faire des menus avec des listes (<ul> puis <li>) et ensuite de créer autant de page que j'ai de li.
J'estime que cela alourdit le site en nombre de pages et ralentit les performances car je recharge une nouvelle page pour chaque appel au menu.
Existe-t-il un moyen (sans doute en PHP ou peut-être en JS) de ne charger que ce qui change dans une page ? Essentiellement le lien actif du menu et une <section> complète. Je parle de <section> au sens HTML5.
Merci pour vos bons conseils par avance. :)
9 réponses
Passe par un MVC. Tuto ici: http://www.grafikart.fr/tutoriels/php/developper-site-jour1-base-donnees-183
Regarde les 7 tutos pour t'aider.
Par contre il faut de bonnes connaissances en php et être alaise avec les bases de données.
Après si ton site n'est pas trop lourd en terme de contenu, tu peux toujours procédé par des includes (pour séparer les vues de ton contenu)
Montre nous le code d'une de tes pages et décrit nous un peu l'arborescence de ton site pour voir quelle methode est la plus judicieuse ;)
Ou utilise un template, c'est tout aussi bien dans ton cas. Tout dépend de la taille de ton site.
Pour un ptit site le MVC n'est pas un avantage (en terme de temps de code), par contre, si le site est assez conséquent, il y a un sacré gain de temps.
Stevens a raison, c'est vrai que le MVC est long à mettre en place.
Si tu fais un site static alors c'est vraiment inutile. Le système de template sera bien plus approprié.
Fais-toi un template avec genre le header, le menu et le footer en fichier séparés que tu viendras inclure dans tes différentes pages. (en passant par <?php include 'header.php';?> pour le header par exemple)
L'avantage c'est que tu pourras faire évoluer ton site bien plus facilement (ajouter des menus, optimiser ton site pour le référencement par le header...)
Fais nous part de plus de détails sur la structure de ton site si tu as besoin d'aide.
Bonjour,
Chose promise, chose due.
Voici le code d'une de mes pages.
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
<title>Le site du collectif "Ressources"</title>
<meta name="DC.title" content="collectifressources.com, le site du collectif Ressources" />
<meta name="description" content="Site du collectif Ressource, praticiens en bien-être du sud Essonne" />
<meta name="keywords" content="bien-être, praticiens, santé, sud-Essonne,
Bouray-sur-Juine, Cerny, Étréchy, Janville-sur-Juine" />
<meta name="author" content="Philippe"/>
<meta name="geo.region" content="FR-75" />
<meta name="geo.placename" content="Bouray-sur-Juine, Essonne, Ile-de-France, France" />
<meta name="geo.position" content="48.516133;2.294324" />
<meta name="ICBM" content="48.516133, 2.294324" />
<link rel="stylesheet" media="all" href="style/base.css" />
<link rel="stylesheet" media="all" href="style/collectif.css" />
<link href='http://fonts.googleapis.com/css?family=Amaranth' rel='stylesheet' type='text/css'>
<meta name="viewport" content="width=device-width" />
<!--[if lt IE 9]>
<link rel="stylesheet" href="style/styles-ie.css" />
<script src="jvs/html5-ie.js"></script>
<![endif]-->
</head>
<body>
<!--[if lte IE 7]>
<link rel="stylesheet" href="style/styleie6.css" />
<div class="alert-ie6" style="padding: 1em; background: #900; font-size: 1.1em; color: #fff;">
<p><strong>Attention ! </strong> Votre navigateur
(Internet Explorer 6 ou 7) présente de sérieuses lacunes en terme
de sécurité et de performances, dues à son obsolescence
(il date de 2001).<br />En conséquence, ce site sera consultable
mais de manière moins optimale qu'avec un navigateur récent
(<a href="http://www.browserforthebetter.com/download.html"
style="color: #fff;">Internet Explorer 9+</a>,
<a href="http://www.mozilla-europe.org/fr/firefox/"
style="color: #fff;">Firefox 4+</a>,
<a href="http://www.google.com/chrome?hl=fr" style="color:
#fff;">Chrome 11+</a>,
<a href="http://www.apple.com/fr/safari/download/"
style="color: #fff;">Safari 5+</a>,...)</p>
</div>
<![endif]-->
<header role="banner">
<h1>
<p id="logo"></p>
<p id="titre">
<a href="index.htm">
<span id="ressources">Collectif «Ressources»</span>
</a>
<span id="harmonie">association pour l'harmonie</span>
</p>
</h1>
<nav role="nav_page">
<ul>
<li class="active"><a href="#">
Présentation
<p>Le collectif "Ressources"</p></a>
</li>
<li><a href="equipe.php">
L'équipe
<p>Une association collégiale</p></a>
</li>
</ul>
</nav>
</header>
<div id="separation"></div>
<section>
<img src="./image/lesensducollectif.png" width="185px" />
<p id="accueil">La constitution de l'Organisation Mondiale de la Santé,
adoptée à New York le 22 Juillet 1946, définit la santé comme : «
<strong>un état de bien être total physique, social et mental de la personne. Ce
n'est pas la simple absence de maladie ou d'infirmité.</strong>»
Pourtant, trop souvent encore, nous nous estimons heureux d'être en
bonne santé. C'est-à-dire <em>de ne pas être malade.</em><br />
Au sein du collectif "Ressources", nous croyons que le bien-être engage
dans le même temps la personne et le système de santé accessible au plus
grand nombre. Il est encore difficile en France de dialoguer entre
médecine traditionnelle et ce que d'aucun appelle les «médecines
douces.»<br />
Notre objectif est de combler ce manque en proposant des conférences,
des ateliers, des stages et un salon annuel pour vous présenter les
pratiques de bien-être qui peuvent vous apporter une aide inestimable
quand les petits maux quotidiens dont vous souffrez finissent par prendre
toute la place…</p>
</section>
<nav role="navigation">
<ul>
<li><img src="image/icone/icone-apropos.png" alt=""><a href="association.php" title="En savoir plus sur le collectif «Ressources»">L'association</a></li>
<li><img src="image/icone/icone-conference.png" alt=""><a href="conference.php" title="Les conférences et les ateliers que nous organisons">Conférences, Ateliers</a></li>
<li><img src="image/icone/icone-formspring.png" alt=""><a href="http://www.formspring.me/collressources" title="Vous êtes curieux ? N'hésitez pas">Une question ?</a></li>
<li><img src="image/icone/icone-mail.png" alt=""><a href="contact.php">Contactez-nous</a></li>
<li><img src="image/icone/icone-stage.png" alt=""><a href="stage.php" title="Les stages que nous organisons">Stages</a></li>
<li><img src="image/icone/icone-pratique.png" alt=""><a href="pratique.php" title="Les pratiques de bien-être">Les pratiques </a></li>
</ul>
</nav>
<footer>
<h2>Ils vous accueillent…</h2>
<div id="separation"></div>
<section>
<ul id="enpied">
<li><a href="http://latriadedubienetre.fr"
title="Le site de Philippe Idlas, Kinésiologue®">
<img src="./image/latriadedubienetre.jpg"
alt="Image du site de Philippe Idlas,
latriadedubienetre.fr, kinésiologue" />
</a></li>
<li><a href="http://www.dynamic-reflex.fr"
title="Le site de Laetitia Jouaux">
<img src="./image/dynamicreflex.jpg"
alt="Image du site de Laetitia Jouaux,
dynamic-reflex.fr" />
</a></li>
<li><a href="http://www.sourcesdebienetre.com"
title="Le site de Sonia Le Follic">
<img src="./image/sourcesbienetre.jpg"
alt="Image du site de Sonia Le Follic,
sourcesdebienetre.com" />
</a></li>
</ul>
</section>
</footer>
<!--[if lte IE 8]>
<script type="text/javascript" src="http://www.collectifressources.com/jvs/respond.min.js"></script>
<![endif]-->
</body>
</html>La structure de mon site est la suivante :
racine -> tous les répertoires et toutes les pages avec un fichier index.html
pages -> toutes les pages comportent le menu de navigation (role=[navigation])
-> les pages peuvent aussi avoir leur propre menu de navigation (role=[nav_page])
Voilà pour l'essentiel.
Qu'en pensez-vous ? :)
Cordialeme,t.
Je pense vraiment pas qu'un MVC soit utile ici... Tu vas te prendre la tête trop longtemps pour peu de chose.
Passe plutôt par des includes ;)
Tu peux faire ton propre système de template, pour ça il faudra maitriser les fonctions file_get_content(), et str_replace(), rien d'autre.
Pour les includes, faudra surtout maitriser la faille include. Voici un tuto qui en parle : http://www.grafikart.fr/tutoriels/php/decomposer-site-php-31
Mais attendez, vous dites des modèles de template, mais il ne s'agit ici que des includes et qui dit un include ne dit pas forcément un systhème de cache, les includes n'aident qu'à titre d'organisation, le choix d'un MVC pour ton cas n'est pas une solution ( ça sert à rien de choisir un framwork pour un petit projet), sinon je ne sais pas s'il y a une possibilité pour appliquer le cache sur une partie du site (sidebar par exemple qu'on peut par exemple mettre dans un fichier à part - sidebar.php - ).
je suis entièrement d'accord avec stitox. Utiliser un MVC pour ce type de projet reviendrai à perdre son temps.
D'accord.
Ce projet n'est qu'à son début.
À terme, il y aura une lettre d'information, un système de news, un forum, et des pages réservées à des praticiens qui devront faire leurs propres mises-à-jour...
Cela change-t-il vos avis ?