web-dev-qa-db-fra.com

site web de conception utilisant l'approche de modèle d'en-tête et de pied de page

J'essaie de refaire le site Web de mon portefeuille, car il est difficile de le maintenir. Chaque fois que je dois ajouter un nouvel élément, cela prend une éternité et me tue. J'aimerais revoir la conception de manière à faciliter le flux de travail pour ajouter de nouveaux éléments. Je ne cherche pas d'effets de fantaisie, mais un simple site Web qui facilite la navigation dans mes contenus.

Toutes les pages sont des fichiers HTML autonomes. Chaque page a un en-tête et un pied de page communs pour la navigation entre les pages. À l'heure actuelle, chaque fois que je dois modifier le contenu, j'essaie de creuser dans quelle ligne il se trouve, puis d'y ajouter du contenu. (oui, j'utilise le bloc-notes).

Quelqu'un peut-il me recommander s'il vous plaît quelle serait la meilleure façon de s'y prendre?

(PS: S'il vous plaît faites le moi savoir si j'ai manqué quelque chose).

1
brainydexter

Il existe probablement 1000 façons de le faire, dont les coûts, le contrôle et la complexité varient.

Si vous accédez à PHP ou même simplement à SSI, vous pouvez déplacer les parties communes dans des fichiers séparés et les inclure si nécessaire, afin que chaque page se compose principalement de ce qui est différent.

Vous pouvez utiliser un système de modèles dans lequel une application telle que Dreamweaver conserve des modèles. Chaque fois que vous la modifiez, elle vous invite à mettre à jour vos autres fichiers. Vous devez ensuite synchroniser les modifications.

Vous pouvez également créer ou acheter un système de gestion de contenu permettant de générer des pages Web pour vous. Vous remplissez le contenu dans des formulaires de saisie complexes, en utilisant parfois un éditeur WYSIWYG, et la plate-forme enregistre automatiquement les modifications. Ceci est une version simplifiée à l'extrême de ce que fait Wordpress.

3
Itai

Vous pouvez télécharger le programme d’installation Web de Microsoft Web Platform . Il vous permet de parcourir de nombreuses applications Web populaires et de les installer. Un CMS open source gratuit que j’ai trouvé très utile est Orchard CMS, que vous pouvez également télécharger via le programme d’installation de la plate-forme Web Microsoft. Vous pouvez l'utiliser pour créer rapidement un site Web simple. Il est également très facile d'effectuer des mises à jour et des modifications.

3
texter

Vous pouvez utiliser un simple code PHP pour rendre votre site un peu dynamique, par exemple.

Tout d'abord, vous devez modifier votre extension .html en .php (si votre hébergement sur un serveur Linux supporte PHP).

Deuxièmement, créez une page appelée header.php et mettez-y votre code HTML (que vous souhaitez inclure dans chaque page que vous avez), le code d'en-tête et le code de menu par exemple.

Puis mettez ce code php dans vos fichiers

<?php
include('header.php');
?>

et mettez ce code dans chaque page que vous avez au lieu de:

<html>
<head>
....
</head>
<body>
<!-- Sample menu elements -->
<div id="nav">
<ul>
<li><a href="http://example.com/">home</a></li>
<li><a href="http://example.com/about.php">about</a></li>
<li><a href="http://example.com/contact.php">contact</a></li>
</ul>
</div>
<!-- End of sample menu elements -->

Ainsi, lorsque vous devez modifier un élément de menu, vous ne devez pas mettre à jour chaque page. Vous venez de mettre à jour le fichier header.php .

En passant, je vous suggère de cesser d'utiliser des tableaux et d'aller vers des DIV ou même HTML5 , surtout si vous concevez votre portefeuille (cela reflétera votre qualité de travail).

Check this post: Pourquoi ne pas utiliser des tableaux pour la mise en page en HTML

1
Ammar Alakkad

Utilisez XSLT pour générer votre sortie X/HTML. Il est pris en charge par les navigateurs les plus répandus. Il est idéal pour appliquer un seul modèle à plusieurs documents sans traitement côté serveur.

0
danlefree