Discussion :

[frmars]

Bonjour

Sur mon site, classiquement, un bandeau cliquable ramène à l'accueil.

Je souhaite désormais inclure dans ce même bandeau, sur la droite, 3 boutons cliquables.

je pense pour le moment redessiner le bandeau (Photoshop), qui resterait une seule et même image, et à créer des zones cliquables à l'interieur, à l'emplacement des boutons.

Est-ce faisable ? si oui, je ne connais la méthode. Quelle est-elle donc ?

Est-ce une approche "intelligente" htmllement parlant ?ou vaut-il mieux privilégier une autre solution ?

[12monkeys]

Bonsoir

Cette méthode s'appelle zones réactives ou map.

Voici la méthode pour y parvenir : http://j-willette.developpez.com/tut...page_2#LII-D-2

[Yorick]

Salut,

La technique des map area est toujours bonne à connaitre et pourrait répondre au besoin mais elle ne me semble pas adaptée en plus d'être assez lourde*.

Frmars, il y aura plusieurs façon de faire selon ton image et le comportement visuel que tu veux associer à ton menu. Mais au niveau de la structure html on aura deux choses distincte : un retour à la home et une liste de lien.
On peut donc écrire la structure suivante qui ne devrait pas poser de pb de compréhension :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
<div id="header">
  <h1 id="logo">
    <a href="url_accueil"> nom de ton site </a>
  </h1>
  <ul id="menu">
    <li><a href="url_accueil">Accueil</a></li>
    <li><a href="url_page1">Blibli</a></li>
    <li><a href="url_page2">Blabla</a></li>
    <li><a href="url_page3">Blublu</a></li>
  </ul>
</div>

J'ai répété accueil dans le menu car si les gens voient un menu ils peuvent s'attendre à ce que le retour à l'accueil se fasse par ce biais, et si ils ne le voient pas ils peuvent penser que ce n'est pas faisable...mais c'est toi qui voit.

Tout le reste va se faire dans la CSS. Ici (forum html) ce n'est pas trop le sujet et les solutions dépendent comme je l'ai dit de ton image et des comportements visuels que tu veux.

Si tu bloques sur la CSS, créé un sujet en oubliant pas de nous mettre une maquette (un visuel quoi) de ce que tu souhaite obtenir, on verra alors quel stratégie adopter pour le découpage de l'image le cas échéant.

* Pour en revenir au map area ce n'est pas adapté car ce n'est pas fait pour ce que l'on peut comprendre par "un bandeau classique".

L'usage de map area peut se justifier pour des découpages complexes ou atypiques éventuellement mais l'impossibilité de styler les areas est une grosse contrainte.

De plus si l'on considère l'aspect sémantique du html alors il faut voir les map area comme un graphique dont le comportement ne peut être dissocié de la forme (pas sûr d'être clair là).

Ca exclue donc (de manière générale) un header dont l'apparence (image de fond, emplacement des liens...) peut changer au grès des envies.

L'usage logique des map area porte en premier lieu sur des choses comme des cartes réactives ou éventuellement des organigrammes.

[frmars]

Bien reçu vos deux réponses.

J'ai vaguement conscience que ce n'est pas une solution "idéale" ergonomiquement parlant de mettre un lien dans un bandeau, mais pour l'instant j'en suis là. Je dispose dajà d'une barre de liens classique, gérée en CSS, mais le bouton du bandeau a justement vocation à mettre en relief un appel plus important et qui nécessite une présence graphique plus forte.

J'ai appliqué la technique des maps. Qui marche ma foi fort bien et n'est pas lourde pour deux zones rectangulaires.

Merci à vous.