1 - Créer un menu déroulant
2 - Les menus formatés avec des styles
1 - Créer un menu déroulant
Dans mes pages Web, le menu est assez long. Comment faire pour n'afficher que
les titres, puis obtenir les items du menu en cliquant sur les titres? Autrement
dit, est-il possible de créer un menu déroulant avec FrontPage?
Il n'y a pas de menu déroulant tout fait dans FrontPage. Le JavaScript,
autrefois utilisé pour créer ce type de menu, est de plus en plus souvent remplacé par
des blocs de liens colorés à l'aide de feuilles de style, ce qui donne toujours
un résultat accessible pour tous.
Voici une page détaillant fort bien les commandes à utiliser pour créer
différents modèles de menus, tout en conservant l'accessibilité même lorsque le
JavaScript est désactivé:
https://www.pompage.net/pompe/deroulants/
Et les règles à suivre pour conserver l'accessibilité dans les menus:
https://www.alsacreations.com/article/lire/571-accessibilite-des-menus-de-navigation-en-cascade.html
2 - Les menus formatés avec des styles
Comment faire personnaliser
un menu de liens hypertexte tout en conservant leur accessibilité?
Actuellement, les menus sont souvent préparés en créant d'abord une liste
avec des puces. Ensuite des formats y sont appliqués à l'aide de styles
CSS pour masquer les puces, colorer l'arrière-plan, placer le tout à l'horizontal
ou non... Dans ce cas, le menu devient vraiment accessible pour tous car
il peut s'afficher dans tous les navigateurs.
Par exemple, si vous créez un site à partir des modèles fournis par Expression
Web, vous verrez que le modèle suit ce principe. Pour repérer les commandes
utilisées, affichez d'abord le Sélecteur de balise rapide (au besoin, voir
au menu Affichage), puis cliquez dans la barre de navigation. Les balises
utilisées à cet endroit s'inscrivent dans la barre d'outils du Sélecteur,
juste au-dessus de l'espace de travail:
<div#navigation> <ul> <li> <a>
Dans la feuille style2.css, voyez ensuite quelles sont les instructions
relatives à cette division nommée #navigation, comme celles-ci:
#navigation li {
float: left;
}
#navigation a {
display: block;
}
Vérifiez ensuite le résultat dans différents navigateurs, en désactivant
au besoin les images et le JavaScript. Normalement, les liens doivent être
fonctionnels quand même.
Pour compléter, voici des tutoriels utilisant des styles:
https://www.alsacreations.com/tuto/lire/574-Creer-des-menus-simples-en-CSS.html
http://ressources.mediabox.fr/tutoriaux/expression/expression_
web/menu_horizontal
http://ressources.mediabox.fr/tutoriaux/expression/expression_
web/menu_bouton