[Intermédiaire] : Mon site

Salut,

Voici l'adresse de mon site : http://pok.li/2

J'attends vos critiques d'un point de vue design et code.

Merci d'avance !

A+
Modifié par ganjaaw (22 Dec 2010 - 14:39)

Bonjour,

Merci de bien vouloir éditer ton message afin de placer le nom ou l'URL de ton site dans son titre, comme cela est demandé dans les règles du salon.

Les fautes d'orthographe et de syntaxe sur le texte d'intro énorme, ça choque et ça ne fait pas du tout pro. Utiliser word pour vérifier les accords et l'orthographe est une très bonne habitude à prendre.

Visuellement, sous IE6, il y a des bugs (la galerie se positionne à la ligne après le bouton précédent ; et le bouton suivant se trouve également à la ligne à moitie superposé au bloc twitter).

Pour le code :
* tu as une petite erreur à la validation.

* Tu as 8 scripts externes (plus des internes à externaliser) et 11 feuilles de style. C'est énorme ! Et ça ralenti ton site (11s de chargement selon GT metrix, c'est beaucoup trop). Bien que pour certains il soit plus facile de travailler avec des fichiers séparés pour les CSS et le JS ; lorsque le site est mis en production (en ligne) il faut limiter le nombre d'appel au serveur (ta page d'accueil en totalise 33), notamment en réduisant les fichiers externes au minium vital (idéalement 1 fichier CSS et 1 fichier JS, tous deux minifiés).

* Le poids total de ta page est assez important 780Ko, pour une page d'accueil c'est trop. Pour diminuer le poids de la page, la première étape serait de redimensionner les images côté serveur plutôt que côté client (ou mieux, le redimensionner avant de les uploader).

* Ton serveur n'envoyant pas la langue principale du document, il faudrait rajouter une meta Content-Language.

* La meta keywords ne sert strictement à rien (mais vraiment rien du tout, à part prendre de la place).

* Ta meta description n'est pas particulièrement attirante pour le visiteur potentiel, rend là plus sexy.

* Il est préférable de placer les scripts en fin de document, afin de ne pas ralentir le chargement du contenu de la page.

* Ta hiérarchie des titres est incorrecte : elle doit commencer par h1 et ne pas comporter de sauts (pas de h1 suivit de h3 sans h2 entre les deux).

* Ta hiérarchie des titres est également inapproprié, le paragraphe que tu défini comme h2 et h1 (et pas de la meilleure façon) n'est pas une suite de titres, c'est un paragraphe (une tagline, plus précisément). Les titres d'un site doivent être logiques, comme ceux d'un livre.

* Les images porteuse de contenu doit TOUJOURS se trouver dans le code HTML et non en fond appelées par CSS. C'est le cas de ton logo.

* Le target=_blank est le meilleurs moyen de perdre des visiteurs (quoi qu'on en pense). Personnellement quand un site ouvre une nouvelle fenêtre, j'ai deux options : 1. le nouveau site m'intéresse, je ferme le premier (bye bye bouton retour vers ton site) ; 2. je ferme la nouvelle fenêtre parce que ça me dérange que l'on choisisse pour moi ce que doit faire mon navigateur et je quitte le premier site (sauf s'il est réellement intéressant, ce qui n'est pas tellement fréquent). La moindre des choses serait, au moins de prévenir que le site va ouvrir une nouvelle fenêtre.

* Quitte à vouloir utiliser l'attribut target, autant l'assumer jusqu'au bout et utiliser un doctype transitionnal plutôt que du JavaScript.

* Afficher fièrement le "valide CSS et XHTML", c'est très amateur, surtout quand les liens annoncent que les codes ne sont pas valides.

Okay bah merci pour ton analyse vais faire les modifs.

La meta keywords est innutile.
Tu mélanges et tu te répète dans la meta description et la balise title.
La meta description est la même pour toutes les pages.
La balise title contient des information superflue et colle mal avec le contenu de tes pages.
Il manque le / à la fin de ta meta y_key:
<meta name="y_key" content="cac34658131fd5b8" />

Le logo NE DOIT PAS se trouver dans la css mais dans le code avec un texte alternatif. Au passage il serrait pratique de la mettre dans un lien avec une balise de titre.

On ne peut pas naviguer dans ton site avec le clavier.

Tu utilises la balise h2 pour mettre en forme du texte. Il devrait plutôt se trouver dans une balise <p>

Les images des petites flèches de ton carrousel devrait avoir un texte alternatif du genre "suivant" et "précédent". Au contraire dans la page projet, l'attribut alt de tes images devrait être vide.

Pourquoi ne pas avoir mit les petites icônes des listes de la colonne de droite dans la css ?

Ta liste de lien sous le titre "Blog" bug chez moi. La fin est cachée par le footer. Je suis sous FF 3.6.9


edit: J'ai été devancé.
Modifié par mng (09 Sep 2010 - 10:14)

okay vais modifier les différentes choses dans la soirée

Laurie-Anne a écrit :

* La meta keywords ne sert strictement à rien (mais vraiment rien du tout, à part prendre de la place).

A ce propos j'ai lu un article de google concernant la balise meta keywords, ou ils disent qu'elle ne sers à rien, mais peut être utile pour d'autre moteur de recherche ?

3arly3F a écrit :

A ce propos j'ai lu un article de google concernant la balise meta keywords, ou ils disent qu'elle ne sers à rien, mais peut être utile pour d'autre moteur de recherche ?

Parce qu'il ne peuvent se prononcer pour les autres moteurs. Les moteurs les plus importants Google, Yahoo, mns... n'utilisent pas keyword (principalement parce qu'on peut y mettre tout et n'importe quoi et qu'en général c'est surtout du n'importe quoi ; il est bien plus pertinent d'utiliser le contenu de la page)

J'ajouterais aussi un argument intéressant que j'ai lu quelque part : En mettant la balise keywords, c'est un indice de taille pour tes concurrents afin de savoir sur quels mots clés tu essayes de te positionner.

À noter que je plaide coupable, cette balise se trouve encore sur plusieurs de nos réalisations. Vestige du temps passé...
Modifié par Tony Monast (09 Sep 2010 - 22:52)