Cascading Style Summer Refresh 2010
yenah - tirnamael par Gwym
Voir en ligne http://www.yenah.fr
Après refresh
Note obtenue : 4.030/10
Voir en ligne http://www.yenah.fr
Note obtenue : 4.030/10
Les commentaires sont clos.
<br><br> Vivement la <font> des neiges !
(Captain Igloo)
Commentaires
[Note] Le work-in-progress du refresh en cours : http://tirnamael.online.fr/viewtopic.php?f=9&...
J'aime énormément le ruban de Möbius en entête :)
Par contre, il est dommage que l'on perde le menu lorsqu'on va sur les pages du site...
Côté code, par contre, le tout n'est pas de passer au html5, encore faut-il faire un effort au niveau de la sémantique :
- niveaux de titres pas appropriés (que des h1) ;
- des <br /> au lieux de marges en css ;
- les liens du footer devraient être dans une liste non-ordonnée ;
- des métas inutiles ;
- un encodage déclaré deux fois ;
- les liens du li.miniblog sont une liste à part entière.
Cette version est beaucoup mieux qu'avant félicitation!
Bonne continuation
Tom
Bonjour et merci beaucoup de vos commentaires et conseils !
Pour le menu je ne l'ai pas vraiment trouvé utile de le mettre sur les autres pages, puisque c'est la "table des matières" du site, j'ai juste mis le retour vers l'origine.
(Quoique, étant un peu juste en temps, je me suis focalisé sur la page d'accueil, le règlement du concours indiquant qu'il ne porte que sur une page. Je verrais pour un
éventuel menu sur les autres pages plus tard...)
Pour les points techniques :
- titres : s'il n'y a (par section) que des titres de niveau 1 il ne faudrait pas mettre de balise h* du tout ? par quoi remplacer le h1 alors ?
Cela me parait étrange car il y aurait une différence avec le reste du site (par exemple la page science, où j'ai plusieurs niveaux de titres, h1, h2 et prochainement h3 voire plus) !
En tout cas j'ai préféré garder des balises titres homogènes sur le site entier, même s'il n'y a qu'un niveau dans la page d'accueil...
- "des br au lieux de marges en css" : idem que pour les titres, c'était pour garder la cohérence avec le site en entier (et donc éviter des styles différents pour l'accueil et les autres pages), le br signifie bien qu'ici je veux une ligne vide de séparation, mais pas sous *tous* les blocs p ailleurs dans la page ou a fortiori dans le site... de mon point de vue le br ça fait partie du contenu textuel, c'est un raisonnement faux ? Il est vrai que j'aurais aussi pu créer une classe css spéciale pour les p où je veux un espacement ad hoc.
- "des metas inutiles" : lesquelles ? J'avoue que n'étant pas spécialiste j'ai repris grosso-modo ceux du site de Raphaël Goetter (hors localisation, qui me paraissait effectivement pas vital)
- "un encodage déclaré deux fois" idem que ci-dessus, j'ai pris exemple sur son site, pensant qu'il y avait une raison valable pour cette double déclaration. Je poserai la question après le concours, si je n'ai pas trouvé le pourquoi d'ici là.
Pour les listes je corrigerai après le concours, merci...
À première vue, le ruban du haut de la page attire l'œil agréablement. Ensuite… les motifs de fond diminuent un peu la force de cet impact visuel, et surtout la barre horizontale des menus du bas casse la page. Concernant la lisibilité, j'aurais préféré une colonne centrale moins large, et aurais descendu le menu de droite en dessous du ruban, pour le laisser s'épanouir pleinement. La qualité de l'illustration demanderait plus de soin sur la mise en page des textes.
Je n'adhère pas vraiment à ce genre du design, je trouve cela assez particulier... La typo n'est pas très lisible =/ et niveau ergonomie le menu s'en va quand on change de page, pas super pratique !
Bon sinon ton code m'a l'air plutôt bien construit, même s'il est très simple =)
Hello,
Je n'ai pas tout compris, le doctype déclare du HTML5, mais utilise du code XHTML. La navigation est absente sur certaines pages et d'une manière générale l'ensemble est instable. L'utilisation d'une font fantaisiste rend la lecture difficile. hmmm...
@vectorskin : la typographie n'est pas censée être "fantaisiste" mais "fantasy", en rapport avec le thème du jeu ;)
Cela dit si vraiment elle pose problème je vais encore la "standardiser" un peu, ou mettre un style alternatif plus lisible pour ceux qui souhaitent.
"l'ensemble est instable" ?? ôO
Vous pourriez préciser ? Merci.
L'internaute est de nature pressé, et il n'aime ni réfléchir ni chercher les rubriques, tout doit être facile et évident.. (a lire : "Don't Make me Think" de Steve Krug). Donc, les menus doivent toujours être visibles et positionnés en haut ou a droite (si tout le monde fait ça, c'est qu'il y a une raison ergonomique), la lecture doit être facile avec une typo simple, les pictos en bas de page commentés, on doit savoir où l'on se trouve dans le site par rapport au menu etc... quand je suis sur ton site, je me sens déstabilisé par rapport à mes habitudes d'internaute (cf utilisabilité ou usabilité et ergonomie.)
...petit oublie : On ne sait pas quel langage HTML tu utilises dans ton site, donc, oui, je trouve cela instable :-)
Le validateur http://validator.w3.org ne semble pas s'en fo... outre mesure... :/
J'étais déjà bien content d'être arrivé au stade "successfully checked, no errors" ;)