[Pro] lamanutention.com / portfolio

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!

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.

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?

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 !!

Finalement je crois aussi que j'ai eu pas mal la flemme 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)

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...

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.

Hop : Les ombrages en CSS3

Patidou a écrit :
Hop : Les ombrages en CSS3

merci, je l'ai "survoler", je vais laisser tomber les ombres sur IE, c'est moche !

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 ?

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]>

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 />
Modifié par Heyoan (22 Feb 2010 - 12:01)

Pour les erreurs avec le lien du W3C, tu dois encoder les & par des &amp;
Modifié par Tony Monast (22 Feb 2010 - 13:19)