Bonjour,
- Même chez moi (Ubuntu 8.04, FF 3.6, résolution 1280*1024, la page d'accueil ne passe pas très bien, voici une capture :
http://img.photobucket.com/albums/v381/ladykatt/site-maison-poupe01.png
- BTW, une intro, c'est dépassé ! Tu peux facilement remplacer ça par un script PHP redirige selon les préférences du navigateur. Je peux te donner le mien si tu veux.
- Ensuite, les frames, c'est très mauvais pour le référencement et l'accessibilité ! Ceux qui ne peuvent pas avoir un aperçu graphique du site (moteurs de recherche, non-voyants) n'ont pas une vision globale de la page et cela complique beaucoup la navigation, encore plus si les pages sont orphelines ! QuentinC, un non-voyant qui fait régulièrement du support ici l'a lui-même confirmé tout récemment que c'est toujours aussi difficile à naviguer !
De plus, dans le haut, le texte est coupé chez moi :
http://img.photobucket.com/albums/v381/ladykatt/site-maison-poupe02.png
Free.fr supporte PHP, donc autant utiliser les include() à la place, c'est beaucoup plus accessible ! Tu as des cours pour ça sur le site du zéro !
- Je ne vois AUCUNE famille de police définie... cela doit expliquer pourquoi le texte coupé (voire même une partie des problèmes sous IE) car dans ce cas, on se retrouve avec les polices par défaut définies sur notre navigateur... qui n'est pas pareil d'un OS à l'autre, voire d'un poste à l'autre !
Pour éviter ces problèmes de différences, il faut donc définir un agencement de polices, et surtout, bien ficeler son agencement.
À lire :
http://www.alsacreations.com/article/lire/631-quelles-polices-pour-un-site-web.html
- Les tableaux, c'est dépassé pour la mise en page ! Par rapport à une structure en divisions et en full-CSS, c'est bien plus dur à maintenir et c'est plus lourd à charger ! Même si ça tend à disparaître, il reste encore des internautes qui n'ont accès qu'à une petite connexion ou qui ne peuvent se permettre de se payer le haut débit... comme par exemple l'asso dont ma mère est récemment passée présidente du CA !
Tu as les tutos ici et sur le site du zéro pour apprendre à coder proprement, sans wysiwyg !
- Il n'y a pas réellement de charte graphique et les photos s'intègrent vraiment mal à l'ensemble ! De plus, sur la page d'accueil, la photo découpée a d'affreux pixels blancs sur les contours... en 2006, ça passait, mais pas en 2011 alors que même Microsoft veut accélérer la mort d'IE6 !
- La méta keywords ne sert plus à rien, sauf à Google pour la pub ciblée !
- La méta description a un guillemet double non encodé, ce qui cause une erreur ! Les guillemets doubles en tant que contenu DOIVENT TOUJOURS être écrits sous leurs entités HTML, soit
"
Car voici comment ça se présente chez moi :
<meta name="description" content="Venez découvrir l'exposition des maisons de poupée anciennes au Musée des Poupées et Nounours à Lézan, à côté d'Anduze, dans le Gard. " des="" maisons="" de="" poupã©e...de="" la="" princesse="" fifi="" brindacier="" du="" 19ã¨me="" siã¨cle="" ã="" nos="" jours="" visitez="" notre="" site="" web="" http://myoldbear.free.fr="" />
- Au sujet des métas suivants :
<meta content="U-M Suonpää" name="auteur" />
<meta name="Revisit-after" content="14 days" />
<meta name="robots" content="all,follow" />
Le premier est inutile (mythe total !), le deuxième... WTF ??? Pis le troisième est inutile si c'est aux valeurs par défaut !
À lire au sujet des métas :
http://www.alsacreations.com/article/lire/628-balises-meta.html
- Je vois aussi une méta Content-Type déclaré deux fois ! Une fois suffit !
- Aucune langue définie dans le document ! Un lecteur d'écran en anglais qui essaie de lire un document en français, ou l'inverse, c'est assez weird merci !
- Ces trucs qui traînent :
<strong></strong><strong></strong><strong></strong><strong></strong><strong></strong>
ou encore
<a href="http://www.flickr.com/photos/myoldbearfreefr/sets/72157620071422750/" target="_blank"> <span cleaned="font-family: Arial;"><strong><em></em></strong></span></a><span cleaned="font-family: Arial;"><a href="http://www.flickr.com/photos/myoldbearfreefr/sets/72157620071422750/" target="_blank"><strong><em>http://www.flickr.com/photos/myoldbearfreefr/sets/72157620071422750/</em></strong></a><strong><span cleaned="color: rgb(128, 128, 128);"><span cleaned="font-size: medium;"><span arial="" sans-serif="" color=""><span cleaned="font-size: small;"><br />
ou encore
<p style="font-weight: normal; text-align: left;"><br />
</p>
c'est très très mauvais signe !
- Je ne vois que des feuilles de style internes et du style en ligne, ainsi que des balises et propriétés de mise en forme (qui pourraient être remplacés par du CSS !). Externalise-moé tout ça, en aussi peu de fichiers .css possible, pour faciliter la maintenant et pour permettre la mise en cache du style par le navigateur !
- Le menu aurait dû être structuré en liste plutôt qu'en une série de paragraphes !
- Et finalement, je ne vois aucun titre de section ! La présence de ces titres, et surtout, une hiérarchie correctement construite est un gros plus pour l'accessibilité, non seulement pour les leceurs d'écran (qui recense les titres dans la page pour se constituer un plan), mais aussi pour ceux qui pour une raison ou un autre, doit désactiver le style (ex: problèmes de contraste, etc.) ou pour qui le style n'arrive pas à se charger.
Débranche le style (Affichage > Style de la page > Aucun style) et après, dis-moi si tu vois des titres au travers de la masse de texte.
Donc, en conclusion, j'ai l'impression de me retrouver dans un de ces sites typiques à la "90's" qui sont encore bien nombreux sur free.fr ! Des frames, des tableaux, des styles internes ou en-ligne, police par défaut, absence de vraie charte graphique, splashscreen (en gros, l'intro avant d'entrer), pleins de balises inutiles... le code est à revoir complètement !
Pour cela, je te conseille fortement de commencer par apprendre à coder sans wysiwyg à partir des cours du site du zéro, puis de compléter ça avec les tutoriels d'ici ! Puis remplacer ces frames pour les include() de PHP !
