Les calendriers ne sont pas sémantiquement des images, un tableau serait mieux #15

New issue

Closed

opened 2023-10-17 08:25:39 +00:00 by quentin · 1 comment

quentin commented

2023-10-17 08:25:39 +00:00

Owner

J’aurais tendance à conseiller de faire un vrai tableau html, histoire d’avoir quelque chose de sémantique pour ça (ou alors de tout aria-hidden si vous jugez que la liste des événements ci-dessus suffit et que les calendrier ont uniquement une fonction decorative.

via @tixie

Actuellement :

        <div id="mois_suivant" role="img" aria-label="calendrier de nos jours de permanence prévus pour le mois prochain">
          <pre aria-hidden="true">.——————————————————————————————————————.
|       CALENDRIER OCTOBRE 2023        |
|——————————————————————————————————————|
|                                ————  |
|                               | 01 | |
|  ———— ———— ———— ———— ———— ———— ————  |
| | 02 |<span class="highlight"> 03 </span>| 04 | 05 | 06 | 07 | 08 | |
|  ———— ———— ———— ———— ———— ———— ————  |
| | 09 | 10 | 11 | 12 | 13 |<span class="highlight"> 14 </span>| 15 | |
|  ———— ———— ———— ———— ———— ———— ————  |
| | 16 | 17 | 18 | 19 | 20 | 21 | 22 | |
|  ———— ———— ———— ———— ———— ———— ————  |
| | 23 | 24 | 25 | 26 | 27 | 28 | 29 | |
|  ———— ———— ———— ———— ———— ———— ————  |
| | 30 | <span class="highlight">31</span> |                          |
|  ———— ————                           |
|______________________________________|</pre>
	</div>

Idéalement :

<table>
    <thead>
        <caption>
            CALENDRIER OCTOBRE 2023
        </caption>
    </thead>
    <tbody>
        <th>
            <td>Lundi</td>
            <td>Mardi</td>
            <td>Mercredi</td>
            <td>Jeudi</td>
            <td>Vendredi</td>
            <td>Samedi</td>
            <td>Dimanche</td>
        </th>
        <tr>
            <td></td> <!-- empty-cells is a CSS property -->
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td>01</td>
        </tr>
        <tr>
            <td>02</td>
            <td>03</td>
            <td class="highlight">04</td> <!-- si il y a un evenement ce jour -->
            <td>05</td>
            <td>06</td>
            <td>07</td>
            <td>08</td>
        </tr>
    </tbody>
</table>

Idéalement avec le même rendu ASCII art ^^

> J’aurais tendance à conseiller de faire un vrai tableau html, histoire d’avoir quelque chose de sémantique pour ça (ou alors de tout aria-hidden si vous jugez que la liste des événements ci-dessus suffit et que les calendrier ont uniquement une fonction decorative. via @tixie Actuellement : ```xml <div id="mois_suivant" role="img" aria-label="calendrier de nos jours de permanence prévus pour le mois prochain"> <pre aria-hidden="true">.——————————————————————————————————————. | CALENDRIER OCTOBRE 2023 | |——————————————————————————————————————| | ———— | | | 01 | | | ———— ———— ———— ———— ———— ———— ———— | | | 02 |<span class="highlight"> 03 </span>| 04 | 05 | 06 | 07 | 08 | | | ———— ———— ———— ———— ———— ———— ———— | | | 09 | 10 | 11 | 12 | 13 |<span class="highlight"> 14 </span>| 15 | | | ———— ———— ———— ———— ———— ———— ———— | | | 16 | 17 | 18 | 19 | 20 | 21 | 22 | | | ———— ———— ———— ———— ———— ———— ———— | | | 23 | 24 | 25 | 26 | 27 | 28 | 29 | | | ———— ———— ———— ———— ———— ———— ———— | | | 30 | <span class="highlight">31</span> | | | ———— ———— | |______________________________________|</pre> </div> ``` Idéalement : ```xml <table> <thead> <caption> CALENDRIER OCTOBRE 2023 </caption> </thead> <tbody> <th> <td>Lundi</td> <td>Mardi</td> <td>Mercredi</td> <td>Jeudi</td> <td>Vendredi</td> <td>Samedi</td> <td>Dimanche</td> </th> <tr> <td></td>  <td></td> <td></td> <td></td> <td></td> <td></td> <td>01</td> </tr> <tr> <td>02</td> <td>03</td> <td class="highlight">04</td>  <td>05</td> <td>06</td> <td>07</td> <td>08</td> </tr> </tbody> </table> ``` Idéalement avec le même rendu ASCII art ^^