Http://uzability.free.fr/AngelineCMS-lite/ : Template

Salut,

J'aimerai votre avis sur ce blog
Notez que la validation ne passe pas niveau xhtml mais si on fait la validation via "validate locale html" de webdevelopper ça passe quand on a plus de ?&PHPSESSION dans l'url.



Edit : j'ai modifier l'addresse du blog a critiquer, fondamentalement, ça ne change rien, c'est le même template et le même moteur.
Modifié par ___seb (07 Jul 2006 - 14:32)

Salut,

Pour pouvoir lire le contenu de ta page, j'ai été obligé de faire CTRL + A (sélection globale) ce qui permet d'inverser les couleurs du texte. J'arrête de charrier, il manque très cruellement de contraste et est très pénible à lire pour moi.
Sinon que te dire de plus, que ça manque de couleurs, qu'une image ou deux m'aurait tiré un sourire peut être, tous ça quoi, des banalités.

En effet je pense aussi que les contrastes sont un peu legers mais je n'étais pas tout a fait sur.
quand aux images, il y en a une mais elle ne devrait même pas y être car être le plus leger possible est une des contraintes? Je profite donc de ta remarque pour ajouter cette note : le template doit être leger.

Les contrastes sont effectivement à réhausser. Déjà que là j'ai du mal, j'ose même pas imaginer ce que ça doit donner sur Mac où les couleurs pastels sont souvent surexposées (ou bien elles sont sous-exposées sur pc, comme on veut).

Même chose pour agrémenter ça par quelques images. Pour faire passe-partout, des motifs ça peut être bien. Des images simples. À la rigueur, tu peux piocher dans les images en Creative Commons sur Flickr. Le mieux, quand tu en as trouvé une de sympa à utiliser et qui s'intègre bien à ta maquette, c'est de contacter l'auteur pour l'informer et/ou lui demander la permission. Tu pourras ensuite mettre une mention de l'auteur de l'image en commentaire dans l'en-tête de la feuille de style, par exemple.

Au fait, sur un écran un peu large ça fait vite… ben très large. Pas super pratique pour la lecture du texte.
Pour mon blog, j'ai utilisé un max-width en em, et pour IE un max-width à 900px. Ce qui donne ceci :

div#page {
	max-width: 70em;
	width:expression(document.body.clientWidth > 900? "900px": "auto" );
	/* émule un max-width de 900px dans IE via Javascript */
	margin: 0 auto;
}

Sinon, et pour finir, j'ai repéré ceci dans ta feuille de style :

body {
cursor:default;
}

Chez moi, le curseur est une flèche lorsque je passe sur du texte, et plus un curseur barre (qui signale la sélection possible de texte). Il n'y a que lorsque je passe sur un lien ou sur une zone de saisie que le comportement du curseur est normal.
Je trouve ça super déroutant. Je ne sais pas si c'est voulu ou pas, mais en tout cas c'est une faute d'ergonomie.

BUG REPORT : les liens d'accessibilité et la zone de recherche sont positionnés en absolu par rapport non pas au cadre mais à la page web elle-même. Du coup, avec la largeur limitée dans les grandes résolutions, ces éléments se retrouvent en dehors du cadre principal.

