Table des matières:
Vidéo: Tutoriel jQuery : Créer une carte interactive 2025
Lorsque vous créez une carte de site visuelle, vous créez un diagramme de toutes les pages sur un site Web, y compris l'interconnectivité des pages principales à travers la navigation et la sous-navigation. Vous utilisez ensuite ces informations pour vous aider à rassembler et à définir le contenu du site, ainsi que vous servir de guide utile lors de la création de la maquette de la conception du site.
Une fois votre site entièrement construit, vous pouvez à nouveau utiliser cette carte visuelle visuelle pour vous aider à créer une page HTML Site Map, qui sera ajoutée au site sur le serveur hôte distant en tant qu'outil permettant aux visiteurs de naviguer dans le site. site en utilisant une liste de liens hypertextes.
Ce qu'il faut inclure sur la page du plan du site HTML
Sous sa forme la plus élémentaire, la page HTML Site Map contient une liste de liens hypertextes standards vers toutes les pages d'un site Web. Cette liste devrait inclure des liens vers la page d'accueil, vers toutes les pages et sous-pages principales du site et vers d'autres pages du site qui pourraient ne pas être accessibles via la navigation principale, comme une politique de confidentialité ou un service client.
Pour de meilleurs résultats, enregistrez la page avec le sitemap du nom de fichier. html et présente tous les hyperliens vers les pages du site dans un format de liste simple.
Pour rendre cette page terminée accessible, vous devez inclure un lien vers celle-ci dans le pied de page et y ajouter un lien dans la tête de la page. Ces deux actions permettront de rendre le site plus accessible à
-
Visiteurs handicapés utilisant des programmes de lecture d'écran ou d'autres appareils
-
Visiteurs ayant d'autres préférences de navigation, tels que les navigateurs texte uniquement et les navigateurs avec JavaScript désactivé
-
Les visiteurs qui souhaitent être en mesure de accéder directement à n'importe quelle page du site en un seul clic, plutôt que d'utiliser le système de navigation principal du site
-
Les visiteurs qui veulent voir en un coup d'œil toutes les pages d'un site et savoir comment ils sont organisés
Créer une page de carte de site
La création d'une page de carte de site au format HTML est assez simple. Il s'agit juste d'insérer un ensemble d'hyperliens listés qui mènent au reste des pages sur le site.
-
Ouvrez la page d'accueil de votre site Web dans Dreamweaver ou dans votre éditeur de code HTML ou WYSIWYG préféré.
Si vous utilisez Dreamweaver, assurez-vous que le panneau Fichiers répertorie votre site en tant que site géré. Sinon, choisissez Site → Gérer les sites pour sélectionner votre site dans la liste.
-
Choisissez Fichier → Enregistrer sous et, lorsque la boîte de dialogue Enregistrer sous s'ouvre, enregistrez une copie de la page d'accueil au niveau racine de votre site géré avec le sitemap du nom de fichier. html
La nouvelle page semble identique à la page d'accueil, y compris tous les éléments de conception du site, le placement du logo et la navigation.
-
Dans la zone principale modifiable de la page, sélectionnez et supprimez tout le contenu spécifique à la page d'accueil.
Vous avez maintenant la possibilité d'insérer une liste de liens hypertexte.
-
Placez votre curseur en haut de la zone vide et tapez le nom de toutes les pages du site, y compris la page Plan du site, avec un nom par ligne, tel qu'il apparaît sur la carte visuelle du site.
Par exemple, utilisez les noms de page Accueil, À propos, Produits, Presse, Magasins, Contactez-nous et Plan du site.
-
Sélectionnez tous les mots et convertissez-les en liste non ordonnée, convertissant ainsi chaque nom de page en élément de liste.
Le code HTML de la page Plan du site doit utiliser les balises non ordonnées, comme indiqué dans l'exemple de code suivant:
- Accueil
- À propos de
- Produits
- Appuyez sur
- Magasins
- Contact Nous
- Carte du site
Lorsque vous créez votre propre page de carte du site au format HTML, assurez-vous d'inclure des liens dans cette liste vers toutes les pages de votre site qui ne sont pas liées à la navigation principale. Par exemple, si votre site inclut des pages Politique de confidentialité, Conditions d'utilisation et Assistance clientèle, ajoutez des liens vers ces pages en bas de la liste, directement au-dessus du lien vers la page Plan du site.
-
Si vous avez des sous-pages, ajoutez ces pages à la liste sous-ensemble de la page principale, comme indiqué dans cet exemple:
- Accueil
- A propos de
- Produits
- Argent
- Or
- Appuyez sur
- Magasins
- Contactez-nous
- Carte du site
Par exemple, le site Web Sugar Monkey ne contient aucune sous-page, vous pouvez donc ignorer cette étape.
-
(Facultatif) Si vous le souhaitez, entrez une phrase descriptive sous chaque élément de la liste afin d'aider les visiteurs à découvrir ce qu'ils peuvent trouver sur chaque page.
Une telle description peut aider les visiteurs à consulter les pages et aider les moteurs de recherche à localiser et indexer chacune des pages du site.
Par exemple, si vous deviez ajouter des descriptions à la page HTML Sugar Monkey Site Map, l'un de vos éléments de liste pourrait ressembler à ceci:
- À propos de
Découvrez les fondateurs de Sugar Monkey et découvrez la véritable histoire derrière le succès de Sugar Monkey.
-
Convertissez chacun des noms de pages de la liste en liens hypertexte vers leurs pages respectives sur le site, en vous assurant que chaque lien inclut son propre attribut title.
Par exemple, si l'élément About list devenait un lien vers la page About, votre code pourrait ressembler à ceci:
- About
Découvrez les fondateurs de Sugar Monkey et découvrez la véritable histoire du succès de Sugar Monkey.
-
Enregistrez vos modifications, fermez le sitemap. fichier html et téléchargez une copie de ce fichier sur le serveur hôte distant du site.
Testez la page dès que possible et corrigez les fautes de frappe ou les erreurs de codage. Si vous apportez des modifications, téléchargez le fichier corrigé sur le serveur hôte distant.
Personne ne connaîtra cette page tant que vous n'ajoutez pas quelques liens pour rendre la page accessible aux visiteurs du site.
