Nouveau modele pour le site www.pyromaths.org

Faites part de vos remarques/problèmes/solutions pour les sites pyromaths.org.

Modérateur: Développeurs

Nouveau modele pour le site www.pyromaths.org

Messagede Jérôme » Ven 16 Avr 2010, 10:24

Bonjour,
Yves m'a demandé il y a quelques semaines combien de connexions il y avait sur le module pyromaths en ligne. C'est environ 6000 par mois. Il m'a alors fait remarqué qu'il serait plus logique que le module pyromaths en ligne soit plus visible sur la page d'accueil.
Ça me trotte dans la tête depuis et je suis en mesure de vous proposer un modèle pour le futur site pyromaths.org
Il ne s'agit que d'un brouillon, donc les liens ne sont pas fonctionnels. c'est juste pour avoir une idée précise. Le code xhtml et css est valide. Je ne l'ai vu que sous Firefox. Je suppose qu'IE va tout foutre en l'air, mais ça m'est égal. :P
J'aimerais que vous me fassiez part de vos remarques si vous en avez (ergonomie, lisibilité, etc).
Pyromaths génère des fiches d'exercices et leur corrigé en toute simplicité.
Un programme multi-plateformes libre et gratuit sous licence GPL
Avatar de l’utilisateur
Jérôme
Administrateur - Site Admin
 
Messages: 1073
Inscription: Sam 26 Aoû 2006, 13:10
Localisation: Nantes

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Yves » Ven 16 Avr 2010, 12:42

Esthétiquement c'est très réussi. J'aime bien la sobriété et la clarté qui améliorent la lisibilité. Je pense que l'ergonomie est vraiment améliorée.
Parmi les améliorations à apporter, au premier coup d'oeil, je n'avais pas vu la corrélation entre la partie droite et la partie gauche de l'animation:

Image

L'aspect du pied de page pourrait également être amélioré, je trouve qu'il dénote un peu avec le reste de la page.
Avatar de l’utilisateur
Yves
 
Messages: 454
Inscription: Mer 21 Jan 2009, 21:40

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Jérôme » Ven 16 Avr 2010, 15:28

Merci Yves pour tes remarques. J'ai tenté d'y répondre au mieux. J'ai mis à jour le lien du premier post.
Pyromaths génère des fiches d'exercices et leur corrigé en toute simplicité.
Un programme multi-plateformes libre et gratuit sous licence GPL
Avatar de l’utilisateur
Jérôme
Administrateur - Site Admin
 
Messages: 1073
Inscription: Sam 26 Aoû 2006, 13:10
Localisation: Nantes

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Yves » Ven 16 Avr 2010, 16:32

J'ai vu que tu as inversé presentation_gauche et presentation_droite. Par contre, comme maintenant je connais le principe de fonctionnement, je ne peux pas te dire si c'est mieux ou pas pour quelqu'un qui découvre le site. De mon côté, j'ai aussi réfléchi à une idée, rajouter une flèche dans l'image case_a_cocher.png pour obtenir quelque chose comme ça:

Image

Je préfère la version sans header.png (sans le dégradé). Pour le footer, je ne suis pas encore convaincu. Je crois que quelque chose de plus sobre serait mieux.

Mes remarques concernent des détails et je trouve que ce modèle pour le futur site est vraiment excellent ! Bravo Jérôme pour ton travail :)
Avatar de l’utilisateur
Yves
 
Messages: 454
Inscription: Mer 21 Jan 2009, 21:40

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Jérôme » Ven 16 Avr 2010, 17:28

Merci Yves. Tu la fais comment la flèche ? Je la trouve très esthétique.
Pyromaths génère des fiches d'exercices et leur corrigé en toute simplicité.
Un programme multi-plateformes libre et gratuit sous licence GPL
Avatar de l’utilisateur
Jérôme
Administrateur - Site Admin
 
