[Amateur] Mon premier site ADGW

Bonjour à vous.

Je suis en train de développer un site pour une amie verrière et je viens à vous afin de le soumettre à la critique.
Ce site est le premier que je conçoit de toutes pièces, seul le script de la gallerie n'est pas de mon fait.
Le design est en cours de finalisation, notement pour ce qui de la page d'accueil et pour le menu vertical.
Pour ce qui est du contenu, il y a une partie administration et c'est la destinataire du site qui s'en charge.

Etant amateur et d'un niveau relativement faible, je suis ouvert à toutes critiques pouvant m'améliorer tant pour le design que pour la partie codage et sécurité.

Je vous remercie par avance de votre attention et attends avec impatience vos remarques.

Lien du site : ADGW

Edit : un simple commentaire sera le bienvenu
Modifié par Hikingyo (12 May 2012 - 18:11)

Le lien est pas bon

Merci pour la remarque ^^"

Lien a été éditer dans le premier post.

Il y aurait tant à dire que vous n'en dites rien ?
Modifié par Hikingyo (12 May 2012 - 17:30)

Bonsoir,

quelques erreurs à corriger. dans le code source, tu peux te servir du w3c validator.

pourquoi 2 bulles "news"? pis, sur l'une des 2, tu n'as pas de lien pour revenir sur la page d'accueil.


humm, là :

<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

sauf que tu n'es pas en html5, mais en html4 transitional. donc cela ne sert à rien.

la couleur des titres, la police ne rend pas l'ensemble super lisible. mais bon, question design, je laisse le soin à d'autres de t'en dire un peu plus.

Bonjour,

Bien qu’assez jolie, ta page d'accueil (aussi appellé Splash Screen) n'as pas vraiment d'intérêt (elle n'informe pas sur le contenu du site et risque de faire perdre quelques visiteurs potentiels), il serait préférable pour le visiteur d'arriver directement sur les news (ou mieux sur une page de présentation de l'activité.

Sur les autres pages, ton menu est à revoir, c'est ce qu'on appelle un menu "Mystery Meat" (traduire: pain surprise). On doit passer la souris sur chacun des éléments avant de pouvoir prendre la décision de sa destination. De plus, au survol (qui est impossible au clavier), la police utilisée est très difficile à lire.

Pour le contenu, comme tu n'as pas spécifié de largeur maximale (max-width), il prend beaucoup trop de place sur grand écran. Il serait préférable de limiter la largeur du site à 980 - 1000 px et de le centrer. Cela évitera les looooooongues lignes à lire (ce qui est particulièrement difficile sur écran).

