Salut à tous,

je viens de finir un site pour une agence de communication nommée Twist-Advertising : http://www.twist-advertising.ch/

Ils m'ont fourni le graphisme, je voulais avoir vos avis et vos sensations (code comme graphisme).

Soyez softs pour le JS, c'est la première fois que je jquery-se autant ! Smiley cligne

D'avance merci !
Bonjour,

Le design est un peu déroutant, mais pourquoi pas.

Les titles sur les liens sont plus dérangeant qu'utiles (surtout que certain ne sont pas corrects (image "yves").

Le site ne supporte absolument pas, mais du tout, l'agrandissement des caractère ; une partie du contenu disparaissant alors dans les méandres de l'extérieur du viewport ; à revoir donc.

Les textes sont super dur à lire ; soit à cause de la police trop fine ; soit à cause du contraste (trop fort ou trop faible).

La non consistence du menu (les noms des gens qui ne sont que sur lapage c'est qui) est perturbante. Il est préférable que le menu reste toujours le même. Après visionage du site complet : OK, c'est pire, le menu contextuel qui apparait avant le menu général c'est pas des plus logique

Pour le code, je me base sur la page "c'est qui ?"
* Le titre de la page est vraiment beaucoup trop long. D'ailleurs il ne s'affiche pas en entier. Accessoirement l'élément important (le nom de la page se trouve après le nom du site (et la tagline qui n'as rien à faire là) et donc j'ai beaucoup de mal à savoir sur quelle page je me situe.

* Une description identique au titre de la page est une mauvaise description (même si dans ce cas ci c'est plutôt le titre qui est mauvais).

* la meta keyword est totalement innutile et innutilisée et peux donc être supprimée.

* Masquer les liens d'évitement est idiot. Ceux qui les utilisent ne sont pas ceux que beaucoup pensent (utilisateurs de lecteurs d'écran) mais plutôt ceux qui naviguent au clavier tout en étant voyant (ainsi que les utilisateurs de mobile). Les masquer les rend donc totalement inutilisables par ces utilisateurs. Les faire apparaitre lors du focus n'est pas génial non plus car c'est perturbant de voir appraitre un truc que l'on attendait pas, tout en se demandant combien d'autres vont apparaitre de la sorte...

* Les alt doivent refléter le contenu textuel des images, il n'est pas nécessaire de répéter des portions de textes qui ne font pas partie de l'image, juste pour une question de référencement. Les titles redondant qui n'apportent rien peuvent (et, limite, doivent) être supprimés.

* Les images purement décorative doivent soit avoir un alt vide soit un alt qui les décrit, mais surement pas un alt qui n'as rien à voir :
<img src="style/twist_avertising_c_qui/trio_twist_advertising.jpg" width="322" height="229" alt="C'est qui ?" />


* Les paragraphes sont fantastiques, ils permettent de créer de vrai paragraphes avec des espaces entre chaque :
<strong>Twist&nbsp;:</strong> les créatifs associés.<br /><br />


* Les listes sont fantastiques, elles permettent de créer de vraies listes avec des puces :
-	planning stratégique,<br />
-	media planning,<br />


* Un peu plus de hiérarchie serait la bienvenue, utiliser h1 c'est bien, mais h2 pourrait être utilisé sur les titres de page.

* Il manque un formulaire de contact, s'il y en a un je l'ai raté, et il y a fort à parier que je ne serait pas la seule.


Bref, un gros problème de sémantique au niveau du cotnenu, mais un code propre.
Salut,

Pour moi la catastrophe c'est en terme de navigation.

Un petit scénario de la démarche du visiteur.
J'arrive sur la page d'accueil, le vois des prénoms. Sans précisions, j'ai pas vraiment envie de cliquer. Et je vois un lien "c'est qui ?" Donc je me demande si les prénoms font partie des "qui" ou non, et pourquoi ils sont dissociés de la page "qui".

