3246 sujets
Critiques de vos sites: code et design
Super_baloo8 a écrit :
Il faut que l'on revois la page d'accueil. D'ici quelques jours je pense que cela sera possible.
En effet, comme on dit chez-nous, "mettez un homme et un pick-up là-dessus" parce que j'ai cru que c'était une équipe de Soccer ou un truc du genre. J'ai cherché pas mal (bon, à peine 30 secondes, mais c'est déjà trop) avant de découvrir ce que c'était.
Tony Monast a écrit :
(bon, à peine 30 secondes, mais c'est déjà trop)
Ca c'est parce que t'es un bon
Sans rires, il faut vraiment que je change cette premiere page, mais pour ce soir ca me fait legerement trop tard :s
Merci pour tout vos conseils, je vais en suivre un maximun demain, bonne soirée à tous, je vous tiens au courant
Super_baloo8 a écrit :
Lol, Ok
Je doute que le terme "Actualité" définisse le contenu du site et sa thématique.
Le but du titre est d'indiquer, de présenter de façon concise le site... de réduire le site à un quasi "slogan publicitaire".
Exemple ; Forum Alsacréations : Css et Standards Web. Avec ce titre on sait qu'il s'agit d'un forum de discussion et que l'on y vient pour papoter css et standards web.
Mais c'est toi qui choise
Modifié par fredmac (06 Jun 2006 - 22:49)
Bonjour,
En fait c'est plutôt catastrophique comme site car le hiatus entre la noblesse du projet et les modalités de la consultation est énorme.
1. les pseudos infobulles du marketing way of life javascripté doivent être obligatoirement virées.
2. La présentation du projet WCG devrait apparaitre dès la page index au moins sous forme condensée, les actualités pourraient très bien se placer après dans le flux de ce document. Au passage cette présentation dans sa version "étoffée" devrait être beaucoup plus complète et informative qu'elle ne l'est pour l'instant.
3. Je préfère ne pas insister sur l'agression que constitue la pollution de la présentation évoquée dans le point deux par les lamentables et pathétiques éléments du point un.
En fait c'est plutôt catastrophique comme site car le hiatus entre la noblesse du projet et les modalités de la consultation est énorme.
1. les pseudos infobulles du marketing way of life javascripté doivent être obligatoirement virées.
2. La présentation du projet WCG devrait apparaitre dès la page index au moins sous forme condensée, les actualités pourraient très bien se placer après dans le flux de ce document. Au passage cette présentation dans sa version "étoffée" devrait être beaucoup plus complète et informative qu'elle ne l'est pour l'instant.
3. Je préfère ne pas insister sur l'agression que constitue la pollution de la présentation évoquée dans le point deux par les lamentables et pathétiques éléments du point un.
Super_baloo8 a écrit :
Liens javascript HS
Alors là je kif grave
Pour les actus elles sont très bien en première page je trouve (en fait c'est un peu leur place). La première présentation du projet pourrait tout simplement très bien chapeauter le tout sous la forme d'un abstract avec lien à suivre pour une version étayée.
Super_baloo8 a écrit :
Liens javascript HS
Pas tellement hors-sujet, dans le sens où ces publicités donnent une mauvaise image au site et au logiciel que les gens doivent installer pour faire partie de l'équipe.
Si l'objectif premier du site est de faire augmenter les membres de l'équipe en donnant de l'information sur le projet et les outils requis, il faut absolument virer ces publicités. Je ne dois pas être le seul en ce bas monde à être légèrement paranoiaque lorsqu'il s'agit d'installer un logiciel sur mon ordinateur. Si le logiciel se trouve sur un site soupoudré de liens sponsorisés et de bandeaux publicitaires de Casino, j'aurais tendance à douter un peu de la sécurité et de la propreté du logiciel proposé sur le site.
Comme le revenu généré par la publicité est requis, alors vous devriez choisir un peu mieux vos partenaires. Des sites moins douteux disons. Personnellement, je classe les publicités de Casino au même niveau que les publicités pornos.
Pense-y !
Modifié par Tony Monast (06 Jun 2006 - 23:13)
(pour les lien JS HS, je voulais dire Hors Service, et non pas Hors Sujet )
Vous m'avez personnellement convaincu !
Pour l'instant, il n'y a plus aucune pub sur le site !
Mais il vas falloir qu'on trouve une bonne regie publicitaire (peut etre google adsense avec ses annonces ciblée ?)
Modifié par Super_baloo8 (06 Jun 2006 - 23:18)
Vous m'avez personnellement convaincu !
Pour l'instant, il n'y a plus aucune pub sur le site !
Mais il vas falloir qu'on trouve une bonne regie publicitaire (peut etre google adsense avec ses annonces ciblée ?)
Modifié par Super_baloo8 (06 Jun 2006 - 23:18)
clb56 a écrit :
Zut moi j'avais compris qu'ils allaient être mis Hors Service. C'était pour ça que j'étais content
C'est peut-être pour cette raison qu'il faut éviter le langage SMS ou les abbréviations sur ce forum. En plus, quand tu as dis que tu kiffais grave, je n'étais pas certain de la signification de "kiffer". Ne me provoquez pas ou sinon je vais sortir un joli sacre Québécois.
À cause de ca, j'ai perdu mon temps grave. Je vous déteste...
Modifié par Tony Monast (06 Jun 2006 - 23:24)
Tony Monast a écrit :
C'est peut-être pour cette raison qu'il faut éviter le langage SMS ou les abbréviations sur ce forum. En plus, quand tu as dis que tu kiffais grave, je n'étais pas certain de la signification de "kiffer". Ne me provoquez pas ou sinon je vais sortir un joli sacre Québécois.
À cause de ca, j'ai perdu mon temps grave. Je vous déteste...
Désolé pour ce langage texto, il est maintenant transformé en langage HTML
a écrit :
Zut moi j'avais compris qu'ils allaient être mis Hors Service. C'était pour ça que j'étais content
C'est peut-être pour cette raison qu'il faut éviter le langage SMS ou les abbréviations. En plus, quand tu as dis que tu kiffais grave, je n'étais pas certain de la signification de "kiffer".
Je te donne un truc pour t'en souvenir plus tard...
... C'est un peu comme le feeling que tu as avec ta pelle...
Approbation, désir obscur et irrésistible envie...
... En fait...
Salut,
ca serait pas plus simple d'avoir un titre qui ne se veut pas "graphique" dans une zone ou il est censé être textuel ?
Bon j'ai fait l'effort de lire un peu de quoi il s'agissait, mais je t'avoue que ca donne pas trop envie de lire de prime abord. Des textes condensés, des couleurs 'basiques' issues de cette horrible palette EGA que j'éspère voir disparaître un jour, une mise en page un peu flottante... Bref y'a encore du boulot.
Déja pour commencer par les couleurs, quel que soit le thème choisi, les couleurs sont pauvres du fait de cette palette de couleur EGA. Celle qui est la plus lisible est finalement celle qui correspond aux styles de base des navigateurs (sans CSS).
>> Il faudrait que tu essaye de rechercher des couleurs qui vont mieux les unes avec les autres, et que tu tienne compte de leur contraste les unes avec les autres.
Je te donne un lien vers un outil super qui te permettra d'en apprendre plus sur les couleurs, et te permettra ainsi de mieux les choisir. Essaye autant que possible de trouver une gamme de 3-4 couleurs (pas plus) orginales pour créer un esprit particulier au site.
Concernant le texte. C'est dense. l'écart de ligne est mal maîtrisé (différent sur chaque pages). au point que sur la page actualités, il est quasiment inexistant. Dès qu'on augmente en résolution les lignes deviennent très longues, et ca rend la lecture difficile car à la fin d'une ligne on cherche la ligne suivante pour revenir au début pour la lire (En 1600x1200 ca de vient carrément insupportable à lire).
Il n'ya pas suffisamment de hiérarchie entre les titres et le texte, qui sont presque à la même taille.
>> Il faudrait déja que tu commence par uniformiser tes textes. Une taille de police pour les titres, 2-3 tailles en dessous pour le texte.
Il faudrait aussi ajuster ta CSS de manière à ce que la colonne de texte à droite ait une largeur maximale qui la réduise lorsque la résolution utilisée est trop grande. Et évidemment que tu applique un écart entre les lignes égal partout (le ratio minimum étant normalement de 1.5 : c'est à dire un texte en corps 10 doit avoir 5 pixels de marge entre chaque ligne).
Concernant la mise en page, on a de grands espaces partout. Une large bande horizontale entre la carte de france et le coté droit du navigateur, dans laquelle il n'y a qu'un petit titre flottant (pas centré et pas aligné à droite ou à gauche), titre parfois sur deux lignes...
Une petite bande verticale à gauche du menu.
Une large bande verticale entre le menu et le contenu, dans laquelle vient s'insérer le surlignage de la page active.
Le menu de bas de page flotte aussi un peu n'importe ou.
>> En résumé il faudrait contrôler l'espace et le structurer visuellement de manière plus claire. Réduire ou mieux organiser l'espace de titre de page en choisissant clairement de le centrer ou de l'aligner à gauche ou à droite. Réduire l'espace entre le menu et le contenu (en réduisant le surlignage du lien actif qui n'as pas besoin d'être aussi large).
Aligner le menu de bas de page par rapport à la droite du bloc de contenu.
Bon et sinon la carte de France... je pense que le côté nationaliste avec le drapeau français en fond tout le monde s'en fout, et qu'une carte de france (déja un peu plus grande, ou cliquable pour qu'on puisse l'aggrandir) tout simple : contour plus contenu, ca suffirait.
Voilà, c'est un peu long et pas forcément très positif comme critique, mais il n'empèche qu'avec encore de la volonté et un peu de temps passé, ca va s'améliorer je pense.
Modifié par Mikachu (07 Jun 2006 - 13:09)
a écrit :
...::||| Actualités - Grid-France|||::...
ca serait pas plus simple d'avoir un titre qui ne se veut pas "graphique" dans une zone ou il est censé être textuel ?
Bon j'ai fait l'effort de lire un peu de quoi il s'agissait, mais je t'avoue que ca donne pas trop envie de lire de prime abord. Des textes condensés, des couleurs 'basiques' issues de cette horrible palette EGA que j'éspère voir disparaître un jour, une mise en page un peu flottante... Bref y'a encore du boulot.
Déja pour commencer par les couleurs, quel que soit le thème choisi, les couleurs sont pauvres du fait de cette palette de couleur EGA. Celle qui est la plus lisible est finalement celle qui correspond aux styles de base des navigateurs (sans CSS).
>> Il faudrait que tu essaye de rechercher des couleurs qui vont mieux les unes avec les autres, et que tu tienne compte de leur contraste les unes avec les autres.
Je te donne un lien vers un outil super qui te permettra d'en apprendre plus sur les couleurs, et te permettra ainsi de mieux les choisir. Essaye autant que possible de trouver une gamme de 3-4 couleurs (pas plus) orginales pour créer un esprit particulier au site.
Concernant le texte. C'est dense. l'écart de ligne est mal maîtrisé (différent sur chaque pages). au point que sur la page actualités, il est quasiment inexistant. Dès qu'on augmente en résolution les lignes deviennent très longues, et ca rend la lecture difficile car à la fin d'une ligne on cherche la ligne suivante pour revenir au début pour la lire (En 1600x1200 ca de vient carrément insupportable à lire).
Il n'ya pas suffisamment de hiérarchie entre les titres et le texte, qui sont presque à la même taille.
>> Il faudrait déja que tu commence par uniformiser tes textes. Une taille de police pour les titres, 2-3 tailles en dessous pour le texte.
Il faudrait aussi ajuster ta CSS de manière à ce que la colonne de texte à droite ait une largeur maximale qui la réduise lorsque la résolution utilisée est trop grande. Et évidemment que tu applique un écart entre les lignes égal partout (le ratio minimum étant normalement de 1.5 : c'est à dire un texte en corps 10 doit avoir 5 pixels de marge entre chaque ligne).
Concernant la mise en page, on a de grands espaces partout. Une large bande horizontale entre la carte de france et le coté droit du navigateur, dans laquelle il n'y a qu'un petit titre flottant (pas centré et pas aligné à droite ou à gauche), titre parfois sur deux lignes...
Une petite bande verticale à gauche du menu.
Une large bande verticale entre le menu et le contenu, dans laquelle vient s'insérer le surlignage de la page active.
Le menu de bas de page flotte aussi un peu n'importe ou.
>> En résumé il faudrait contrôler l'espace et le structurer visuellement de manière plus claire. Réduire ou mieux organiser l'espace de titre de page en choisissant clairement de le centrer ou de l'aligner à gauche ou à droite. Réduire l'espace entre le menu et le contenu (en réduisant le surlignage du lien actif qui n'as pas besoin d'être aussi large).
Aligner le menu de bas de page par rapport à la droite du bloc de contenu.
Bon et sinon la carte de France... je pense que le côté nationaliste avec le drapeau français en fond tout le monde s'en fout, et qu'une carte de france (déja un peu plus grande, ou cliquable pour qu'on puisse l'aggrandir) tout simple : contour plus contenu, ca suffirait.
Voilà, c'est un peu long et pas forcément très positif comme critique, mais il n'empèche qu'avec encore de la volonté et un peu de temps passé, ca va s'améliorer je pense.
Modifié par Mikachu (07 Jun 2006 - 13:09)
Merci d'avoir pris soin de répondre à mes questions
Je suis en train de tout appliquer sur une page, j'essaye de bien adapter tout vos conseil.
Donc je suis reparti de zero ( http://grid-france.fr/test/test.html ).
J'essayes de tout restructurer, avec le menu access en premier dans le flux, le titre et contenu ensuiste puis viens le tour du logo et menu, puis le style et le bas de page.
Une fois que j'aurais bien reconditionner le tout, je m'occuperais des couleurs (merci pour le lien Mikachu, c'est génial )
Pour le footer qui se balade, je vais résoudre le problème en le collant en fond de page.
Si vous avez d'autres remarques je suis toujours preneur.
Cordialement
Modifié par Super_baloo8 (07 Jun 2006 - 20:37)
Je suis en train de tout appliquer sur une page, j'essaye de bien adapter tout vos conseil.
Donc je suis reparti de zero ( http://grid-france.fr/test/test.html ).
J'essayes de tout restructurer, avec le menu access en premier dans le flux, le titre et contenu ensuiste puis viens le tour du logo et menu, puis le style et le bas de page.
Une fois que j'aurais bien reconditionner le tout, je m'occuperais des couleurs (merci pour le lien Mikachu, c'est génial )
Pour le footer qui se balade, je vais résoudre le problème en le collant en fond de page.
Si vous avez d'autres remarques je suis toujours preneur.
Cordialement
Modifié par Super_baloo8 (07 Jun 2006 - 20:37)
Je n'ai pas pu tout faire ce soir, il faut bien qu'il m'en reste pour les autres jours
Par contre, je viens de m'apercevoir en recodant le site, que maintenant, sous IE, lorsque l'on viens sur un lien (effet hover) ca bouge tout le paragraphe entier, si vous avez des réponses svp, merci, mais je vais chercher quand meme avant
Par contre, je viens de m'apercevoir en recodant le site, que maintenant, sous IE, lorsque l'on viens sur un lien (effet hover) ca bouge tout le paragraphe entier, si vous avez des réponses svp, merci, mais je vais chercher quand meme avant
Etrange en effet, de plus la marge de gauche se trouve supprimée par ce déplacement intempestif dans la mise en page...
Je vois pas trop d'ou ca vient...
En regardant ton codage CSS, je vois une chose, c'est que tu peux condenser l'information...
tu peux le simplifier par
la commande concernera les quatres cotés en l'absence d'information spécifique pour chacun d'entre eux. Donc quand les quatres côtés possèdent le même padding, autant ne pas le répéter et gagner quelques précieux octets.
Dans ce cas par contre :
tu peux simplifier en :
Sachant que les 4 valeurs tournent dans le sens des aiguille en partant du haut (top, right, bottom, left)
De la même manière
peut être simplifiée en
Quand la couleur présentées sous une forme du genre #CC9933, #00FFAA, etc... tu peux condenser la référence de la couleur en ne citant qu'un des deux caractère hexadécimal de chaque base couleur (rouge vert bleu)
Par contre, ca ne marchera pour une couleur comme #88C4FF
car valeur hexadécimale de vert utilise deux caractères différents.
Je vois pas trop d'ou ca vient...
En regardant ton codage CSS, je vois une chose, c'est que tu peux condenser l'information...
padding: 1% 1% 1% 1%;
tu peux le simplifier par
padding: 1%;
la commande concernera les quatres cotés en l'absence d'information spécifique pour chacun d'entre eux. Donc quand les quatres côtés possèdent le même padding, autant ne pas le répéter et gagner quelques précieux octets.
Dans ce cas par contre :
padding-top: 2%;
padding-bottom: 2%;
padding-left: 2%;
tu peux simplifier en :
padding: 2% 0% 2% 2%;
Sachant que les 4 valeurs tournent dans le sens des aiguille en partant du haut (top, right, bottom, left)
De la même manière
background-color: #FFFFFF;
peut être simplifiée en
background-color: #FFF;
Quand la couleur présentées sous une forme du genre #CC9933, #00FFAA, etc... tu peux condenser la référence de la couleur en ne citant qu'un des deux caractère hexadécimal de chaque base couleur (rouge vert bleu)
Par contre, ca ne marchera pour une couleur comme #88C4FF
car valeur hexadécimale de vert utilise deux caractères différents.