5546 sujets

Sémantique web et HTML

ok... tout dabords, je tiens à mentioner que j'ai essayé plusieurs trucs mais que soit sa ne marchait, sois je n'y comprenais rien. alors, svp, envoyé moi pas le lien de carrés qui s'affichent sur les faces des beatles, je l'ai vu souvent cette page, mais nada. Même chose pour les rollover du site, disons que la tête me tourne a cause de la chaleur

DONC!!

voici la page sur laquelle je tente de créer des rollover sur les menus
http://www.freewebs.com/amelierobert/tests.htm

l'image originale ; http://www.freewebs.com/amelierobert/800x600.jpg
l'image pour les ''over'' ; http://www.freewebs.com/amelierobert/800x600%5Fover.jpg

J'ai tout découpé avec photoshop, commencons par 2 images

A - disons que celle ci
http://www.freewebs.com/amelierobert/images/AmelieRobert.com%2DINTRO.jpg
deviens
http://www.freewebs.com/amelierobert/over/AmelieRobert.com%2DINTRO.jpg

B - et qu'une autre image
http://www.freewebs.com/amelierobert/images/sondages.jpg
deviens
http://www.freewebs.com/amelierobert/over/sondages.jpg

alors...
l'image A est de 382x61 et est située à X: 0 Y: 0
l'image B est de 114x31 et est située à X: 0 Y: 76

comment je procède pour créer un rollover?

(alors que le code fourni par photoshop est dans ce style)

<table id="Table_01" width="800" height="600" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="5" rowspan="3">
<a href="index.html">
<img src="images/AmelieRobert.com-INTRO.jpg" width="382" height="61" border="0" alt=""></a></td>

<td colspan="4" rowspan="4">
<img src="images/800x600photoshop_02.jpg" width="326" height="76" alt=""></td>
<td>
<a href="fr.html">
<img src="images/Accueil.jpg" width="92" height="32" border="0" alt=""></a></td>
<td>
<img src="images/spacer.gif" width="1" height="32" alt=""></td>
</tr>
<tr>

<td>
<a href="http://www.amelierobert.com/fra.html">
<img src="images/fra.jpg" width="92" height="16" border="0" alt=""></a></td>
<td>
<img src="images/spacer.gif" width="1" height="16" alt=""></td>
</tr>



O_O

merci à 'avance

JAI BESOIN DE VOTRE AIDE!
Bonjour artamy,

Merci de bien vouloir mettre en forme ton message pour respecter les conventions de ce forum. En particulier, les blocs de code doivent toujours être présentés grâce à des balises [ code] et [ /code] (sans les espaces).

Merci d'avance. Smiley smile
Si tu as utilisé ImageReady (via Photoshop) pour faire ton découpe, tu aurais pu faire tes rollover grâce à ce logiciel. Ça donne un code imbuvable, non structuré, inaccessible… mais visuellement, « ça marche ».

Alsacréations est un forum consacré aux standards du web, et l'on y est quelque peu attaché à l'accessibilité des contenus web. ImageReady seul ne permet pas d'obtenir un résultat satisfaisant de ce côté là. Il est donc probable que l'on te conseille assez rapidement d'oublier les découpages à base de tableaux, pour utiliser plutôt des documents HTML structurés, mis en forme avec des feuilles de style CSS.

En l'occurrence, pour les rollover, on peut généralement les faire à partir d'images de fonds qui changent au survol des liens (a:hover). Là, comme tes images sont des images HTML (balise <img>), le seul moyen de faire un rollover est à base de javascript.