Je clique sur "c'est qui" car je veux en savoir plus. Et encore là je suis gentil parce que j'arrive sur une page, je sais absolument pas de quoi il est question, et si je suis feignant au point de vouloir m'éviter un clic, je change même de site...
Donc j'arrive sur la page "c'est qui", et là je découvre que les 3 prénoms de la page d'accueil y sont repris, en navigation secondaire. Mais pourquoi sont ils dans le même cadre que les liens principaux ?

Voulant en savoir plus sur le site, je clique sur "c'est quoi". Et là j'arrive sur une page avec la même structure, avec un sous menu "principe/domaines/brandmovies" dont les liens n'étaient pas présents sur la page d'accueil à l'instar des prénoms des "qui". (au passage, pourquoi principe et domaines n'ont pas le droit à une majuscule ?)

J'arrive sur la page "ils font quoi" et là je cherche dans les deux carrés en bas à gauche ce qui est cliquable et ce qui ne l'est pas, car finalement il n'y a pas de distinction entre les liens et les textes.

J'arrive sur la page "ils aiment quoi", dans laquelle je vois un contenu. Ayant vaguement compris qu'il y a des liens à gauche, je clique sur le lien "prix de la campagne horlogère 2009", et j'ai un vague rafraichissement de page avec pourtant le même contenu.

Voilà un aperçu des questions qu'on peut se poser ou remarques qu'on peut se faire. Quand on veut faire un site ultrasimple, on fait en sorte qu'il SOIT ultrasimple, ce qui n'est pas le cas de celui ci, qui finalement perd l'utilisateur, en plus de n'avoir pas réussi à l'intéresser dès la première page.

Les liens d'évitement sont quasiment invisibles, donc aussi inutiles pour quelqu'un qui navigue au clavier. Ils devraient être plus visibles.

Le plan de la page contact ne présente aucun intérêt car il est parfaitement illisible.

La typographie utilisée pour les textes à la taille ou elle est est globalement illisible, et même si les textes sont peu importants, ils ne donnent pas envie de les lire. Sans compter le problème de contraste sur certaines pages.

En terme de code, j'imagine l'agacement de la personne qui navigue avec un lecteur d'écran et qui se voir répéter "Twist-Advertising, c'est quoi ?" 10 fois d'affilée...

Au niveau sémantique il n'y a quasiment que du div, une véritable hiérarchie avec des titres et des paragraphes ça serait tout de même mieux.

En résumé, un coup dans l'eau en terme de communication, ce qui est dommage vu le domaine dont traite le site, et risque même d'être pénalisant pour l'agence.
Laurie-Anne a écrit :

Le design est un peu déroutant, mais pourquoi pas.


Faisons clair et net : beaucoup d'éléments m'ont été imposés par la team en question : navigation, graphisme, disposition.
J'essaie juste d'intégrer ça au mieux.


Laurie-Anne a écrit :

Les titles sur les liens sont plus dérangeant qu'utiles (surtout que certain ne sont pas corrects (image "yves").


J'en ai corrigé une floppée.

Laurie-Anne a écrit :

Le site ne supporte absolument pas, mais du tout, l'agrandissement des caractère ; une partie du contenu disparaissant alors dans les méandres de l'extérieur du viewport ; à revoir donc.


J'ai corrigé ce problème, notamment en utilisant overflow dans la CSS.

Laurie-Anne a écrit :

Les textes sont super dur à lire ; soit à cause de la police trop fine ; soit à cause du contraste (trop fort ou trop faible).

La non consistence du menu (les noms des gens qui ne sont que sur lapage c'est qui) est perturbante. Il est préférable que le menu reste toujours le même. Après visionage du site complet : OK, c'est pire, le menu contextuel qui apparait avant le menu général c'est pas des plus logique


Imposés par le client... Smiley confus


Laurie-Anne a écrit :

Pour le code, je me base sur la page "c'est qui ?"
* Le titre de la page est vraiment beaucoup trop long. D'ailleurs il ne s'affiche pas en entier. Accessoirement l'élément important (le nom de la page se trouve après le nom du site (et la tagline qui n'as rien à faire là) et donc j'ai beaucoup de mal à savoir sur quelle page je me situe.

* Une description identique au titre de la page est une mauvaise description (même si dans ce cas ci c'est plutôt le titre qui est mauvais).


J'ai corrigé ces points autant que faire se peut.


Laurie-Anne a écrit :

* la meta keyword est totalement innutile et innutilisée et peux donc être supprimée.


Y a-t-il enfin un consensus à ce sujet ? Smiley eek Certains référenceurs conseillent encore de les mettre !


Laurie-Anne a écrit :

* Masquer les liens d'évitement est idiot. Ceux qui les utilisent ne sont pas ceux que beaucoup pensent (utilisateurs de lecteurs d'écran) mais plutôt ceux qui naviguent au clavier tout en étant voyant (ainsi que les utilisateurs de mobile). Les masquer les rend donc totalement inutilisables par ces utilisateurs. Les faire apparaitre lors du focus n'est pas génial non plus car c'est perturbant de voir appraitre un truc que l'on attendait pas, tout en se demandant combien d'autres vont apparaitre de la sorte...


Là encore, je suis entre le client (qui ne les veut pas) et ce que l'accessibilité conseille... obligé de faire un juste milieu (je l'ai rendu plus visible cependant).


