5568 sujets

Sémantique web et HTML

Bonjour tous (et toutes),


je suis chargé de réaliser une découpe d'un gros site, et je tombe sur un "os".
Il est précu dans se design un calendrier (type dotclear), j'aurais voulus avoir quelques précisions sur la manière de le coder pour être pleinement accessible : je ne suis pas habitué à faire des tableaux.

Pour l'instant j'ai fait ça :

<div id="agenda">
	<h3>Agenda</h3>
	<!-- Changement de mois : méthode 1 -->
	<p><a href="#" title="Mois précédent">&#60;&#60;</a> Septembre 07 <a href="#" title="Mois suivant">&#62;&#62;</a></p>
	<table>
		<!-- Changement de mois : méthode 2 -->
		<caption><a href="#" title="Mois précédent">&#60;&#60;</a> Septembre 07 <a href="#" title="Mois suivant">&#62;&#62;</a></caption>
		<thead> <!-- En-tête du tableau -->
			<tr>
				<th>lun.</th>
				<th>mar.</th>
				<th>mer.</th>
				<th>jeu.</th>
				<th>ven.</th>
				<th>sam.</th>
				<th>dim.</th>
			</tr>
		</thead>
		<tbody> <!-- Corps du tableau -->
			<tr>
				<td><a href="#" title="Aller au premier Septembre">1</a></td>
				<td><a href="#" title="Aller au deux Septembre">2</a></td>
				<td><a href="#" title="Aller au trois Septembre">3</a></td>
				<td><a href="#" title="Aller au quatre Septembre">4</a></td>
				<td><a href="#" title="Aller au cinq Septembre">5</a></td>
				<td><a href="#" title="Aller au six Septembre">6</a></td>
				<td><a href="#" title="Aller au sept Septembre">7</a></td>
			</tr>
			<tr>
				<td><a href="#" title="Aller au premier Septembre">8</a></td>
				<td><a href="#" title="Aller au premier Septembre">9</a></td>
				<td><a href="#" title="Aller au premier Septembre">10</a></td>
				<td><a href="#" title="Aller au premier Septembre">11</a></td>
				<td><a href="#" title="Aller au premier Septembre">12</a></td>
				<td><a href="#" title="Aller au premier Septembre">13</a></td>
				<td><a href="#" title="Aller au premier Septembre">14</a></td>
			</tr>
			<tr>
				<td><a href="#" title="Aller au six Septembre">15</a></td>
				<td><a href="#" title="Aller au six Septembre">16</a></td>
				<td><a href="#" title="Aller au six Septembre">17</a></td>
				<td><a href="#" title="Aller au six Septembre">18</a></td>
				<td><a href="#" title="Aller au six Septembre">19</a></td>
				<td><a href="#" title="Aller au six Septembre">20</a></td>
				<td><a href="#" title="Aller au six Septembre">21</a></td>
			</tr>
			<tr>
				<td><a href="#" title="Aller au six Septembre">22</a></td>
				<td><a href="#" title="Aller au six Septembre">23</a></td>
				<td><a href="#" title="Aller au six Septembre">24</a></td>
				<td><a href="#" title="Aller au six Septembre">25</a></td>
				<td><a href="#" title="Aller au six Septembre">26</a></td>
				<td><a href="#" title="Aller au six Septembre">27</a></td>
				<td><a href="#" title="Aller au six Septembre">28</a></td>
			</tr>
			<tr>
				<td><a href="#" title="Aller au six Septembre">29</a></td>
				<td><span>30</span></td>
				<td><a href="#" title="Aller au six Septembre">31</a></td>
			</tr>
	   </tbody>
	</table>
	
	
</div>


Les questions que je me poses sont les suivantes :
* Est-ce que la balise <caption></caption> est pleinnement/facilement personnalisable (à l'inverse de la balise <hr /> dont le style est interprété bizarement selon le navigateur [ie en particulier]) ?
* au niveau de l'accessiblité : quel solution il faut mieux pour le changement de mois ? dans le caption ou avant dans un paragraphe ?


D'avance merci pour vos réponses
Bonjour Smiley smile

Spy-Seth a écrit :
* Est-ce que la balise <caption></caption> est pleinnement/facilement personnalisable ?

Oui, pas de difficultés particulières.

Spy-Seth a écrit :
* au niveau de l'accessiblité : quel solution il faut mieux pour le changement de mois ? dans le caption ou avant dans un paragraphe ?

La balise caption doit être utilisée pour donner un titre au tableau. Donc, tu placeras tes liens de changement de mois hors de cette balise.

Rien à voir avec le web : il vous reste 5 heures et 37 minutes pour aller voter !!!
Modifié par Ericf (06 May 2007 - 14:25)
Ok merci beaucoup

Donc je stressais pour rien : caption est une balise on ne plus normale Smiley ravi

Dans ce cas là (sélection du mois hors du caption), qu'est-ce que je mets comme titre pour le calendrier dans le caption ? Smiley ohwell
Modifié par Spy-Seth (06 May 2007 - 14:35)
Ericf a écrit :
ben le mois en cours, non ?

Pas bête Smiley lol

Par contre, je viens de penser à un truc : si je mets le caption, je devrais le faire disparaître avec les CSS. Cela vaut-il vraiment le coût de le mettre ?
Pourquoi le faire disparaître ?
La balise caption apporte une information utile, le mois en cours dans ton cas, alors pourquoi vouloir cacher l'information ?
Je sais bien, mais le rendu final m'empèche de le garder.

Voila à quoi il doit ressembler : upload/10156-Image2.png
Modifié par Spy-Seth (06 May 2007 - 20:31)
Tu dois pouvoir utiliser un a pour le précédent, un caption pour le mois en cours, et enfin un autre lien pour le suivant, non?
<nicolas> a écrit :
Tu dois pouvoir utiliser un a pour le précédent, un caption pour le mois en cours, et enfin un autre lien pour le suivant, non?

Ça me semble difficile à mettre en place.
À vrai dire, le caption n'a rien d'indispensable. Vu l'image présentée par Spy-Seth, je dirais :

- titre de section hN pour le «Agenda»
- simple paragraphe pour le mois et les liens précédent et suivant ;
- un attribut summary correctement renseigné dans la balise <table>

Le summary me semble être le plus important.
Grrr. Non rien. Ça m'apprendra à lire en diagonale… Smiley fache


Désolé. Smiley confused
Modifié par Patidou (09 May 2007 - 17:18)
Je connaissais pas summary Smiley biggol , après des recherches dans la doc, il me convient parfaitement Smiley lol

Merci beaucoup Florent, nicolas, Ericf Smiley cligne



P-S : j'ai un problème sous IE 6 avec le tableau que je n'arrive à résoudre, j'essaye encore, mais si je n'y arrive pas je viendrais vous voir Smiley confused