Messages: 1073
Inscription: Sam 26 Aoû 2006, 13:10
Localisation: Nantes

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Yves » Ven 16 Avr 2010, 18:11

Avec Skitch qui n'existe malheureusement que pour Mac OS X. En rajoutant 50 pixels à gauche de case_a_cocher.png, voilà ce que ça peut donner :

Image
Avatar de l’utilisateur
Yves
 
Messages: 454
Inscription: Mer 21 Jan 2009, 21:40

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Jérôme » Ven 16 Avr 2010, 18:17

Super ! Est-ce que j'abuse si je te la demande en png ? :?
Pyromaths génère des fiches d'exercices et leur corrigé en toute simplicité.
Un programme multi-plateformes libre et gratuit sous licence GPL
Avatar de l’utilisateur
Jérôme
Administrateur - Site Admin
 
Messages: 1073
Inscription: Sam 26 Aoû 2006, 13:10
Localisation: Nantes

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Yves » Ven 16 Avr 2010, 18:20

L'image est déjà en png ;)
Avatar de l’utilisateur
Yves
 
Messages: 454
Inscription: Mer 21 Jan 2009, 21:40

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Jérôme » Ven 16 Avr 2010, 19:56

Ah oui. Je n'avais pas activé les javascripts et je n'avais donc pas accès à la version "taille large". D'où ma question. Merci beaucoup. Je vois ce que je peux en faire.
Pyromaths génère des fiches d'exercices et leur corrigé en toute simplicité.
Un programme multi-plateformes libre et gratuit sous licence GPL
Avatar de l’utilisateur
Jérôme
Administrateur - Site Admin
 
Messages: 1073
Inscription: Sam 26 Aoû 2006, 13:10
Localisation: Nantes

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Jérôme » Ven 16 Avr 2010, 23:27

Yves a écrit:J'ai vu que tu as inversé presentation_gauche et presentation_droite. Par contre, comme maintenant je connais le principe de fonctionnement, je ne peux pas te dire si c'est mieux ou pas pour quelqu'un qui découvre le site. De mon côté, j'ai aussi réfléchi à une idée, rajouter une flèche dans l'image case_a_cocher.png pour obtenir quelque chose comme ça:

Je ne parviens pas à ajouter la flèche, car l'image est en background et la flèche sort du cadre, donc n'est pas affichée. Si quelqu'un à une solution pour mon css, je suis preneur. Cela dit, j'aime bien la version menu à gauche et ça me semble assez clair.

Yves a écrit:Je préfère la version sans header.png (sans le dégradé).
Pas moi :mrgreen:
Yves a écrit:Pour le footer, je ne suis pas encore convaincu. Je crois que quelque chose de plus sobre serait mieux.
Hum. J'aimais bien. Cela dit, je ne sais pas trop quoi mettre dans le footer, à part les 2 infos déjà écrites. C'est un peu court, non ?
Yves a écrit:Mes remarques concernent des détails et je trouve que ce modèle pour le futur site est vraiment excellent !
Merci beaucoup Yves.Ça fait plaisir. Je n'avais jamais autant bossé sur les css. C'est laborieux mais intéressant.
Pyromaths génère des fiches d'exercices et leur corrigé en toute simplicité.
Un programme multi-plateformes libre et gratuit sous licence GPL
Avatar de l’utilisateur
Jérôme
Administrateur - Site Admin
 
Messages: 1073
Inscription: Sam 26 Aoû 2006, 13:10
Localisation: Nantes

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Yves » Sam 17 Avr 2010, 12:33

Jérôme a écrit:Je ne parviens pas à ajouter la flèche, car l'image est en background et la flèche sort du cadre, donc n'est pas affichée. Si quelqu'un à une solution pour mon css, je suis preneur.


En utilisant les propriétés padding-left et margin-left, ça fonctionne :) :

Code: Tout sélectionner
.presentation_droite{
  width:50%;
  float:right;
  overflow:hidden;
  height:345px;
}

