28172 sujets

CSS et mise en forme, CSS3

bonjour a tous

debutant ou presque, je me lance dans la creation d'un site, et voila mon souhait:

il est affiché une liste d'activités d'un groupe de personnes; si je clique sur le "bouton" (rectangulaire) "cinema", le bouton change de couleur et les sorties cinema prennent un background de la meme couleur que le bouton.
si ensuite je clique sur le "bouton" "plein air", le bouton "cinéma" revient a sa couleur initiale, le bouton "plein air" se colore, ainsi que les sorties de plein air etc...

les boutons correspondent donc a des radio puisqu'un seul type d'activité est possiblement coloré.

questions:
* dois je mettre des boutons radio et mettre dessus des images (d'où ma question dans la partie css, puisqu'a priori ca en sera dans ce cas)? si c'est la solution, comment?

* dois je faire du JS? si possible je voudrai eviter cette solution car pour l'accessibilté ce n'est pas top, mais si il n'y a que ca comme solution, je prend bien sûr...

toute autre solution est bien sûr la bienvenue

merci
As part si tu gère ca coté serveur, avec donc un envoie du formulaire à chaque fois, ce qui est très , très très pénible, tu va être à mon sens obliger de passer par du js.

Et au contraire "l'accessibilité" en utilisant du js sera meilleur que en façonnant un "hack" pur css3.
pr eviter le retour par le formulaire, de l'ajax pourrait passer non?

on m'a expliqué brievement ce que c'etait, a savoir un appel au serveur en arriere plan, sans avoir a envoyer un formulaire...

ai je bien compris et est ce la solution a la penibilite que tu annoncais?

p
je continue, car mon message a ete envoyé en faisant une action inapropriée

par ailleurs, ne sachant pas ce qu'est un hack en css3, je ne peux que te faire confiance sur le fait que le JS sera + accessible... pourtant, on m'avait dit que JS et accessibilité ne faisaient pas forcement bon menage, est ce faux?

merci
Alors pour ce qui est de l'ajax, bien que ce soit en arrière plan, c'est tout de même un appel au serveur, et à l'heure des smartphones et du fair use, tes utilisateurs ne pourront que te remercier d'épargner leur forfait. De plus c'est assez paradoxale avec ta vision négative sur le Javascript puisque pour ce faire la technologie ajax nécessite du javascript.

Pour ce qui est de l'accessibilité du Javascript, Il est vrai que les navigateurs un peu ancien, utilise des version obsolète et il n'y a donc pas parfaite compatibilité entre les navigateurs. De plus tout utilisateur peut à tout moment désactiver le Js. Cependant le JS est bien plus crossBrowser que le css3. (et perso à part utiliser des chekbox je ne voit pas comment résoudre ton problème en full css , ce qui est un manipulations boiteuse).

Ton attachement à l'accessibilité est une bonne chose, il faut en effet essayé de faire fonctionner son site de manière intelligible, sans le recours du js et même du css, cependant pour c'est actions cosmétiques (bien qu'utile pour l'ergonomie) l'utilisation du js permet de dynamiser ton site. En gros c'est bien de penser à tout le monde mais il ne faut pas pénaliser tout le monde parce que 1% de ton public à désactiver JS de son navigateur.

Donc pour moi, sauf avis contraire, ici tu ne pourras utiliser autre chose que du js.

PS : pour l'expression "hack css", "hack [insère ton language ici]" alors déjà je me suis trompé en l'utilisant il n'avait pas sa place dans ma phrase, mais un hack est en faite un détournement de l'utilisation première d'un bout de code pour palier des faiblesses d'un languages,( on nommes ca aussi des polyfils pour js), en gros tu essaye à partir d'une version obsolète de codé un comportement similaire à la nouvelle version. (vous pouvez me corriger i je dis une connerie).

[EDIT] : il existe un article sur les hack css.
Modifié par thej8 (25 Mar 2014 - 08:39)
Administrateur
Bonjour,

francki06 a écrit :
par ailleurs, ne sachant pas ce qu'est un hack en css3, je ne peux que te faire confiance sur le fait que le JS sera + accessible... pourtant, on m'avait dit que JS et accessibilité ne faisaient pas forcement bon menage, est ce faux?

il fallait je pense comprendre "pousser CSS3 dans ses retranchements et au bout de ses possibilités", hack dans sa traduction (grosse) "bidouille" et pas un hack ciblant l'un ou l'autre navigateur. Et je confirme que JS est bien plus passe-partout et, au final, simple ici.

Pour l'accessibilité (aux personnes handicapées) et le JavaScript, ce n'est plus un problème si le site le justifie. Et c'est un problème pour tout le monde si le site ne fonctionne pas sans JS donc pas que de l'accessibilité de toute façon. Le problème est plutôt de savoir si imposer JS est pertinent ou pas. Pour un site de contenu, non, toujours pas et pour un formulaire bien complexe, oui ça peut se justifier.
Une action via JS doit se faire sur un élément de formulaire : champ, button (pas un lien) ou bouton de soumission.
Les modifications à la page apportées par une action JS doivent agir sur ce qui suit (dans l'ordre du code HTML) : un lecteur d'écran ne sait pas qu'une zone dans le code HTML qui précède a été modifiée, ajoutée ou supprimée.
L'écueil dans ce que tu veux faire est de ne pas utiliser que des styles CSS ou la couleur pour afficher l'information : les lecteurs d'écran, entre autres, liront le texte ou le label de la même manière qu'il soit bleu, noir ou rouge, italique ou gras.
Si des sorties ne sont pas sélectionnables, alors il faudrait qu'elles soient disabled je pense : c'est ce que HTML prévoit pour ça (et bien entendu ça se dé-style super mal, dans IE en particulier mais c'est une autre histoire).