Cascading Style Summer Refresh 2010
Lightcode par lightcode
Voir en ligne http://lightcode.fr/
Après refresh
Note obtenue : 5.280/10
Voir en ligne http://lightcode.fr/
Note obtenue : 5.280/10
Les commentaires sont clos.
<head> toi, le ciel <td>'ra
(Benoit 16.0)
Commentaires
Hello,
Dans l'ensemble c'est plutôt réussit, même si je trouve que le bleu de fond fait très "vieux message d'erreur windows" si tu me permets l'expression.
Dans l'ensemble le refresh s'en sort plutôt bien. Le fait de rajouter une troisième couleur (le rouge) est une bonne chose car le site semble plus vivant. Bravo!
Tom
Très simple, mais j'aime beaucoup. C'est clean et lisible ! Le fait que la couleur change ne perturbe pas la lecture du site, mais donne un peu de vie.
Bref, j'aime :)
Hello,
Super ! Ton code est vraiment propre (peut-être le code le plus propre que j'ai vu pour l'instant).
Le design est minimaliste et même si j'aime pas trop le bleu utilisé, ça fonctionne parfaitement :)
Bravo :)
Merci à tous pour vos commentaires ! Je prends en compte les conseils, niveau design par exemple car ce n'est pas mon point fort.
- Je vois que le bleu perturbe, je pense que je vais revoir ça alors.
- Je suis content de voir que mon code est apprécié, parce que j'ai (presque) tous misé là dessus.
Je vais aussi rajouter que le code serveur (PHP) a aussi était refait entièrement, il est lui aussi assez propre même si je suis le seul à pouvoir le constater. Pour ceux qui aiment les performances, j'ai aussi travaillé sur ce point (gtmetrix.com).
Bravo!
Code vraiment propre, et j'aime beaucoup la possibilité de passer en mode dégradé pour les navigateurs non compatibles HTML5.
Concernant le design, il est un peu light. Le nom du site? LightCode! Et bien c'est parfait, c'est cohérent!
Félicitations!
@mat_dev : Merci ! pour information, je mode "Sans HTML5" transforme automatiquement les balises HTML5 en <div> et transforme aussi la CSS. Ce n'est donc pas "dégradé".
Si le design est light, c'est juste parce que je ne suis pas un designer, après, c'est peut-être osé pour moi de participer à ce genre de concours... je ne sais pas. Mais je suis conscient du problème.
@lightcode : Autant pour moi pour le terme utilisé. Veuillez m'excuser. Toujours est-il que peu se sont souciés des "anciens" navigateurs.
Concernant le design, cela ne me pose aucun problème, bien au contraire. C'est cohérent avec son nom. Et je pense que vous avez tout à fait votre place dans ce genre de concours. Chacun juge selon ses critères. Personnellement, mon premier réflexe et de chercher l'information sur le site (le contenu, la manière d'y arriver, le design aussi, mais je demande simplement qu'il ne soit pas agressif, brouillon, ou "old school" etc...), puis le code (en détail, les balises, les commentaires oubliés, etc... mais aussi, c'est peut être bête, l'indentation), etc... Pour un moi, un bon site a une source propre. Il doit être facile de venir le lire et le modifier. Ainsi, j'aurais tendance à vous donner une note supérieure à d'autres sites très beaux en termes de design, mais dont le code est vraiment illisible. D'autres jugeront totalement à l'inverse. Les comptes seront faits à la fin ;-) L'avantage de participer à ce genre de concours est aussi d'apprendre de par les commentaires laissés.
Ps : avis subjectif : je préfère quand un site est sobre. Surtout lorsque la force du site est son contenu, et c'est votre cas.
Bonjour
Je trouve aussi que le design est bien en adéquation avec le nom et le sujet du site :)
Le code est... parfait, pas une div en trop, vraiment du beau travail (c'est vrai que le coté minimaliste joue quand même en cette faveur, avec un site plus désigné, difficile de n'avoir aucun div... mais c'est pas une critique, juste une constatation).
J'aurai gardé le rouge pour toutes les pages, indiqué les champs obligatoires du formulaire de contact et crée une page mentions légales.
Sinon, "LightCode" est rogné sur la droite à l'agrandissement des polices, c'est dommage.
Merci à vous !
@mat_dev : ce n'est pas grave pour l'erreur, c'était juste pour expliquer l'intéret de ce système, et le fait qu'il n'y ait pas de dégradation. Pour le reste, je suis tout à fait d'accord avec vous : c'est justement ce que je voulais faire passer en créant ce site. Je trouve ça assez incroyable de faire passer une pensée, à travers un site et son code source.
@cilou : merci, ça me fait vraiment plaisir. Le code n'est surement pas parfait partout, ni même pour la structure de base : je me trompe peut être sur l'utilisation de certaines balises HTML5, j'ai regardé beaucoup de code, la documentation du W3C pour en arriver là : c'est pas un exercice toujours facile.
Pour les <div>, j'en ai mise une dans le template principale (celui qui contient la page). Pour moi, les div ne servent qu'à faire du design, donc c'est normal si je n'en ai pas beaucoup. Pour les champs obligatoire, je cherchais à le faire avec CakePHP, j'ai pas encore trouvé, le seul moyen de le faire était en CSS, merci de m'y faire penser. Pour "LightCode" je vais y regarder.
Encore merci pour vos commentaires !
Étant graphiste, je parlerai principalement de cet aspect, par contre, le vote que je vais effectuer tiendra compte les autres facteurs, et si la note ne sera sans doute pas la plus haute, elle sera très bonne, parce que ce travail le mérite et sans être parfait, présente très peu de failles, et rien de grave assurément.
J'ai hésité à trouver le site trop aride, et puis non. On distingue peut-être trop excessivement le graphisme de la sémantique, or la mise en page appartient au deux domaines, et elle est ici réussie. Ainsi, la répartition des contenus et les tailles de typographie sont particulièrement soignés et cela appartient au domaine du graphisme autant qu'à l'architecture du site. Le regard est bien conduit pour accéder aux contenus, aux menus, etc. L'index des couleurs est particulièrement bienvenu, seule la couleur violet de la rubrique " à propos " se distingue moins bien du fond bleu. Je ne partage pas les réserves sur la couleur du fond, prenez soin, si vous la changez, de ne pas faire un choix moins bon. L'ombre portée noire du cadre ressort assez mal sur ce fond. Je conviens que la primauté est donnée aux contenus, de plus ils sont intéressants et bien écrits, et l'autodidactie attire ma sympathie, mais cela n'empêche pas de penser à les mettre en valeur par quelques détails, sans alourdir le code ni le téléchargement par des visuels ou autre. Le site n'est pas seulement " light " il est aussi très compact, dense, et mieux laisser respirer les contenus ne pourrait que les servir, et rendre la lecture un peu plus confortable encore. Sur ce point, j'attire donc votre attention sur la partie haute, un peu " collée " ainsi que les marges du texte qui pourraient être légèrement plus grandes à l'intérieur du bloc, surtout lorsque les textes sont justifiés, il manque juste un peu. Dès la page d'accueil, on est de plein pied dans le sujet, est-ce un avantage ou un défaut ? Je suis partagé, on pourrait imaginer une sélection de plus nombreux extraits, mais le parti est défendable. Plutôt que de changer la couleur de fond, quelques détails à peaufiner sur le plan graphique, voire une recherche de logo pour " light code " pourraient faire la différence. Mais toutefois, mieux vaut une typo simple comme vous avez fait qu'un mauvais logo !
@designer1959 : merci pour votre commentaire détaillé, qui va m'aider pour revoir le design.
"mais cela n'empêche pas de penser à les mettre en valeur par quelques détails" : j'y pense, d'ailleurs, je ne me voyais plus écrire de nouveaux articles avec l'ancien design (qui, avec un peu de recule, était horrible). J'avais pensé au refresh avant le concours, j'avais aussi commencé le nouveau code serveur après avoir découvert CakePHP. C'est seulement après que je me suis inscrit au concours. J'avoue avoir eu beaucoup plus de mal à chercher ces "détails", ce style plutôt que d'écrire le code PHP, par exemple. Il y a beaucoup de choses que je ne connais pas encore en design, donc, je cherche encore à m'améliorer.
"rendre la lecture un peu plus confortable encore" : mon but premier était de faire un site dédié justement à la lecture des articles. Je ferai donc une version avec une meilleure gestion des margins/padding.
"Dès la page d'accueil, on est de plein pied dans le sujet, est-ce un avantage ou un défaut ?" -> la page d'accueil a deux rôles pour le moment : syndiquer les mises à jour des "articles" et "projets" mais aussi de mettre des "articles courts" car je ne les jugent pas assez long pour être mis dans "articles". Après, je ne sais pas si c'est le meilleurs choix. On pourrait dire que la page d'accueil serait plutôt une partie "blog". La question de savoir comment qualifié le site a déjà été posée dans le forum, après le concours je saurais donc quoi faire.
"Mais toutefois, mieux vaut une typo simple comme vous avez fait qu'un mauvais logo !" -> vu que je n'arrive pas à faire de logo, j'ai déjà choisi mon camps.
Je réfléchirai donc vers quoi je vais aller pour l'après concours. Il m'aura au moins apporté de bons commentaires. Merci à tous !
PS : je passerai sur les sites des membres ayant posté un commentaire car je ne pense pas pouvoir passer voir tous le monde, 90 sites en 9 jours, ça fait beaucoup. Vu que je ne peux pas voter, cela perd de son intérêt.
Comme votre site ne sera jamais encombré de gadgets visuels, de choses fatigantes à regarder, de trucs aussi époustouflants au début qu'ennuyeux à la longue, je vous invite à visiter le site d'un participant à ce concours, qui n'est pas si éloigné de la sobriété de votre approche, et qui en peu de choses, légères pour le code, etc. a réussi à rendre son site attrayant et raffiné http://www.alsacreations.com/concours/crea/27...
Quitte à me répéter, le soin que vous avez apporté à votre travail de mise en page, est déjà une des composantes du graphisme, le squelette, il reste ensuite à aérer quelque peu, et apporter un peu de souffle de vie.
J'ai effectivement pensé à l'esprit " blog " dès la page d'accueil, et justement, les blogs ont parfois, de très beaux headers.
Encore merci pour votre commentaire, il sera bien sûr pris en compte lors de l'après concours. Je vais surement trouver une nouvelle ligne directrice pour le site : fixer un thème, améliorer quelques points niveau du code HTML5, le CSS (padding/margin), et surement quelques retouches.
J'attends les derniers commentaires, je ferais un bilan quand le concours sera finit.
Oui, pour beaucoup, le concours sert à cela : se remettre en cause… puis se remettre au travail !
C'est clair, très rapide (beau boulot sur les perfs), bien foutu. J'aime bien !
Peut-être faut-il l'embellir avec qq tous petits ajouts (qq images par ci par là), et ça sera encore meilleur ?
Merci beaucoup. Je suis tout à fait d'accord pour les images, je vais m'y mettre.
Sinon, j'ai déjà commencé à l'améliorer, je fais aussi quelques tests sur ma version bêta "privée".