Laurie-Anne a écrit :

* Les alt doivent refléter le contenu textuel des images, il n'est pas nécessaire de répéter des portions de textes qui ne font pas partie de l'image, juste pour une question de référencement. Les titles redondant qui n'apportent rien peuvent (et, limite, doivent) être supprimés.


Corrigé.


Laurie-Anne a écrit :

* Les images purement décorative doivent soit avoir un alt vide soit un alt qui les décrit, mais surement pas un alt qui n'as rien à voir :
<img src="style/twist_avertising_c_qui/trio_twist_advertising.jpg" width="322" height="229" alt="C'est qui ?" />



Corrigé.


Laurie-Anne a écrit :

* Les paragraphes sont fantastiques, ils permettent de créer de vrai paragraphes avec des espaces entre chaque :
<strong>Twist&nbsp;:</strong> les créatifs associés.<br /><br />


* Les listes sont fantastiques, elles permettent de créer de vraies listes avec des puces :
-	planning stratégique,<br />
-	media planning,<br />


* Un peu plus de hiérarchie serait la bienvenue, utiliser h1 c'est bien, mais h2 pourrait être utilisé sur les titres de page.


J'ai ajouté des h2 sur toutes les pages.

Laurie-Anne a écrit :

* Il manque un formulaire de contact, s'il y en a un je l'ai raté, et il y a fort à parier que je ne serait pas la seule.


Imposé par le client... de ne pas en avoir un, donc normal que tu n'en aies pas trouvé.


Laurie-Anne a écrit :

Bref, un gros problème de sémantique au niveau du cotnenu, mais un code propre.


Merci pour tes remarques.
Mikachu : faisons clair comme je l'ai dit à Laurie-Anne : cette navigation un peu "inhabituelle", les 9 blocs de la disposition, le graphisme, les effets jquery, les couleurs, la distinction entre les liens et les textes... beaucoup de choses m'ont été tout bonnement imposées d'entrée de jeu.

(inutile de troller, c'est leur envie d'avoir ce site ainsi)

Ajoute à ça les effets Jquery que j'ai eu un peu de mal à implémenter : le pourquoi de la profusion inhabituelle de div dans mon code... j'ai fait en sorte que ça fonctionne correctement sans javascript activé, et que l'affichage "en mode texte" soit aussi correct que possible.

