Développement design

[Adr2ien]

Bonjour, je suis web-designer et je voudrais me mettre au developpement. Je connait déjà le Html + CSS. Mais y parait que je code mal.

Par exemple pour mettre un fond et un header je met ça dans le CSS :

Code : Tout sélectionner

body{
	background:url("fond.png") no-repeat top center;
}
#header{
	background:url("header.png") no-repeat;
	margin-top:50px;
	margin-left:100px;
}

Et aussi dans le HTML je met ça :

Code : Tout sélectionner

<div id="header"> <img src="header.png" alt="header"/> </div>

Je voudrais savoir ce qui va pas car je m'y connait pas trop.

Merci beaucoup d'avance (:

[Benoit]

Je vois surtout que tu mets deux fois l'image header.png, une première fois dans le HTML et une seconde fois en CSS.

À mon avis tu pourrais commencer par simplifier ton HTML en ceci :

Code : Tout sélectionner

<div id="header">Header</div>

(et adapter le code CSS en conséquence pour cacher le texte)

Ensuite il faudrait voir si un élément de type Hx ne serait pas plus approprié qu'un DIV, car il s'agit probablement d'un titre. Tu y gagnerais beaucoup en accessibilité et en indexation par les moteurs de recherche.

[calimo]

Salut et bienvenue sur Geckozone !

Dans ton code HTML, pourquoi rajouter "header.png" avec une balise <img> ? Cela veut dire que tu l'auras deux fois, une fois comme contenu (<img>) et une fois en fond (CSS background).

À toi de voir si cette image transmet du contenu ou non. Si elle transmet du contenu, tu devras probablement choisir un meilleur texte alternatif (alt, qui est censé représenter le contenu lorsque l'image ne peut être affichée). Typiquement, ta banière contient du texte qui doit figurer dans ce texte alternatif. Au passage, si c'est le titre de ta page, utilise une balise sémantique (<hx> avec x de 1 à 6 pour faire <h1>, <h2>, ...) plutôt qu'un <div> vide de sens

Bonne chance !

Edit : grillé par benoit

[Adr2ien]

Mais au début je mettais pas

Code : Tout sélectionner

<img src="image.png"/>

Mais juste la <div> mais sa n'affichais l'image que si il y a avait du texte.

[Asumbaa]

Salut,

Les images de fond s'affichent dans le fond de leur conteneur. Si le conteneur a une dimension nulle, ben tu vois pas l'image de fond.
Le plus souvent, si tu as une div ou tout autre balise qui ne sert qu'à afficher une image de fond, c'est qu'il y a un souci au niveau HTML