Cascading Style Summer Refresh 2010
Gastero Prod par nhoizey
Voir en ligne http://gasteroprod.com/
Après refresh
Note obtenue : 4.970/10
Voir en ligne http://gasteroprod.com/
Note obtenue : 4.970/10
Les commentaires sont clos.
Alsacréations, un site dédié au <body> building
(Jean-Claude Vandamme)
Commentaires
Ah bin zut, le screenshot après refresh ne fait pas du tout honneur au travail réalisé... :-(
Pourriez décliner les screenshots en plusieurs résolutions, de 320 à 1280 pixels de large ?
Le screenshot est présent pour pouvoir comparer avec la version en ligne (et repérer les éventuels modifications après le début des votes).
Les screenshot ont tous été pris dans les mêmes conditions pour que tout le monde parte sur le même pied d'égalité.
Les votants sont, de plus, invité à visiter le site avant de voter.
C'est parfait alors... ;-)
Hello,
J'aime bien :) C'est propre et lisible :)
Juste un truc, la bordure inférieure de tes liens dans le contenu ont un petit décalage pas très heureux sur la droite et il manque un petit effet au survol (et au :active)..
J'aime beaucoup dans sa globalité. Quelques petites touches perfectibles, comme certaines style inline qui persistent. Sinon c'est du tout bon.
Première ligne des modalités du concours : L'idée du CSSR2010 est de remettre au goût du jour votre site internet en terme de design.
A part une réorganisation fonctionnelle des parties, la suppresion des calendriers sur les publications, et le bouton "Trouver", le design est inchangé.
Dans ce contexte, la participation aurait elle dû être validée?
Bonjour nhoizey,
Le contraste de la police sur le fond bleu est un peu trop important à mon goût, j'avoue préférer les textes sur couleurs unies.
Une chose que j'apprécie est la présence du menu lorsque je scroll verticalement. Le travail sur le logo est également appréciable !
Quelques efforts sur la validation W3C serait un plus !
Peut-être qu'en baissant la taille de la font et l'interligne, l'effet de contraste qui me dérange un peu s'atténuerait ? Mais bon, c'est histoire de gout personnel...
Bonne chance pour le concours et bonne continuation !
Côté lecture je suis très gêné par cette image de fond présent sur toute la hauteur du site (ou presque).
J'ai toujours eu un peu de mal avec les textes clairs sur fond foncé, mais c'est personnel je pense.
Le code source me semble très désorganisé et pas très propre.
Je ne connais pas SPIP, je ne sais donc pas s'il en est la cause.
Bonne continuation en tout cas.
coucou nhoizey,
Un peu du même avis que les autres, il y a un problème de lecture et d'appréciation du site dû à l'image de fond prédominante, cependant beau travail sur le logo.
J'ajoute mon commentaire aux précédents : le contraste est un peu violent et l'image de fond trop présente. Sinon, je trouve que l'affichage des pages est extrêmement rapide et ça c'est vraiment bien ;)
J'hésite à préférer la nouvelle mouture. Le travail est bon, mais on pressent que peu de choses pourraient le rendre meilleur, voir excellent. Taille des typos, quelques espacements entre les colonnes ou un système pour les différencier un petit peu plus du reste de la page ? Le haut, avec logo, me paraît un peu coincé. Le visuel de l'escargot me paraît un peu en retrait avec l'élégance du reste.
@mat_dev je te rassure, le design a bel et bien changé, puisqu'il était très rigide avant, et est maintenant complètement dynamique à base de media queries pour s'adapter à différentes résolutions, dont les smartphones. Visuellement, c'est aussi plus sobre, j'ai viré les mini calendriers qui étaient un peu trop présents, changé de typo pour améliorer la lisibilité, etc. Je me suis inspiré du maintenant célèbre « Good Designers Redesign, Great Designers Realign ».
@Colibr-e Le contraste a été ajusté au minimum nécessaire pour satisfaire aux contrôles d'accessibilité de Contrast Analyser ( http://www.paciellogroup.com/resources/contra... ). Pour ce qui est de la validation, j'ai des soucis avec SPIP d'une part, et RDFa d'autre part, il faut que je travaille dessus. Merci pour les encouragements !
@Riku Asakura Qu'entends-tu par « code très désorganisé et pas très propre » ? La structure hiérarchique est à priori bien respectée. Depuis quand le code source doit-il être bien indenté à la source ? Cela obligerait à passer un tidy avant d'envoyer la page, hors de question pour les perfs.
@anais-id @br1o J'aime les sites en typo claire sur fond foncé, je trouve ça plus reposant... ;-)
@br1o J'ai particulièrement travaillé l'aspect performance, tu me fais plaisir ! Par contre, faut que je trouve le moyen de flusher la page au fur et à mesure avec SPIP...
@designer1959 qu'entends-tu par « taille des typos » ? Tu la verrais plus grande, plus petite ? Pour ce qui est de la différenciation plus nette des colonnes, tu as raison, mais je ne suis pas du tout doué en design, je n'ai pas encore trouvé d'idée simple... ;-)
Je n'ai pas précisé, pour la typo, elle me paraît un peu grosse. J'ai pourtant un écran à petite résolution et souvent, je zoome avant pour plus de confort, sur ce site, au contraire, un zoom arrière apporte plus d'agrément tout en restant bien lisible.
Pour ce qui est de mieux distinguer les zones du site, les solutions à trouver pour ne pas perturber une harmonie assez réussie, sont à étudier avec soin. Un background avec transparence pour la colonne du milieu ? Des essais s'imposent… Le font noir du header pourrait aussi être amélioré un peu, sa couleur se confondant avec le fond sombre également, et lui donner un petit peu d'espace pour le logo. Le ration des contrastes, par contre, est bien géré, et ce malgré le dégradé, sauf le gris clair à la rigueur.
J'avais oublié de mentionner que les portraits du site sont beaux, et surtout celui de la belle bien entendu !
Errata / il fallait écrire " le ratio des contrastes ".
@designer1959 j'ai renforcé un peu la distinction entre contenu principal et contenus annexes en mettant différentes couleurs de typo, je trouve que ça rend pas mal, ton avis m'intéresse !
Pour ce qui est de la taille de typo, elle était plus petite dans le passé, mais je préfère celle-ci, qui me paraît plus respectueuse de l'utilisateur, mais que je modifie quand même légèrement selon la résolution du terminal utilisé.
Première impression... plutôt très bonne !
Quelques remarques histoire de râler : :)
- quelques curiosités dans le code comme class=\'spip_out\', dommage !
- j'apprécierai un lien de retour en haut de page pour les pages plus longues.
Et sinon... bin, y a pas tant à râler que ça (et je peux être un vrai chieur).
J'aime bien le graphisme, la mediaquery est très bien utilisée (très appréciable), le texte est lisible, les perfs sont travaillées, le coup du menu qui suit quand on scrolle est très bien vu, y a beaucoup de bonnes idées et très honnêtement peu de points faibles.
Sans aucun doute, c'est de l'excellent boulot, je te tire mon chapeau, et je n'hésite pas à dire que c'est une des meilleures réalisations du concours àmha. Bravo !
@Nico3333fr : Oui, j'ai bien les problèmes d'échapement de certains attributs des liens, c'est un bug de SPIP que j'ai signalé. Pour ce qui est du lien de retour en haut de page, j'avoue ne jamais m'en servir quand il y en a un, donc je n'y ai pas pensé, je vais peut-être l'ajouter.
Merci beaucoup pour tes félicitations !!! ;-)