vaurel.free.fr/apple/apple.html

Bonjour,

J'aimerai avoir votre avis sur mon code (html5, css3) de ce site : http://vaurel.free.fr/apple/apple.html

Toutes corrections sont bonne à prendre pour avancer correctement notamment en html5 et css3 .

Merci les g33K ;)

Bonjour,

on parle bien du code (pas du graphisme alors) ?

Mais que dire des effets de survol sur les boutons.

La page est un peu lourde pour commencer : 177KO.
Surtout que l'image principale prend 60% de l'ensemble.
On imagine qu'il pourrait y avoir d'autres aménagement augmentant le poids...

Sinon côté perf il y a ça à étudier : http://gtmetrix.com/reports/vaurel.free.fr/fP4weff9

merci

par contre j'ai un soucis sous chrome
quand je vais vers la droite avec mon touch pad, il m'affiche le reste de l'image "gazon"
alors que j'ai un overflow-x:hidden

aucun problème sous ff, ie10, ie9 et ie8

as tu une idée?


et concernant le code en lui même?

c'est important pour moi car c'est un site qui doit être parfait car je dois le présenter

Citation:

---

Envoyé par oceane751

quand je vais vers la droite avec mon touch pad, il m'affiche le reste de l'image "gazon"
alors que j'ai un overflow-x:hidden

---

:koi: Je ne comprends pas trop ce que tu veux ?
J'ai le même rendu sur Ch, Saf et FF.

Par contre ce que je peux dire concernant le background gazon, c'est qu'il n'est pas logique.

Pourquoi avoir dupliqué le panier et les pomme ?
Quand on réduit la fenêtre les images se bousculent.

Une bande de gazon serait suffisant.

Concernant le code je vais y jeter un coup d'oeil plus méticuleux.

Tu peux utiliser plus d'éléments HTML5 comme la balise aside par exemple au lieu du DIV haut-droit.

Est-il utile de créer une section pour placer une image à côté de la balise nav alors qu'elle (l'image) pourrait être placée en background (de nav).

Mais la balise aside n'est pas faite pour être utilisée avec une balise article?

Pas obligatoirement elle peut être relative à un article ou une page.

http://www.w3.org/TR/html-markup/aside.html

En y regardant de plus près ton élément n'a pas trop d'intérêt à être dans un aside.

Par contre les padding de cet élément sont excessifs (surtout le left).

Pour l'élément haut_droit je verrais cela :

Code:

---

1 2 3 4 5 6

haut_droit { width: 600px; float: right; margin-right: 100px; margin-top: 68px; }

---

Edit : ça évite de placer un hack pour chrome.

Edit 2 : les 3 H1 dans le footer, c'est normal ?
Le paragraphe "Heathly apples" n'est pas aligné avec les 2 autres de gauche.
Certaines images n'ont pas de dimensions.

les h1 c'est bien pour les titres?
si c'est bon, c'est pour ça que je les ai mis...

Disons que les H1 existent pour structurer une page et mettre en évidence des mots clefs afin de leur donner une valeur sémantique à des fins de référencement.

HTML 5 permet et encourage de créer plusieurs H1 par page avec comme usage de placer un H1 par SECTION, HEADER, NAV, FOOTER.

Dans ton cas les 3 H1 de ton footer ne correspondent pas à une structure logique.