Améliorer un site pour la navigation mobile

Bonjour à tous,

j'ai monté un site pédagogique l'an dernier. Je l'ai créé essentiellement pour un usage depuis un poste fixe ou ordinateur portable. Je n'ai pas trop réfléchi à son accessibilité depuis un autre type de terminal (smartphone, tablette), faute d'en être moi-même un utilisateur régulier. Or, c'est bien ce genre de terminal que mes élèves utilisent préférentiellement. J'ai commencé à tenter de l'améliorer, mais je sèche sur un point précis.

Sur cette page: http://tbouffand.free.fr/citath/ath2.php, le survol des différents éléments de la carte par la souris fait apparaître une infobulle (ou du moins un bidouillage qui en tient lieu) tandis que le clic sur l'élément en question permet d'ouvrir une nouvelle page. Ce système est conçu pour naviguer à la souris, mais n'est pas pratique avec un smartphone ou une tablette.
Ma question est donc la suivante: comment améliorer ce système, sans renoncer si possible à l'ensemble infobulle-lien cliquable?
Modifié par bouffandt (13 Jul 2016 - 14:30)

Cela ne va pas aller. Sur l'écran d'un mobile, l'image prendrait toute la largeur. Il faut changer le système. Probablement faire plusieurs pages, une pour chaque info-bulle, avec une grosse touche retour arrière pour revenir à l'image de départ.

Merci pour ta réponse! Je vais essayer de réfléchir à cela.
Ou alors je pensais que je pouvais rendre l'infobulle elle-même cliquable. Pour régler le problème, je pourrais faire en sorte que l'infobulle s'affiche par-dessus l'image?
Enfin, je pense que le menu de navigation à droite prend trop de place sur l'écran. Il faut que je le masque, par exemple dans la zone de titre de la page...