Pages :
Bonjour à tous,

Voila, ca la fout un peu mal pour un soit-disant pro de demander des avis et critiques, mais j'en apprend encore tous les jours, alors ... Smiley smile

En gros j'aimerai bien avoir des avis constructifs notamment pour l'amélioration du code, qui a mon avis, n'est pas très propre bien que valide en XHTML 1.0 Transitional.

Le site :
http://lamanutention.com/

pour infos, j'ai abandonné IE6 depuis quelques mois.

Merci,
Modifié par lakeup (21 Feb 2010 - 17:12)
Modérateur
Bonjour,

Graphiquement, j'aime bien l'aspect général. C'est très joli.

Il s'avère par contre impossible de consulter le portfolio si le Javascript est désactivé. Ce serait à corriger.

À plus tard!
merci, c'est vrai pour le js, je vais mediter ça, je n'y avait carrément pas pensé !

Du coup je viens aussi de m'apercevoir que je n'ai pas respecté du tout la hiérarchie des titres, je corrigerai ça dans la semaine.
Modifié par lakeup (21 Feb 2010 - 17:30)
Modérateur
Dans le même ordre d'idées, il est aussi impossible de naviguer dans ton portfolio si les images sont désactivées. Il serait préférable que les boutons de navigation (précédent, suivant) soient des images avec un attribut ALT.
Modérateur
Pour terminer :

- Retirer l'attribut HTML border="0" des images. Il s'agit d'un attribut de présentation, alors vaut mieux passer par CSS pour les enlever. Un bon vieux a img {border:0} devrait faire l'affaire.

- Retirer les quelques br en fin de document qui servent à créer une marge. Vaut mieux utiliser le CSS pour créer ces marges.

