Cascading Style Summer Refresh 2010
Nicolas Torres par Noix de Coco
Voir en ligne http://nicolastorres.com
Après refresh
Note obtenue : 6.971/10
Voir en ligne http://nicolastorres.com
Note obtenue : 6.971/10
Les commentaires sont clos.
J'ai réservé mon nom de dolmen !
(Asterix)
Commentaires
Superbe design !
Des mini erreurs HTLM à corriger par contre (quasiment rien, fais vite !! :) )
Css Valide
Du très bon !
Seul bémol : affichage sous IE6 décevant...
Fais une CSS dégradée pour ce navigateur à la limite, ça passera mieux ! Et puis il est tellement bien qu'il vaut le coup de s'y attarder pour arranger ça ;p
Petite sanction pour IE6, mais grosse note tout de même pour l'excellent travail :)
J'ai volontairement abandonné IE6. Je n'avais pas le temps de m'y consacrer, et c'est trop de contraintes. Effectivement un mini-correctif au moins pour la disposition n'aurait pas été de trop, mais j'ai fait un choix =) .
Merci énormément pour ton commentaire !
Graphiquement, c'est pas mal, même plutôt bien!
J'apprécie l'utilisation du html5, mais du coup type="text/javascript" n'est plus indispensable ;-)
Tu auras pu utiliser un hgroup autour de ton h1 et h2 dans le header!
Niveau accessibilité :
- penser à la navigation au clavier (avec notamment le :focus)
- mettre les width/height des images
- pour les target="_blank" averti au moins le visiteur qu'un nouvel onglet va s'ouvrir
- Pour les liens "réseaux socials" met le title sur les liens et non sur la balise image!
- certains liens mériteraient un title car non explicite
Et ça : style="width: 200px;"
C'est quoi? :p
Et ça aussi :
<div style="clear: both;"></div>
C'est grandement évitable! (De même qu'un <div class="clear"></div> tout court d'ailleurs, via l'utilisation d'un overflow:hidden sur le conteneur).
Bon j'ai repéré 3, 4 autres trucs aussi mais rien de bien méchant, sinon c'est propre, bon travail!
@ClementRoy : Constructif ! Je prends note, dès que j'ai le temps je rejette un oeil à ton commentaire pour corriger tout ça ! Merci
Le footer est esthétiquement très sympa, au détriment du header?
Site très intéressant ! L'un des meilleurs que j'ai vu jusqu'à présent ! :)
J'aime beaucoup ta manière de rédiger tes textes. ;)
Même si cela manque un peu de référence pour un portfolio.
La mise en page est propre, claire, sobre et épurée. Ton site respire le professionnalisme.
Bravo et bonne continuation,
Pierre
Pareil, un des plus léchés que j'ai pu noter. Bravo Noix de coco, as always :)
+1 pour les remarques de ClémentRoy, mais à ce compte là, que dire des autres sites (dont le mien) ;)
Cool, ton "labo" à toi, je te mettrais le mien en lien, quand je l'aurais refait :)
@FranZz : J'y ai pas mal réfléchi, et je travaille beaucoup (malheureusement) sur l'inspiration. J'ai donc essayé de faire le mieux possible avec le peu que j'avais en tête. Dommage que ça ne te plaise pas, mais bon, ça ne peut pas plaire à tous ^^ . Je prends ta remarque en compte pour une future refonte graphique.
@PierreA : Effectivement les références manquent, mais les designs étant peu attrayants, j'ai préféré juste noter dans "Qui ?" que j'ai bossé pour une assos, une boîte, un saxo pro etc. Tu as pleinement raison. Dès que j'ai du temps je pars à la chasse aux réfs et à la mise à niveau accessibilité ^^. Ton commentaire m'a fait très plaisir. Merci !
@audrasjb : J'étais content quand j'ai eu l'idée du labo ; je t'avoue que je le trouve super mignon >.< ... bref, 'manque plus qu'à le lier à Twitter pour qu'il soit pertinent. Ca viendra =) . Merci beaucoup, encore un commentaire qui fait chaud au coeur !
@Tous : internet est super saccadé sur le campus de l'INSA Lyon, je prendrai le temps de commenter/noter et regarder en profondeur les sites des participants ce week-end sans doute.
@Noix de Coco : Si si, ça plaît, bien sur! Ce n'est pas parce que je critique que je n'aime pas. ;)
Joli travail sur les textures/matières et belle palette de couleurs. bravo !
J'aime les textures et les couleurs utilisée et les effets sobres mais efficace. Cependant concernant le contenu pour la partie "Quoi" selon moi il n'est pas possible de présenter un projet en 3/4 lignes, je pense que plus d'informations et des captures d'écran à la place des liens externes serait peut-être mieux. Petit point noir c'est le formulaire de contact, il est très simpliste étant donné la qualité générale du site je m'attendais à mieux. A part ces petits détails tout est bien.
@FranZz : ah ! Encore mieux, j'apprécie =) !
@iManu : Merci beaucoup ! Et merci à Kuler pour les nuances de couleurs ;) !
@A3TA : J'ai en effet eu beaucoup de mal à trouver un agencement correct pour les créations (qui sont peu nombreuses, disons-le). J'ai un peu séché et j'ai comblé l'espace le plus designement possible avec mes compétences. Disons que oui, je l'ai en tête, et que dans une future version ça sera complètement revu (à savoir que je refais mon site plusieurs fois par an, pour appliquer de nouveaux acquis et expérimenter, et parce que je ne suis jamais pleinement satisfait =3). Pour ce qui est du formulaire, il est venu après, une fois le site terminé, et j'ai repris la mise en forme de base attribuée aux formulaires de mon framework, faite à la va-vite. Il est vrai que j'ai eu un peu (beaucoup) la flemme, mais c'est aussi dû au fait que j'avais déjà en tête de préparer une nouvelle version (et oui, déjà, mais c'est pas pour tout de suite, études oblige =|). Merci pour ton commentaire !
Un très bon site dans l'ensemble et dans les détails d'un classicisme abouti. C'est parfois amusant de lire les commentaires, tel celui de l'auteur qui parlant du HEADER répond : « J'ai donc essayé de faire le mieux possible avec le peu que j'avais en TÊTE. » Façon d'introduire mes remarques sur l'aspect graphique de ce site. Ce travail est si soigné que pour apporter une réflexion pertinente, mieux vaut réfléchir pas mal… Soigner le bas de la page et laisser le haut dans une telle sobriété est-il gênant, déséquilibré ? Après tout, la lecture s'effectue de façon satisfaisante, au fil des paragraphes, et sans doute faut-il voir dans la discrétion graphique sur le nom du site, la modestie de son auteur. Mes remarques à suivre vont donc tenter d'apporter un plus, tout en respectant l'esprit de ce travail. Je n'ai nulle envie de retrouver en haut la force du bas, sinon, cette symétrie alourdirait immanquablement la page. La petite insatisfaction que produit cette mise en page peut découler du point suivant : la trop grande symétrie (latérale) des bandeaux ' Quoi, qui, comment " et de celui du bas. Par ailleurs, pensons que les écrans tendent à grandir sans cesse, et que les prolongements latéraux indéfinis ( du brun en bas par exemple ) alourdissent la vision. Autre conséquence du même problème : lorsque la couleur de fond de la colonne centrale est identique au fond de la page, ça peut parfois flotter un peu. Dernière remarque sur la typo qui dans l'ensemble est soignée, lisible et aérée : les mentions de date sont peut-être un peu grandes. Pour revenir à la partie supérieure de la page, un petit détail pourrait suffire à l'améliorer.
Redisons en conclusion qu'il s'agit d'un excellent travail sur lequel on revient avec plaisir, car sa sobriété même n'est pas fatigante comme c'est le cas des effets visuels trop clinquants à la séduction éphémère qu'on trouve si fréquemment. Il pourra traverser le temps sans complexe avant une prochaine refonte…
@designer1959 : j'ai relu plusieurs fois ton commentaire car je l'ai trouvé particulièrement intéressant (dans son entité même).
Maintenant pour te répondre, je commence par le header : derrière ma réponse citée, il y a que j'ai volontairement fait le leader plus légé que le footer, pour les raisons que tu as dites. J'ai donc plutot répondu à "pourquoi parait-il moins esthétique, travaillé que le footer ?".
La typo des dates, la réponse que je pourrais te donner rejoint directement ma réponse à A3TA. Quand au bandeau latteral indéfini et le fond unique pour la page sont le résultat de mes réflexions sur la consideration de l'approche visuelle des visiteurs, tout en gardant la dispositon voulue. Disons que ça a été pleinement pensé. De même que la symétrie header/footer.
Merci beaucoup pour ton commentaire qui m'a été très agréable.
Une précision sur la mesure des choses. Lors que je parle d'un bandeau qui s'étend indéfiniment, je vois ceci à l'écran : chaque marge ( de gauche et de droite ) occupe un espace légèrement supérieur à la colonne centrale, pourtant assez large. Sur le site Alsa, par exemple, la colonne centrale est plus étroite, elle est cernée par un gris à peine plus fort que celui de la page qui suffit à éviter cette impression de flottement que j'ai trouvé sur de nombreux sites, mais il n'ont pas tous cette précision mûrement pensée qu'on apprécie ici. L'auteur parle de son site comme d'une création continue, à reprendre toujours. Cela se sent dans la perception qu'on en a. C'est un cliché de considérer que le graphisme, l'art sont seulement d'un ordre subjectif, je crois l'inverse. Les qualités intrinsèques sont incontestables, quand bien même, un univers créatif ne nous ressemble pas, voire ne nous plaît pas, il manifeste des qualités universelles. On sent ici, une recherche de cet ordre-là. Évidemment, une telle quête dure… toujours.
Vraiment sympa cette refresh ! Sobre, classe, j'aime beaucoup le footer.
Eh ben ! Je rajouterai juste que j'aime beaucoup, et que le tout est cohérent par rapport aux idées que tu m'avais énoncées :) Magnifique
@p0ulpe & @Kuraido : merci à vous deux !
Un refresh réussi sans aucun doute. :)
Le seul gros reproche que je lui ferais, c'est que le haut du site manque légèrement de contraste à mon goût (la partie quoi, qui, comment).
Quelques optimisations à ajouter (mise en cache de certains contenus), qq erreurs de validation aisément évitables.
Sinon c'est pas mal ! Continue ! ;)
Joli et lisible. Pour moi, il manque un petit grain de folie ou la petite touche pour que ce soit vraiment ton site à toi. Mais ça viendra. :)
@Nico3333fr : La mise en cache a été pensée et installée, mais petit bug du côté de mon moteur de template, que j'ai corrigé sur une nouvelle version, mais pas instaurée sur mon site actuel (car je travaille sur une nouvelle version, comme dit plus haut). Merci pour ces remarques, qui comme toutes les précédentes, seront attentivement relues et prises en compte pour la prochaine refonte =) .
@Mikachu : Effectivement, il manque un truc, d'où ma non pleine satisfaction ^^ . J'ai été agréablement surpris par ta remarque. Merci pour le commentaire !