Vos avis sur http://dull-suburban-times.tk/

Bonjour tout le monde.. et joyeux noël

J'ai commencé la réalisation de ce site après avoir eu un coup de coeur en lisant la dernière news d'Alsacréations qui parlait des nouveautés apportées par CSS 3. Et ça m'a permis de combler également mon envie d'écrire une fiction sous forme de journal d'actualités, que j'avais l'intention de réaliser depuis quelques mois déjà.

Pour l'instant je me suis contenté de le travailler uniquement sous Mozilla 3.5, donc ne vous étonnez pas si ce n'est pas très ergonomique sous un autre navigateur. Je compte par la suite rajouter dans mon CSS des -webkit-, en plus de mes -moz- , mais pour I.E je ne compte rien faire pour le moment..

En fait, je voudrais surtout votre avis sur l'atmosphère que dégage le site - s'il y en a une qui ressort bien sûr... est-ce que ça donne envie de lire, est-ce que ça ne fait pas too much, ce genre de choses. Et puis si vous avez le temps de lire pourquoi pas un avis sur le contenu

Merci d'avance ^^

je remets le lien au cas où : http://dull-suburban-times.tk/ (en aparté si vous connaissez un meilleur fournisseur de redirection d'url que dot.tk je suis preneur)

Salut,

pour aller plus loin lire Quelle est la différence entre une classe et un id ?

J'en profite pour rappeler que la section Apprendre est pleine de bonnes choses.

Je ne m'étenderais pas sur tout ce qui a été dit sur le codage mais plutot la forme.
Niveau forme, super ! Franchement, bravo, l'effet journal est parfaitement rendu et dans le style du site, c'est bien trouvé. Qui plus est, on a l'effet sin city avec les taches de sang rouge, c'est vraiment bien vu. Par contre, je trouve que le "lien" pour changer de page est un peut trop petit et mal vue. C'est mon seul reproche ^^

Bonne chance.
Par contre, le site, c'est pour montrer tes écrits ? Ou a t'il un autre but ?

En repassant par là :

* quel est l'intérêt de nous donner le lien vers ce vilain FRAMESET dont le doctype est invalide plutôt que vers la vraie page ?

* ta page ne contient tout simplement aucune structure sémantique ! Il existe pourtant de nombreux éléments html en plus de DIV, A et IMG.

* si on désactive les images on ne voit plus rien du site (noir sur fond noir).

* quand une image porte une information elle doit se trouver dans le code html en utilisant un élément IMG (avec attribut alt qui va bien) et pas en background css.


En bref c'est un travail de graphiste mais pas de codeur web : de ce point de vue c'est à revoir.

Attila a écrit :

Par contre, le site, c'est pour montrer tes écrits ? Ou a t'il un autre but ?

Oui mon but premier est de montrer mes écrits. Dans un second temps j'essaierai surement de le traduire en anglais pour l'utiliser comme un projet d'anglais dans le cadre de mes études, sauf si j'ai une meilleure idée d'ici là

Heyoan a écrit :

* quel est l'intérêt de nous donner le lien vers ce vilain FRAMESET dont le doctype est invalide plutôt que vers la vraie page ?

c'est pour avoir un lien un peu plus joli que le serveur sur lequel j'héberge le site; mais je suis d'accord pour dire que cette solution est très laide pour l'instant (en plus elle remplace ma favicon.. !)

En ce qui concerne les images, c'est un problème que je n'avais pas remarqué donc je vais songer à y remédier, merci

P.Aels a écrit :
Je compte par la suite rajouter dans mon CSS des -webkit-, en plus de mes -moz- ,

Bêêrk... C'est pas des plus utile en plus... Respecte les normes CSS ce sera bien mieux.

P.Aels a écrit :
mais pour I.E je ne compte rien faire pour le moment..

C'est bien domage, il n'y aurait pas tant à faire (substituer des GIF aux PNG transparents avec quelques commentaires conditionnels, et c'est tout le reste étant correct) pour que le site soit identique sous IE6.

P.Aels a écrit :
En fait, je voudrais surtout votre avis sur l'atmosphère que dégage le site - s'il y en a une qui ressort bien sûr... est-ce que ça donne envie de lire, est-ce que ça ne fait pas too much, ce genre de choses.

Perso, je ne trouve pas l'atmosphère particulièrement intéressante. J'ai une vague impression de déjà vu ; le fond effet journal n'est pas raccord (ou vois quand l'image se répète) et gène parfois la lecture (à cause des différences de couleur et donc de contraste).

Pour ce qui est du code :
* Le titre de la page ne veut rien dire, le titre par défauts serait plus explicite. Pour rappel : ce titre est celui qui apparait dans les pages de résultats des moteurs de recherche, si le visiteur potentiel ne le comprend pas, il ne prendra pas la peine de visiter le site. Ce titre doit être significatif, unique pour chaque page et en rapport avec la page courante.