.presentation_gauche{
  border:1px solid #ffa628;
  width:49%;
  height:345px;
  float:left;
  position:relative;
}

.presentation_droite_haut{
  position:relative;
  line-height:24px;
 
}

.presentation_droite_haut h2{
  margin-left:60px;
}

.presentation_droite_haut a{
  padding-left:60px;
  background:transparent url(img/case_a_cocher.png) no-repeat right top;
  display:block;
  text-decoration:none;
}

.presentation_droite_bas{
  padding-left:60px;
}
Avatar de l’utilisateur
Yves
 
Messages: 454
Inscription: Mer 21 Jan 2009, 21:40

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Jérôme » Sam 17 Avr 2010, 13:43

Merci Yves. En effet, ça fonctionne. Je crois que je n'avais pas assez agrandi mon cadre (50% maintenant). C'est mis à jour et je suis convaincu.
Pyromaths génère des fiches d'exercices et leur corrigé en toute simplicité.
Un programme multi-plateformes libre et gratuit sous licence GPL
Avatar de l’utilisateur
Jérôme
Administrateur - Site Admin
 
Messages: 1073
Inscription: Sam 26 Aoû 2006, 13:10
Localisation: Nantes

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Arnaud » Sam 17 Avr 2010, 20:51

C'est joli, et il y a du jquery !
C'est de toi ou tu as récupéré le code ?
J'effectuerais encore un léger grossissement de la description que tu as déjà mise en gras ( le h2 de diapo_contenu ).

Au niveau du header, tu sais déjà que j'aime les dégradés, mais ce gris là me parait mal choisi, cela terni trop la page.
Il y a trop d'espace entre les blocs de navigation et les contenus, et le logo est trop petit.
Pour ce dernier, on peut envisager beaucoup de solutions qui le mettent en évidence sans trop prendre de place.

Le footer, ça va pas, tout simplement :mrgreen:
Avatar de l’utilisateur
Arnaud
Critique officiel de pyromaths
 
Messages: 603
Inscription: Sam 26 Aoû 2006, 21:49
Localisation: Allemagne

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Arnaud » Sam 17 Avr 2010, 20:53

Et les border-bottom dans nav + presentation sont inutiles et alourdissent le tout.
On peut obtenir un résultat aéré sans trop de marges, à condition de ne pas surcharger de traits partout :)
Avatar de l’utilisateur
Arnaud
Critique officiel de pyromaths
 
Messages: 603
Inscription: Sam 26 Aoû 2006, 21:49
Localisation: Allemagne

Re: Nouveau modele pour le site www.pyromaths.org

Messagede Jérôme » Sam 17 Avr 2010, 22:58

Salut Arnaud,
merci pour toutes ces remarques. Le jquery (je savais que ça te plairait) n'est pas de moi. Je dois même avouer que je n'y comprends rien. Mais ça fonctionne et c'est joli.
Je ne sais pas ce que vous avez contre mon dégradé ! :) Chez moi, il est très discret.
Concernant l'espace entre le bloc nav et le reste, je suis d'accord. Par contre, le logo me semble joli à cette taille là, mais je veux bien faire un essai. J'attends donc tes nombreuses solutions :)
Le footer, ok. Mais j'ai besoin de votre aide là.
Enfin, les border-bottom, je suis tout à fait d'accord. C'était juste pour essayer de répondre à Yves. Mais il a trouvé nettement mieux depuis et j'ai oublié de les enlever.
J'ai modifié en conséquence. Dites-moi ce que vous en pensez.
Pyromaths génère des fiches d'exercices et leur corrigé en toute simplicité.
Un programme multi-plateformes libre et gratuit sous licence GPL
Avatar de l’utilisateur
Jérôme
Administrateur - Site Admin
 
Messages: 1073
Inscription: Sam 26 Aoû 2006, 13:10
Localisation: Nantes

Suivante

Retourner vers À propos du site et du forum pyromaths.org

Qui est en ligne

Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 2 invités

cron