Tener cada estado en una imagen independiente no es lo que suele hacerse. De las formas más antiguas, es usar un mapa de coordenadas de HTML. Aunque es un trabajo de chinos hacerlo.
Lo que puedes hacer, es mediante CSS crear un contenedor con posición relativa, y luego cada estado aplicarle una posición absoluta y ajustar con
top/right/bottom/left.
Luego también puedes crear un
mapa en SVG, que diría yo que es la forma más
de hoy de hacerlo. Mucho más dinámico que cualquier otra forma. Y tiene un buen soporte entre navegador —quitando filtros y efectos.
La última opción es más recomendable que las dos primeras. Mucho más limpio.