* Une meta description ne serait pas inutile. Elle ne sert certes à rien pour le référencement, mais elle est utilisée par les moteurs (s'ils la jugent pertinente) dans les pages de résultats et contribue grandement au clic du visiteur. cette description doit, comme le titre être significative, unique pour chaque page et en rapport avec la page courante.

* Comme cela a déjà été signalé, ton site n'as absolument aucune hiérarchie. L'utilisation de titres Hn n'est pas juste pour faire joli. 1. ils aident au référencement ; 2. ils sont particulièrement pratiques pour les utilisateurs de lecteurs d'écran qui les utilisent beaucoup pour naviguer dans les pages. Cette hiérarchie de titres doit toujours commencer par h1 et ne comporter aucun saut (pas de h3 directement après h1 sans h2 entre les deux).

* Attention à tes textes alternatifs :

<img src="images/suburb.png" alt="Suburb Times" />

L'image porte le texte "Suburban Times", le texte alternatif devrait porter le même texte.

* Les liens sur les chevrons sont une mauvaise idée. 1. parce que tant qu'il n'y a pas de page un lien qui ne mène nulle part ne sert à rien ; 2. ils représentent une très petite zone de clic et donc sont difficile à cliquer ; 3. ils ne veulent rien dire, leur sens est obscur, ils serait préférable d'utiliser des mots, en français.

* Que veulent dire "MER" et "DEC" ? Il serait là encore préférable d'utiliser les mots complets.

* L’utilisation de majuscules dans le code n'est pas optimale, il serait préférable de réaliser la capitalisation via CSS.

* Quel est l'intérêt d'utiliser une liste avec un seul item pour contenir une image et un paragraphe ? Sémantiquement parlant c'est complètement à côté de la plaque...

* Ton implémentation de lettrine fait perdre tout sens au mot... Accessoirement la police de la lettrine ne va absolument pas avec le reste du design.

* Il ne faut surtout pas te sentir obligé de donner un texte alternatif à toutes tes images. Seules celles qui sont porteuse de contenu en ont besoin, les images purement décoratives doivent avoir un alt vide :

<img src="images/square.png" alt="  [_] "/>

Bref, il y a encore beaucoup à revoir.
Modifié par Laurie-Anne (28 Dec 2009 - 09:58)

P.Aels a écrit :
Pour être sincère, ça peut paraître idiot mais je n'ai pas réussi à réaliser la légende-cachée-dans-l'overflow-qui-remonte-lorsqu'on-survole-l'image sur d'autres balises que ul et li...

En même temps vouloir faire ça en CSS n'est pas une bonne idée de base. Les animations se gèrent en JavaScript, comme ça tout le monde est content et peut en profiter.

Laurie-Anne a écrit :
Bêêrk... C'est pas des plus utile en plus... Respecte les normes CSS ce sera bien mieux.

Voilà une remarque que je ne comprends pas : pourquoi ne pas utiliser les préfixes propriétaires ? Ca va dans le sens d'une amélioration gracieuse, je ne vois (vraiment) pas où est le problème...

STPo a écrit :
Ca va dans le sens d'une amélioration gracieuse, je ne vois (vraiment) pas où est le problème...

Oui et non. Primo, ces instructions propriétaires ne sont pas valides W3C ; ensuite on ne peut pas être sûrs du suivi dont elles bénéficieront (vu que le CSS3 prends/prendra en compte nombres de ces instructions). Sans parler des problèmes de redondance...

Hermann a écrit :
Sinon le zoom:1 STPo, tu devrais plutôt le mettre dans une CSS conditionnelle
pour IE7- ou IE6-, ça éviterait en plus de l'invalidité d'avoir à supprimer cette déclaration une fois qu'IE6 ou 7 ne feront plus parti des browsers cible.

Moui mais moi je préfère tout centraliser dans une seule CSS
Ca évite de jongler avec 50 fichiers et ça réduit les requêtes HTTP pour des navigateurs - les plus vieux et les moins performants - qui sont déjà lésés. Ca me permet de centraliser toutes les propriétés d'un élément à un seul endroit, ce qui est plus pratique en cas de redesign ultérieur.

De plus, si on commence à cibler IE6-7 avec des CSS propres on devrait logiquement cibler de même Webkit et Gecko pour les propriétés "propriétaires" en question afin de pouvoir les supprimer quand elles ne seront plus expérimentales : on commence à franchement tout éparpiller et je ne suis pas pour...

D'autant plus que je ne me vois pas supprimer mes patchs pour les vieilles versions d'IE (ou même Fx2 comme ça arrive parfois), la rétrocompatibilité prévaudra toujours sur le parc de navigateurs "cible".

STPo a écrit :

De plus, si on commence à cibler IE6-7 avec des CSS propres on devrait logiquement cibler de même Webkit et Gecko pour les propriétés "propriétaires" en question afin de pouvoir les supprimer quand elles ne seront plus expérimentales : on commence à franchement tout éparpiller et je ne suis pas pour...

Il n'existe à ma connaissance pas de méthode robuste et pérenne pour cibler les principaux navigateurs alternatifs, la pérennité des hack de ciblage de navigateurs n'étant pas garantie et les détections de l'UA via JS trop compliquées...

STPo a écrit :

D'autant plus que je ne me vois pas supprimer mes patchs pour les vieilles versions d'IE (ou même Fx2 comme ça arrive parfois), la rétrocompatibilité prévaudra toujours sur le parc de navigateurs "cible".

C'est un point de vue qui peut se défendre, à partir du moment ou tu t'y retrouves.
Ceci dit comment gères tu les problèmes de décalage, de gestion de fusion des marges et d'autres différences de rendu qui nécessitent par exemple de déclarer 2 fois la même propriété? (se baser le !important ou l'underscore/star hack par exemple ne peut fonctionner que sur IE5>IE6).
D'autre part certains de ces hack invalident aussi ta CSS.
Là ou je ne suis pas d'accord c'est que les correctifs sont parfois assez nombreux (essentiellement si tu vises IE6) et qu'ils alourdissent par conséquent pas mal ta CSS; à moins que tu aies systématiquement le temps ou les bons réflexes pour les contourner, ce qui peut s'avérer assez chronophage et pas toujours évident...
Modifié par Hermann (29 Dec 2009 - 15:39)