C'est plus dans l'idée "comment essayer de structurer ça de manière correcte, autant accessible que possible, et valide" que je viens chercher des avis et des remarques (ceci dit, je prends bonne note de toutes tes remarques), autant pour moi si je n'étais pas très clair dans ma demande.
Nico3333fr a écrit :
Faisons clair et net : beaucoup d'éléments m'ont été imposés par la team en question : navigation, graphisme, disposition.
J'essaie juste d'intégrer ça au mieux.
Soyons clair, on n'essaye pas de te descendre ou de troller, mais on donne notre avis.

Nico3333fr a écrit :
[à propos des titles sur les liens] J'en ai corrigé une floppée.
J'espère que par corrigé tu veux dire supprimer.

Nico3333fr a écrit :
J'ai corrigé ce problème, notamment en utilisant overflow dans la CSS.
Je suis au regret de t'annoncer que le résultat est pire... Il aurait été préférable de prévoir des blocs agrandissables en largeur, sans que ça mette en péril le design d'ailleurs.

Nico3333fr a écrit :
[à propos des polices] Imposés par le client... Smiley confus
Quand le client n'est pas capable de voir qu'il y a un problème (notamment d'accessibilité) c'est à toi, qui est responsable du développement et donc normalement l'expert dans le domaine, de leur signaler que c'est une connerie.

Nico3333fr a écrit :
[à propos des titres de pages]J'ai corrigé ces points autant que faire se peut.
Je ne vois absolument aucune différence

Nico3333fr a écrit :
[à propos des meta]Y a-t-il enfin un consensus à ce sujet ? Smiley eek Certains référenceurs conseillent encore de les mettre !
Je me base sur les recommendations de Google. Pour les référenceurs qui conseillent encore de les mettre, il faudrait peut-être voir de quand datent leur sources... Les mots clés sont innutilisés par les grands moteurs.

Nico3333fr a écrit :
Là encore, je suis entre le client (qui ne les veut pas) et ce que l'accessibilité conseille... obligé de faire un juste milieu (je l'ai rendu plus visible cependant).
Dans certains cas, ne rien avoir c'est mieux.

Nico3333fr a écrit :
J'ai ajouté des h2 sur toutes les pages.
C'est plutôt des paragraphes et des ul/li (donc un balisage correct) qu'il aurait fallu ajouter...


Je le dis et je le répète : tes pages manquent de sémantique, et ça c'est pas la faute des choix du client.
Modifié par Laurie-Anne (17 Nov 2009 - 12:20)
Salut,

a écrit :
Ils m'ont fourni le graphisme, je voulais avoir vos avis et vos sensations (code comme graphisme).

Pourtant tu avais déja été clair. Je n'ai pas l'impression de "troller" en répondant à une demande que TU as formulé. J'ai juste une sensation négative en tant qu'utilisateur. Je fais juste part de mon opinion, et il n'est dans mes propos nullement question d'imposer de tout refaire, ni pour toi ni pour tes clients. C'est leur site, s'ils le veulent ainsi tant pis pour eux.

En tant que prestataire de service, tu as le droit (selon moi le devoir) de leur faire part des lacunes dont leur site peut souffrir, ce qui peut leur permettre de les réaliser. Libre à eux d'y remédier, ou d'en tenir compte à l'avenir, tout ça dans l'intérêt de leur activité. Ils ne le reprocheront en aucun cas, et ne pourront qu'être satisfaits d'un prestataire qui s'intéresse à leur cas. Mais cela n'engage que ma philosophie, que j'applique avec mes propres clients.

Maintenant je pourrais te dire que ce site est parfait, mais je ne le ferai pas car je ne le pense pas. Parce que pour moi une chose faite n'a pas de valeur, et n'en a que si elle est bien faite, mais si le fait qu'elle soit faite te suffit, alors il ne te reste plus qu'à facturer.

Mon avis se veut franc et honnête, libre à toi de l'écouter ou de l'accepter. Maintenant, je me rappelle que tu avais demandé un avis sur ton propre site il y a quelque mois, avec la même fin de non recevoir, aussi je pense que j'éviterai de perdre mon temps à essayer de t'apporter mon aide.
Bonjour Nico3333fr,

