[Amateur] Carnets de voyage

Bonjour à tous,

Je suis en train de fabriquer un petit hub pour mes trois sites, mais comme je ne suis pas intégratrice, mon code va certainement vous paraître "bricolé"...

C'est ici

Néanmoins, si vous avez des critiques et/ou des conseils pour améliorer tout ça, n'hésitez pas !
On apprend tous les jours...

Prochaine étape : les rollovers !

Merci à bientôt !
Modifié par Laurie-Anne (20 Oct 2011 - 15:59)

Salut graphiklili,

Tout d'abord bravo pour le design, je trouve ça très sympa !

Niveau code, plusieurs choses :

- Sur mon écran, l'image de fond n'est pas assez grande pour prendre toute la largeur. Du coup elle se répète et c'est assez moche. Je te conseille d'utiliser la propriété css3 background-size: cover (plus d'info ici)
- Il vaut mieux externaliser tout ton css dans un fichier .css (un fichier principal et un fichier pour IE).
- Tu as une balise ul sans li. C'est mal !
- Attention la syntaxe pour fermer les commentaire conditionnels c'est : <![endif]--> et pas <![endif]>
- Tu as défini deux fois l'id "menu". Un id doit être unique.
- Tu as 10 erreurs à la validation W3C plus ou moins liées aux remarques ci-dessus.
- Pour les réseaux sociaux en bas, puisqu'il s'agit d'une liste tu aurais également pu utiliser les balises ul li.
Modifié par hchtot (20 Oct 2011 - 16:39)

les remarques d'hchtot sont pertinentes, pas besoin de les répéter.
Moi j'ai un souci concernant tes liens qui mettent 20 ans à charger (ex:les carnets), cela peut en dissuader plus d'un, méfie-toi.

Les

target="_blank"

sont à éviter à mon sens.

Le fond donc l'image a quand même beaucoup de grain même si on sent que c'est l'effet voulu.
Modifié par jmlapam (20 Oct 2011 - 16:49)

Merci pour vos retours

Déjà hchtot, grâce à toi j'ai pu centrer mon background, je ne connaissais pas cette propriété !
J'ai ajouté une balise li dans mon menu et enlevé le 2eme id "menu"

Comment pourrais je faire pour que le bloc titre+menu soit bien centré en hauteur ?
Là j'ai utilisé

position:absolute;
top: 15%;

Modifié par graphiklili (20 Oct 2011 - 17:19)

un article sur le sujet

Re-bonjour !

Pour tes <li>, tu dois en mettre pour chaque ligne de ta liste.

<ul>
<li><a...></a></li>
<li><a...></a></li>
<li><a...></a></li>
</ul>

De plus, tu as toujours tes problèmes d'accessibilité avec tes liens et titre en image.
Voici deux articles qui vont t'aider. À la fin de chacun d'entre eux, il y a d'autres liens pour approfondir le tout.
Du bon usage des attributs alt et title sur les images et les liens.
Remplacement d'images: halte au display none !