Votre avis (performance, rapidité d'affichage)

[jreaux62]

Bonjour,
je programme et développe mes propres fonctions/design/CMS.
Pour le design, je pense humblement "me débrouiller"...

Quel est votre avis sur ce site : http://www.elevage-d-argan.fr ?
- performance, rapidité d'affichage (images de fond,...)
- compatibilité cross-browser ? smart-phone ?
- optimisation possible ?

Merci.

[XxArchangexX]

Bonjour,

Sur les performances, pour ma part rien à dire j'ai testé sur différents navigateurs tout fonctionne bien, les images se chargent rapidement.

résolution : 1600*900.

Pour un avis personnel :

1/ Le haut est juste magnifique .

2/ Le menu dynamique qui s'ouvre automatiquement n'est pas mon truc.

3/ Le seul point qui me bloque un peu, le sous bandeau de la page accueil pour mettre en avant les valeurs est un peu grand, il cache un peu les informations en dessous, peut être le passer de 400px à 300px.

En tout cas très beau travail .

[Michaeljackfan]

Salut,

Je trouve aussi le design réussit. La taille des images de présentation ne me dérange pas.

En revanche, le menu me déplait. Si l'on va sur "L'élevage" et que l'on souhaite descendre sur "À vendre", on atterit soit sur "Infos/contact", soit sur "Partenaires".
Et c'est de toutes façons déstabilisant lorsque les éléments de la page se mettent à bouger sans qu'on le souhaite. Pas pratique du tout à utiliser, à mon avis.
Mais c'est le seul reproche que j'ai à faire.

[jreaux62]

Bonjour et merci.
Je comprends la réticence sur le menu avec effet (on 'mouseover' au lieu de on 'click').
Il est plus agréable quand les sous-menus font la même hauteur (pour éviter le désagrément évoqué par Michaeljackfan).

[rodolphebrd]

Bonjour,

Graphiquement le site est réussi.

Le chargement est correct (testé sur mac safari et firefox).

La méta keywords ne sert à rien sinon de permettre à google de placer sa pub.
L'attribut title des images n'est pas utilisé de manière pertinente (même si tu cherches à optimiser ton seo). Utilisé sur les liens il doit aider l'utilisateur à naviguer et non reprendre les termes de ceux-ci, parasitant ainsi ton code. Sur les images il n'apporte rien.

Ton site n'est pas responsive (mais c'est peut-être voulu).
Le woorank est de 49,3 avec une erreur de validation.
Il n'y a pas de sitemap.

Concernant l'accessibilité:

1 - Il n'y a pas de skip link;
2 - Ton menu (j'aime pas trop mais il fonctionne bien) devient illisible au zoom (texte bien-sur!). A 200% on ne peut plus naviguer du tout;
3 - le footer disparait au zoom;

[Muchos]

Envoyé par rodolphebrd

La méta keywords ne sert à rien sinon de permettre à google de placer sa pub.

Hein ?

Concernant l'accessibilité

En effet, elle n'est pas bonne. Entre autres, le menu est (assez) difficile à utiliser à la souris, et inutilisable au clavier.

---

Pour ma part, je suis comme tout le monde : bluffé par la réalisation graphique.

J'ai deux questions en ce qui concerne le code html de la page d'accueil (très propre, bien structuré (sauf les titres)) :

1. À quoi sert la balise HR à chaque niveau de menu ?
2. Comment fonctionnent les preloads en fin de code, sachant qu'il n'y a que des commentaires ?

[rodolphebrd]

@Muchos: je me suis exprimé rapidement, je parlais du cas d'Adsense :meta-keywords-au-moins-pour-ses-publicite

[jreaux62]

Hello, et merci pour vos commentaires.

- Navigation du menu au clavier : je n'y avais pas pensé.
Pourtant, je suis sensible à l'accessibilité.
A revoir, sans doute (en proposant une autre version du menu, plus accessible ?)

@ Muchos :
- Les <hr /> dans le menu ? Juste pour créer des lignes de séparations
- Le pré-load : en effet, ici, il n'y a pas d'images à pré-loader !
(c'est un fichier en include, dans lequel je mets, si nécessaire, des fonds de page ou autre images, à préloader pour éviter les temps d'attente lors de la navigation)
On peut en effet imaginer qu'au lieu d'une seul image (de cheval) en fond de page, l'image soit différente d'une rubrique à l'autre (par exemple).

[jreaux62]

Ce souci d'accessibilité du menu me chiffonne.
Il est basé sur jQuery (ouverture/fermeture des sous-menus).

Quelles solutions me conseillez-vous pour améliorer l'accessibilité ?
Merci

[Muchos]

Envoyé par jreaux62

Ce souci d'accessibilité du menu me chiffonne.

Pourquoi pas une balise NOSCRIPT ?
Quand je teste la page sans scripts, le menu fonctionne aussi avec le focus au clavier.

[jreaux62]

En désactivant Javacript, le menu reste ouvert, certes.
Mais les infos/photos... sur les fiches des chevaux ne s'affichent plus (affichage via Ajax/PHP).

Pas évident d'allier originalité et efficacité...

NB. En tout cas, je n'ai pas posté pour rien : en plus des compliments, vous avez soulevé quelques lièvres...

[EDIT] J'ai remplacé 'mouseover' par 'click' sur le menu.

[jreaux62]

@rodolphebrd
Concernant les attibuts title, il me semble pourtant qu'ils sont, en général, bien utilisés.

Un exemple (lien vers fiche cheval) :

Code html :

1
2
3
4
<a title="Voir le Descriptif : Paul's Pet" href="http://www.elevage-d-argan.fr/poney-connemara/poney/7-paul-s-pet.html">
<div class="chx_class_Avendre_bande_fr"></div>
<img width="150" height="150" alt="Paul's Pet" src="http://www.elevage-d-argan.fr/upload/images/dossier-chevaux/2006-7-paul-s-pet/picto/7-1352279995-paul-pet-01.jpg">
</a>

- alt sur l'image : "Paul's Pet"
- title sur le lien : "Voir le Descriptif : Paul's Pet"

Autre exemple (menu) :

Code html :

<a title="Prestations proposées par l'Élevage d'Argan" href="http://www.elevage-d-argan.fr/poney-connemara/argan/prestations.php"> Prestations</a>

- lien : "Prestations"
- title sur le lien : "Prestations proposées par l'Élevage d'Argan"

[rodolphebrd]

L'attribut title doit apporter une aide supplémentaire à la navigation.

Dans certains de tes liens l'info est redondante et n'apporte rien de plus.

L'attribut title est peu utilisé sauf dans le cas d'icônes ou boutons.

[rodolphebrd]

Pour étayer mes propos :

Code html :

<a href="http://www.elevage-d-argan.fr/" title="Elevage d'Argan : Poneys de Sport Connemara">Poneys de Sport Connemara</a>

[jreaux62]

Envoyé par rodolphebrd

Ton site n'est pas responsive

responsive design : c'est une corde qui manque encore à mon arc (ou à ma harpe ?).

[rodolphebrd]

Choisir entre une harpe et un arc, voila une question philosophique sur la portée...