Sinon, dans la foulée :
– l'étoile blanche sur fond jaune se voit à peine ;
– si tu ne peux pas utiliser d'images, penses alors à varier les couleurs ;
– dommage que le titre d'un billet ne donne pas accès (lien) à la page du billet elle-même…
– le lien « Flux RSS » devrait être au dessus des liens pour l'administration, vu qu'il s'agit de l'offre de communication envers le public…
– à tester : un menu avec du texte qui serait plus grand que le texte moyen, plutôt que plus petit ;
– pour le :hover du h1, je préfère la couleur suivante : rgb(40, 120, 180) ;
– un peu plus d'espace entre le menu et la zone de contenu ?
– je ne serais pas contre une petite marge en haut et en bas du body (genre .8em ou 1em) ;
– je ne suis pas fan du fait que les liens du menu utilisent deux conventions graphiques différentes au survol, suivant leur position hiérarchique. Les différences de taille de police montrent déjà la différence hiérarchique, tandis que les différences dans le dynamisme (effet au survol) laisserait penser qu'on a des fonctions différentes, ce qui n'est pas le cas : dans les deux cas, il s'agit de liens internes au blog) ;
– le <hr class="comments" /> me semble superflu, graphiquement parlant… et sémantiquement aussi, en fait : il serait approprié s'il s'agissait de séparer le billet du bloc des commentaires, et pas juste du lien qui mène au bloc des commentaires de la page du billet… enfin c'est un point de vue discutable
– gris sur gris pour rédiger un commentaire, c'est pas super pratique. Moi je voudrais bien du noir pour la couleur du texte, du noir bien noir.
– PAR CONTRE, dans la page du billet, là il faut utiliser un <hr class="comments" /> pour séparer le billet des commentaires, et pas un hr simple comme sur la page d'accueil, où le hr simple séparait deux billets différents ;
– le commentaires dans un bloc avec un retrait et une couleur de fond, pour casser un peu la structure trop rigide ?

a écrit :
BUG REPORT : les liens d'accessibilité et la zone de recherche sont positionnés en absolu par rapport non pas au cadre mais à la page web elle-même. Du coup, avec la largeur limitée dans les grandes résolutions, ces éléments se retrouvent en dehors du cadre principal.

exacte et le centrage du bloc principal n'était plus assuré non plus, c'est réglé.

a écrit :
pour le :hover du h1, je préfère la couleur suivante : rgb(40, 120, 180) ;

Je suppose que la couleur est trop saturée sur ton écran ... c'est modifié

a écrit :

* le lien « Flux RSS » devrait être au dessus des liens pour l'administration
* une petite marge en haut et en bas du body

modifié.

a écrit :

deux conventions graphiques différentes au survol des liens du menu alors que qu'il y a déjà des différences (couleur et taille/hiérarchie) sans survol. Ce qui laisserait penser qu'on a des fonctions différentes, ce qui n'est pas le cas : dans les deux cas, il s'agit de liens internes au blog) ;

La version originale est encore plus problématique. Dans l'absolu tu as raison, on pourrait penser que la nature des liens est différente à cause du hover different. On peut cependant dire qu'il y a bien 2 types de liens : ceux qui mènent à un billet et ceux qui permettent des méta fonctions (revenir à l'accueil, flux rss) mais tu parles de la distinction interne/externe. Distinguer ces liens est une très bonne idée, en effet.
Il serait en effet intéressant de savoir comment sont interprétés les hover différents sur les liens (interne/externe ? contenu de nature différente ? popup interne ? ...)
Je vais remettre tout ça a plat rapidement, ce n'est pas fait pour le moment.

J'ai également appliqué une différentiation entre liens visités et non visités du menu mais elle pour le moment stupide puisque les liens visités sont plus contrastés que les liens non visités. A refaire ...

a écrit :
dommage que le titre d'un billet ne donne pas accès (lien) à la page du billet elle-même…

En navigant sur le blog ça n'a pas d'utilité, par contre pour faire un lien ou bookmarker un billet ça peut être utile, pour le moment je n'ai pas trouvé de solution pour ajouter un 'permalien', présent avec la config avec et sans commentaires, à la fin du billet.

---

a écrit :
un menu avec du texte qui serait plus grand que le texte moyen, plutôt que plus petit

J'ai très legerment augmenter la taille de l'ensemble des textes du menu.

a écrit :

* l'étoile blanche sur fond jaune se voit à peine ;
* si tu ne peux pas utiliser d'images, penses alors à varier les couleurs ;

Je reglerai les questions esthétiques dans un second temps.

a écrit :
un peu plus d'espace entre le menu et la zone de contenu ?

c'est délicat, j'ai fait pas mal d'essais , c'est pour plus tard.

Pour ce qui est des <hr> et de la couleur du bloc 'commentaires' j'étudie ça ce soir ou demain ...
je reposte quand les modifs sont faites.

merci