- Le texte alternatif des images du Portfolio sont toujours les mêmes. J'imagine que c'est pour le référencement, mais j'ai une certaine réserve là-dessus : pour l'utilisateur et aussi pour les robots d'indexation, ça peut porter à confusion. Ça donne l'impression que le lien vers le site du client, son site, fait de la "réalisation de site internet mar**ille". Tu me suis?
Merci pour toutes tes remarques, (en plus j'suis couillon j'ai deja un a img {border:0} dans ma css...
Bonjour,

Rapidement en passant parce que c'est quand même énorme : les balises Hn doivent être utilisée pour baliser les titres de section de niveau N et pas pour "améliorer le référencement" (si ça fonctionnais réellement, ça se saurait). Un h3 contenant le nom du site suivi d'un h1 contenant la tagline tu site c'est une erreur (idem pour les h6 Smiley rolleyes ) !

Pour le non support d'IE6, il y a une vraie raison (autre que "ça prend du temps et puis comme ça je contribue à le faire disparaitre") ?
ok, merci, j'ajoute ça sur ma liste !

Pour IE6, je me prive de 15% de clients potentiels plutôt institutionnels, certes. Mais je pense qu'ils sont relativement habitués à voir des sites en vrac. Le reste des mes clients sont dans des configurations plus "classique" on va dire.

Au fait, il parait qu'il est officiellement supporté par microsoft jusqu'en 2014 !! Smiley eek

Finalement je crois aussi que j'ai eu pas mal la flemme Smiley biggrin j'ai fait ce site à temps perdu entre pas mal de boulots, du coup je n'ai meme pas cherché pour ie6, dont je n'ai pas d'install pour tester.

C'est pourquoi je profite d'un peu de temps libre pour refaire ça "propre". Je vais re-examiner la question IE6, mais je sens venir les hack foireux pour gerer le .png en transparence, entre autres ... je n'ai pas vraiment envie de faire des concessions graphiques trop importantes pour m'aligner sur IE6. Enfin je verrai si c'est pas trop galère !

Merci a tous les deux pour vos remarques et votre disponibilité, la plupart vont être adoptées, dans le but de garantir une meilleure accessibilité.
Modifié par lakeup (21 Feb 2010 - 18:30)
re-bonjour,

j'ai fait quelques modifs (surtout visuelles) et la propriété text-shadow que j'aimerai bien utiliser quand meme pour les gens sur safari/firefox/chrome n'est pas valide en CSS2.1

Y a til un hack ou une solution qui contenterai le validateur ? ou alors j'imagine qu'il faut attendre la sortie d'un validateur CSS3... Smiley sweatdrop

merci
Modifié par lakeup (22 Feb 2010 - 10:23)
Bonjour,
lakeup a écrit :
re-bonjour,

j'ai fait quelques modifs (surtout visuelles) et la propriété text-shadow que j'aimerai bien utiliser quand meme pour les gens sur safari/firefox/chrome n'est pas valide en CSS2.1

Y a til un hack ou une solution qui contenterai le validateur ? ou alors j'imagine qu'il faut attendre la sortie d'un validateur CSS3... Smiley sweatdrop

merci

Il faut choisir le profil css3 dans les options du validateur.

D'un autre côté l'implémentation de css3 avec les préfixes propre à différents moteurs (-webkit, -moz etc.) ne seront de toute manière pas valides.
Igor a écrit :
Bonjour,

Il faut choisir le profil css3 dans les options du validateur.

D'un autre côté l'implémentation de css3 avec les préfixes propre à différents moteurs (-webkit, -moz etc.) ne seront de toute manière pas valides.


merci,du coup comme ça ca passe nikel. je ne savais pas qu'il y avait ce validateur css3 !
Salut,

lakeup a écrit :
C'est pourquoi je profite d'un peu de temps libre pour refaire ça "propre". Je vais re-examiner la question IE6, mais je sens venir les hack foireux pour gerer le .png en transparence, entre autres ... je n'ai pas vraiment envie de faire des concessions graphiques trop importantes pour m'aligner sur IE6. Enfin je verrai si c'est pas trop galère !

Et que pense tu des commentaires conditionnels pour ne cibler que ces vieux dinosaures et leur donner des gif à manger qui seront moins propres mais garderont une transparence déja correcte ? Smiley smile

Sinon j'aime bien ton site, très sobre et les couleurs sont sympa, même s'il manque quand même une petite couleur chaude discrète en soutien.

Dans ton code, il y a plein de méta qui ne servent pas à grand chose, ca pourrait faire un bel allégement du code !

Concernant les titres, je t'invite à lire l'article que Laurie-Anne n'a pas osé te donner car c'est elle qui l'a rédigé : Bien construire sa hiérarchie de titres

Sinon tu pourrais alléger ton code en utilisant moins de classes grâce à la sélection des éléments enfants de leur parent :
ul.tick li {...}

et non pas
li.tick {...}

Ainsi ton code html ne présenterait qu'une seule fois l'occurrence classe="tick" par liste, au lieu de l'avoir à chaque élément de liste présentement.

Sinon il faut éviter d'avoir des balises vides dans ton code html :
<div id="logo"> </div>

Ton logo est porteur d'information, il doit donc impérativement se trouver dans le code html !
Cela peut être ton <hn> de titre avec une balise image comportant l'attribut alt du nom du site :
<h[i]n[/i]><img src="logo.png" alt="La manutention" /></h[i]n[/i]>
Merci pour les infos,
ca y est j'ai modifié le log et la liste, viré aussi pas mal de métas :

<meta name="author" content="augustin aubert"/>
<meta http-equiv="content-language" content="fr" />
<meta name="revisit-after" content="1 week" />
<meta name="rating" content="general" />
<meta name="audience" content="all" />

concernant l'article de Laurie-Anne, je l'ai lu, mais je pense que je me suis enfermé des la conception dans un systeme qui va etre difficile a corriger. bref je vais devoir reprendre ça a zero!
Par contre je ne comprend pas mon XHTML est maintenant invalide :

le lien fournis par le W3C pour valider la css3

validation

me fait plein d'erreur !


<modération : merci de mettre en forme les liens de 3 km Smiley cligne />
Modifié par Heyoan (22 Feb 2010 - 12:01)
lakeup a écrit :
ca y est j'ai modifié le log et la liste, viré aussi pas mal de métas :

<meta name="author" content="augustin aubert"/>
<meta http-equiv="content-language" content="fr" />
<meta name="revisit-after" content="1 week" />
<meta name="rating" content="general" />
<meta name="audience" content="all" />

Non, pas celle-là. Elle est utile : spécifier la langue d'un document

Smiley smile
Merci, j'ai rajouté la meta.

pour le lien, désolé, mais je voulais montrer le lein tel que w3c m'a delmandé de l'ajouter a mon code. toutes mes erreurs XHTML viennent de ce lien, c'est curieux !
Pages :