5568 sujets

Sémantique web et HTML

Salut a tous,
alors j'ai decouvert le site de elmostiko, et notament son tutoriel pour faire une page XHTML/CSS.
Je m'en suis servi pour commencer ceci:

http://julien.anquetil.free.fr/jordan/

Mais le probleme, c'est que l'image de mon header est assez lourde (75Ko), bon je l'ai pas super optimisé non plus, mais je voudrias la decouper pour qu'elle soit moins lourde a charger.
Comment rester dans les normes avec le decoupage?
Autre question, pour le menu, on est limité a 5 liens sur la 1e ligne du menu alors qu'a mon avis il y a la place d'en mettre un 6e.
Comment faire?

Merci beaucoup,
Mitchum, qui debute avec les CSS....
Bien sûr tu peux mettre plus de menu, mais il faudrat penser à diminuer les marges pour que ca rentre ;p Tu n'as qu'a changer le fichier html, et ajouter autant de <li><a ...>itemN</a></li> que de menu, mais l'espace pour ce type de menu est restreint. Il faut ensuite diminuer les tailles de polices et de marge en pensant a conserver un texte lisible.

Par contre pour les tutos sur le site du blog... ils sont un peu pourri, je suis en pleine refonte des tutos et c'est très long, d'autant que j'en rajoute... Par exemple, ici le code n'est pas du tout optimisé... je vais tout de même devoir le faire je pense...

Il y a trop d'elements (div) inutiles.
AHhh oui j'oubliais, pour les tutos, c'est pas obligatoire de garder exactement la même chose Smiley biggrin je remarque souvent ça quand je vois une adaptation de ce tuto, c'etait juste une petit mise en page comme ca... enfin si ca te plait tu peux garder, c'etait juste pour dire que c'etait pas une obligation !

Pour ce qui est de découper l'image, en fait, il vaut mieux garder ton image entiere, optimise la un peu, et c'est pas bien grave qu'elle mette du temps à charger, c'est pas un élément important. Disons qu'il faudrait arriver sous les 30Ko.
Si tu découpes ton header, tu diviseras la taille du fichier en plusieurs parties ... mais , additionnées, ca reviendra au même Smiley hum ! Donc, je te conseille plutot de jouer sur l'optimisation de ton image ! D'autant plus que si tu fais plusieurs images, cela fera plusieurs requêtes FTP, et ce sera certainement plus lent !

Pour ajouter un lien, il faut que tu réduises un chouia la taille des autres , ici :

DIV#menu UL LI A {
BORDER-RIGHT: #8BB0FE 2px solid; 
DISPLAY: block; 
FONT-WEIGHT: bold; FONT-SIZE: 1.2em; 
WIDTH: [b]120px; [/b]
COLOR: #fff; 
LINE-HEIGHT: 25px; 
LETTER-SPACING: 2px; 
TEXT-DECORATION: none
}


Et ensuite, rajouter un

<LI><A href="http://www.lemotocross.com">Lien n°6</A> </LI>


Après le numéro 5 ;) !
Attention, faut pas mettre les balises en majuscule si tu fais du xhtml comme sur mon exemple.

Pour les css, je dirais pareil, même si c'est pas obligatoire je crois. Mais un code en minuscule est plus lisible de toute facon ;)

Pour gagner de la place aussi, tu peux diminuer le letter-spacing (voire même l'annuler).

Ppfffiiiou vivement que je puisse refaire les tutos et des explications plus détaillées...
Modifié le 24 Oct 2004 - 19:37
salut,
ca y'est, j'ai reussi a en mettre 6 :)
quel *****, j'ai meme pas fait gaffe a reduire la largeur des autres pour caller le 6e...

Sinon, pour le header en plusieures images, aurait tu une idée?
et quand tu dit qu'il n'est pas optimisé, ca veux dire qu'il ne sera pas valide a 100%?
Merci
oula, le temps que je reponde, il y a deja eu d'autres reponses...
donc ok, je vias bosser sur l'optimisation de l'image.
par contre j'ai pas compris pourquoi il ne faut pas mettre les balises en majuscules? car sur ton tuto elles y étaient il me semblent, non?
Merci
Oullaa non, elles n'étaient pas en majuscule les balises ;) Peut être du coté de ton éditeur de page qui met tout ca en majuscule ?

Si tu met ca en majuscule, ca ne sera plus validable selon la norme xhtml1.0 strict, c'est pas la mort tu me diras, mais quitte à faire les choses bien hein ! Et comme je le disais, c'est de toute facon beaucoup plus lisible en minuscule.
Ok, merci de l'info.
Car c'est ma premiere page 100% valide, donc je ne connais pas encore bien toutes les petites specificité...
@+
en effet, il a l'air sympa, et les conseils sont tres utiles (de meme que les tutoriaux...)

HS: j'ai lu que tu etait a coté de caen, en non degroupé, moi je suis sur mondeville, et comme toi, il y a que la moitié de mondeville de degroupé :( , je comprend ta douleur...
Wé je suis à coté de Venoix moi, à Bretteville sur Odon, 4.2 Km du noeud, la 2eme moitié de Bretteville est dégroupé !
Bienvenue au club des laissés pour compte ;)
On fait un peu du Hors sujet là ! Mais le problème semble résolu, alors on peut continuer (un peu, et on arrete ;), si tu veux continuer, MP).

Free m'a clairement dit qu'il ne fallait pas trop compter sur un dégroupage chez moi... s'ils en arrivent à dire ça clairement c'est que ca doit etre vrai... Smiley bawling
Beeeeeen, c'est comme proposé du 2048kb/s à tout le monde, me laisser faire ma demande , me dire que ce sera effectif sous 15 jours, et c, et me dire au bout d'un mois d'attente et d'espoir que ma ligne est pas compatible :s Smiley bawling Smiley fache
Kevin a écrit :

Si tu découpes ton header, tu diviseras la taille du fichier en plusieurs parties ... mais , additionnées, ca reviendra au même Smiley hum ! Donc, je te conseille plutot de jouer sur l'optimisation de ton image ! D'autant plus que si tu fais plusieurs images, cela fera plusieurs requêtes FTP, et ce sera certainement plus lent !


En fait, oui et non. Il y aura des bits de données en plus à échanger au niveau des headers, mais normallement, la création de plusieurs connexions concourantes permet d'augmenter ( plus ou moins fictivement ) la bande passante disponible entre le client et le serveur... C'est plus ou moins mathématique, en admettant que le serveur soit le phénomène limitant de la transaction, et qu'il divise également sa bande passante entre toutes les connexions, c'est mieux d'avoir deux parts qu'une seule en générale ( disons, quand il commence à y avoir plusieurs connexions ).

Une impression "fictive" de vitesse se rajoute de plus du au fait qu'on a des trucs completement chargé en même temps que d'autre continuent de se charger.

Cela dit, j'pense pas que découper l'image soit réellement interessant, parce que c'est d'une part beaucoup plus embettant à maintenir, et d'autre part le gain de performance reste tout relatif...