Je suis un néophyte dans toute sa splendeur mais me permets toutefois d'ajouter mon grain de sel.
Question codes je laisserai d'autres plus expérimentés s'exprimer. Je veux plutôt te parler du côté visuel et pratique de ton site.

Le visuel:
La première impression à été wahou !
J'ai beaucoup aimé cette mise en page graphique (avec les carrés) de même que les changement de pages (les blocs qui coulissent). Le choix des couleurs est agréable et reposant. La légèreté et la simplicité sont au rendez-vous (mare des sites HLM où tout est entassé). A ma connaissance, je n'ai encore jamais vu un site présenté comme cela et je trouve le résultat magnifique.


Le pratique
Alors là je rejoints les avis donnés plus haut. Une fois que j'ai cherché à comprendre de quoi il en retourne je me suis perdu.
On ne sait pas de quoi il s'agit.
Quand on entre dans le site on ne sait plus où on est ni par où on doit aller.
Les liens qui renvoient vers d'autres pages ne sont pas assez explicites et j'ai donc cliqué "à pouf" (en Belgique = au hasard).

Ce que moi, néophyte, j'ai vécu, ressentis ...
Ne pas comprendre de quoi il s'agit.
Le sentiment d'être entrer dans un labyrinthe où la sortie n'est pas bien indiquée.
De découvrir des "sous-pages" du sites alors qu'elles ne sont annoncées nul part à l'arrivée. Après avoir chipoté pas mal j'ai doucement commencé à comprendre la structure du site.
Je déteste infiniment les liens qui revoient sur la même page. Si on est déjà sur la page, pourquoi mettre un lien vers cette page !? On s'attend à quelque chose et il n'y a rien.

Dernière chose qui m'a aussi fortement agacé. Quand on arrive sur la page d'accueil il y a 9 cases. Les 8 panneaux cliquables m'envoie sur une seconde page (normal) mais, si je veux revenir en arrière, je suis renvoyé non pas sur la page d'accueil (la précédente) mais sur lien que j'ai suivi. Soit ici. J'ai essayé avec GG c'est pareil je retombe sur la page de recherche.

Voilà mon avis de débutant aux grosses chaussures mal lacées.
Beau travail pour l'idée de présentation mais à peaufiner.
Sinon je trouve l'idée très chouette et très originale.

Bon courage pour la suite.
Donvtt
Modifié par donvtt (20 Nov 2009 - 20:30)
Laurie-Anne a écrit :
Soyons clair, on n'essaye pas de te descendre ou de troller, mais on donne notre avis.


Et je l'écoute et je fais de mon mieux pour corriger les points qui font défaut, en fonction du (peu de) temps libre.

Laurie-Anne a écrit :

Je suis au regret de t'annoncer que le résultat est pire... Il aurait été préférable de prévoir des blocs agrandissables en largeur, sans que ça mette en péril le design d'ailleurs.


Hein ? Comment ça c'est pire ?
J'ai essayé sur un zoom normal sur Firefox et sur un zoom texte (4 fois), et ça fonctionnait ! Smiley eek

Explique-moi alors ton test qui le fait planter alors, je suis curieux !

Laurie-Anne a écrit :