Toujours sur le contenu, l'anglais est très mauvais. Sauf si une grande partie des clients de ton amie est anglophone (et encore, là il faudrait demander à un pro de le revoir), il serait préférables de s'abstenir de traduction (une mauvaise traduction donne une image très amateur et n'incite vraiment pas à commander).

Sur la page CV, puisque ton amie a une activité hors de France, il ne faut pas oublier d'indiquer le pays dans l'adresse et l'indicatif téléphonique.

Pour le code, comme déjà signalé par Floyd, pense à passer tes pages au validateur. Mais il y a d'autres problèmes :
* Tu ne précise pas la langue du document (attribut lang sur HTML et meta ContentLanguage dans le header).

* Le alt sur les liens ne sert à rien (d'ailleurs, il n'a pas dur tout à s'y trouver), il faut le supprimer.

* Les titles spécifiés sur les liens ne servent à rien non plus, puisqu'ils reprennent exactement les intitulés des-dis liens. Il faut les supprimer pour éviter la redondance et le "bruit" qu'elle occasionne.

* Pense à signaler les changement de langue quand tu écris en anglais (attribut lang sur le conteneur).

* Le contenu manque de hiérarchie (H1 -> H6). Les titres de chaque pages "titrepage" doivent être inclus dans un h1 (d'ailleurs le nom de la classe donné au div l'annonce).

* Tu utilises des styles en ligne répétitifs, il serait préférable de les inclure dans ta feuille CSS.

Merci pour vos commentaire. Je vois que j'ai du pain sur la planche
Modifié par Hikingyo (12 May 2012 - 20:01)

Hikingyo a écrit :
Première chose à faire, changer le DTD, d'autant que celui pour html 5 et tous simple ^^"

Ou pas... Si tu ne comptes pas utiliser d'éléments HTML5, il n'y a pas vraiment d'intérêt à changer de doctype, il serait plus intéressant de passer à un doctype strict.

Hikingyo a écrit :
Concernant la correction du code, comme pour mes redac à l'école, je ferais ça avant de la remettre au prof, d'autant que certaine partie ne sont pas encore finalisées. Ce ne sera qu'à ce moment que je le passerais à la moulinette du w3c.

Ce n'est pas vraiment la meilleure des pratique : il vaux mieux s'assurer de la validité du code dès le début du projet pour éviter de te retrouver avec une tonne d'erreur plus difficile à localiser.

Pour ce qui est du DTD, je maintiens car il y aura dans un avenir proche des balises HTML5.

Encore merci pour tes conseils et ta réactivité qui très appréciable, Laurie-Anne.
J'ai pris note de vos remarques et m'y mets de ce pas.

Edit : une question, dois-je faire en sorte que le head change en fonction de la langue choisie par l'utilisateur ?
Pour la déclaration de langue j'ai trouvé ceci
Du coup, je pense qu'il faudrait que je fasse en sorte que le certaine balise du head change en fonction de la langue choisie. Est-ce que je me fourvoie ?
Modifié par Hikingyo (13 May 2012 - 00:34)

Pour la déclaration de langue, en HTML5, effectivement, lang est suffisant. Avec ton doctype actuel, il est préférable d'utiliser les deux.


Comme tu as les deux langues sur chaque page, il faut choisir fr ou en. Je privilégierai fr, puisque c'est la langue de l'auteur (et que l'anglais est vraiment mauvais (d'ailleurs, je me répète, il serait préférable de mettre le site en français uniquement)).

Merci pour tes remarques.

J'ai choisie de changer le DTD pour celui du html5, envisageant de l'utiliser dans un proche avenir. Pour l'instant je me concentre sur le design qui reste encore à désiré.

Au sujet de la traduction, comme je ne m'occupe pas de la redaction, j'ai fais par de ton avis à la commenditaire du site. Elle devrait se rapprocher d'une bilingue confirmée afin d'améliorer la qualité de la traduction.
Etant donné qu'elle est amenée à travailler souvent à l'étranger, l'anglais s'avère indispensable.

Si vous avez d'autres sugestions n'hésiter pas à m'en faire part. Je suis conscient d'avoir encore énormément de carences en terme de conception de site et je ne demande qu'à m'améliorer.
Modifié par Hikingyo (13 May 2012 - 23:02)

salut,

page contact vide. page expo vide.
images pas habillées en brut dans le HTML.

\http://xob3v1l.no-ip.org/webdev/adgw/ow/photos/mitoe031.jpg en 404 et ta 404 est pas customizée du coup c'est pénible de tomber sur la page d'erreur traditionnelle.

Le slideshow est pas trop mauvais.

L'ergonomie c'est n'importe quoi, on ne sait pas où cliquer pour accéder à on ne sait quoi.

Le logo est simple mais sympa.

Après j'ai bien conscience que c'est un site amateur donc c'est pas mal mais tu pourrais le rendre plus actuel dans dans le design.

Salut,

Pour ma part, je trouve le slideshow un peu lourd par rapport au côté volatile que tu as donné au site. Qui plus est ça ne met pas les photos en valeurs.
Peut être mettre un fond blanc et redessiner la navigation (flèches).
Modifié par hophop (14 May 2012 - 15:57)