Quand le client n'est pas capable de voir qu'il y a un problème (notamment d'accessibilité) c'est à toi, qui est responsable du développement et donc normalement l'expert dans le domaine, de leur signaler que c'est une connerie.


Oui, je suis tout à fait d'accord !

Mais quand le boss dit "c'est comme ça on n'a pas le temps" ou "le plan de la page ça sert à rien sur ce site" et que tu es gentiment invité à te taire...
Je sais que "ç'ai mal", et c'est pas faute d'essayer et de l'avoir dit, mais le développeur n'a pas toujours le dernier mot.

Laurie-Anne a écrit :

Dans certains cas, ne rien avoir c'est mieux.


Curieux, je pensais que c'était mieux d'avoir quand même qqch de prévu, non ?

Laurie-Anne a écrit :

C'est plutôt des paragraphes et des ul/li (donc un balisage correct) qu'il aurait fallu ajouter...

Je le dis et je le répète : tes pages manquent de sémantique, et ça c'est pas la faute des choix du client.


Je le sais, j'ai compris. Smiley cligne

Seul souci, je corrige ça sur mon temps libre au boulot... donc je fais au mieux, je vais y corriger au fur et à mesure. Smiley cligne
Mikachu a écrit :
Salut,
Pourtant tu avais déja été clair. Je n'ai pas l'impression de "troller" en répondant à une demande que TU as formulé. J'ai juste une sensation négative en tant qu'utilisateur. Je fais juste part de mon opinion, et il n'est dans mes propos nullement question d'imposer de tout refaire, ni pour toi ni pour tes clients. C'est leur site, s'ils le veulent ainsi tant pis pour eux.


Comme je l'ai dit plus haut à Laurie-Anne : je suis entre le marteau et l'enclume (le boss et le client) pour certains choix : quand je disais inutile de troller, c'était juste pour dire "je prends bonne note à titre perso, mais je peux pas faire grand chose sur ces points".

Inutile de te dire que je m'emploie activement à faire de mon mieux autant que possible là où j'ai les coudées franches.

Mikachu a écrit :

En tant que prestataire de service, tu as le droit (selon moi le devoir) de leur faire part des lacunes dont leur site peut souffrir, ce qui peut leur permettre de les réaliser. Libre à eux d'y remédier, ou d'en tenir compte à l'avenir, tout ça dans l'intérêt de leur activité. Ils ne le reprocheront en aucun cas, et ne pourront qu'être satisfaits d'un prestataire qui s'intéresse à leur cas. Mais cela n'engage que ma philosophie, que j'applique avec mes propres clients.


On est 100% d'accord : je le fais aussi (j'ai fait part de mes réserves sur divers points) et j'explique autant que possible la démarche.

D'ailleurs ils ont apprécié l'explication "code valide XHTML", l'utilisation des CSS, utilisation de JQuery plutôt que Flash, la navigation au clavier possible, et la plupart des points que j'ai pu leur expliquer.

Mikachu a écrit :

Maintenant je pourrais te dire que ce site est parfait, mais je ne le ferai pas car je ne le pense pas. Parce que pour moi une chose faite n'a pas de valeur, et n'en a que si elle est bien faite, mais si le fait qu'elle soit faite te suffit, alors il ne te reste plus qu'à facturer.

Mon avis se veut franc et honnête, libre à toi de l'écouter ou de l'accepter. Maintenant, je me rappelle que tu avais demandé un avis sur ton propre site il y a quelque mois, avec la même fin de non recevoir, aussi je pense que j'éviterai de perdre mon temps à essayer de t'apporter mon aide.


Ne le prends pas mal, inutile d'être cassant : je l'écoute et j'en prends bonne note.
Je sais que ce site est pas parfait techniquement.
Au mieux, je corrige ça sur mon temps libre. Au pire, pour le site suivant et pour ma culture personnelle. Donc ça n'est jamais perdu.

Si tu estimes que je n'écoute pas ce que tu dis et que tu perds ton temps, je te dis aimablement... que tu te trompes.
Merci pour ton avis ! Smiley cligne

donvtt a écrit :

Dernière chose qui m'a aussi fortement agacé. Quand on arrive sur la page d'accueil il y a 9 cases. Les 8 panneaux cliquables m'envoie sur une seconde page (normal) mais, si je veux revenir en arrière, je suis renvoyé non pas sur la page d'accueil (la précédente) mais sur lien que j'ai suivi. Soit ici. J'ai essayé avec GG c'est pareil je retombe sur la page de recherche.


ça j'avoue que j'ai pas su comment faire pour régler ce problème !

Quelqu'un a une idée ?