nizouille

Le mieux selon toi serait la balise strong donc (même si il n'y a plus alors de séparation effective entre contenu et forme ? )

Concernant le point 2., je suis entièrement d'accord Concernant le point 4., j'explique ma démarche peut-être. Ce que je voulais faire, c'est séparer au maximum contenu et forme. Or, mettre un <b> ou <strong> à l'intérieur du code ne va-t-il pas à l'encontre du xhtml (même si validé) ?

Oui, mais ce serait stupide de sacrifier le référencement (les 300 premiers mots du texte) au menu, sous prétexte d'accessibilité. C'est faux ! le menu est toujours à la même place sur toutes les pages. Bien sûr, il y a deux menus différents, mais ne doit-on se limiter qu'à un seul menu ? Y a des gens qui désactivent les couleurs ??? Quel intérêt ?

Re, La proposition peut paraître absurde, mais j'aimerais appliquer une sémantique plus conforme, y aurait-il quelqu'un qui pourrait m'y aider ? Surtout concernant ces span. N'hésitez pas à consulter d'autres pages également, j'ai l'impression que j'ai fait une assez mauvaise utilisation de div ... J'espère ne pas paraître timbré en vous proposant cela Bien sûr, je ferais tout, mais cil s'agit juste de m'indiquer précisément ce qui pose problème, et une possibilité pour le résoudre .. Bien à vous,

Merci pour vos commentaires. Je connaissais la plupart des sites qui ont été mis en lien, mais les relire rafraîchit toujours un peu la mémoire Je suis paré à travailler la sémantique de mon site, c'est partiiii. Je ne vois pas trop comment travailler sur ces spans apparemment mal utilisées. Je me suis peut-être mal renseigné, mais c'était dans ma tête la seule possibilité. Par ailleurs je ne vois pas de quoi tu parles Denis, en disant " 2. span utilisés comme des éléments de block alors que le div sert justement à cela ; 4. span utilisés uniquement pour passer des class CSS alors qu'il y a déjà des éléments HTML qui peuvent les accueillir." Ensuite, je n'ai pas bien compris la discussion qui avait trait à mon menu déroulant. Il est bien fait mais mal finalement ?

Merci pour ces réponses ... Je me suis en effet attelé à créer un site xhtml + css. Merci pour vos critiques positives. Soucieux d'améliorer constamment mon site, je voudrais quelques précisions sur certains points : - Quelqu'un pourrait vérifier les propos de Benjiim ci-dessus ? - Je sais n'avoir mis aucun accesskey, est-ce grave ? - l'attribut title est validé je crois par le w3c. Est-il pris en compte pour le référencement ? - Denis, je vais m'atteler à faire ce que tu me dis. Je me suis attaché à séparer un maximum contenu et mise en forme, mais je sais qu'il reste encore quelques style: dans le code, mais c'est une question de jours et ce sera réglé. Entends-tu autre chose par sémantisation du code ? Pourrais-tu me donner un exemple ? - Ernestine : comment faire pour ne pas imbriquer plusieurs div, rien que mon cadre arrondi (je précise : avec un effet ombré) nécessite ces div. Y vois-tu une alternative ? En quoi est-ce gênant ? Quelles balises meta sont réellement inutiles (j'entends pour tout le monde, pas seulement pour Google) ? En quoi est-ce que ça "améliore la lisibilité" ? Merci pour vos commentaires

Hello, Quelqu'un d'expert en accessibilité pourrait-il vérifier l'accessibilité de ce site internet sur les ressources pédagogiques pour l'enseignement Accessoirement, je veux bien apprendre quelques conseils ..

g résolu le prb de la scrollbar sous Mo ... il suffisait de mettre une height de 1.3 em ... bizarrement .. Pour IE et l'espace blanc, j'ai toujours pas trouvé .. Des amateurs ?

OK, mais peux-tu me guider "online" pcq g toujours utilisé ça depuis mes débuts .. et je dois rendre le prjet dans quelques jours ... Ce serait vraiment sympa de ta part ... Peut-être aussi n'ai-je pas fait les bons correctifs ?? Merci

J'ai essayé ce que tu m'as proposé mais ça ne fonctionne pas ... Qu'ai-je fait d'incorrect ?? Je ne comprends pas ..

beuh j'avais essayé l'article de pompage, mais ça ne fonctionnait pas ... Etait-ce à nouveau à cause du positionnement absolu ?? Et la scrollbar sous Mo vient-elle de là également ? Merci de ta réponse .. Nizouille

Hello, J'ai deux problèmes : J'ai une scrollbar verticale sous Mozilla, et sous IE j'ai un grand espace transparent alors que le width est à 100 % Et voici ce que ça donne .. J'ai consulté le forum pour trouver une réponse à ces deux (petits mais ennuyeux graphiquement) soucis ... mais ce que j'ai essayé n'a pas fonctionné ... Il doit y avoir une incompatibilité quelque part dans mon code mais je ne vois pas où ... Voici mon code :nono: /***** menu CSS *****/ html, body, #holder { min-height: 100%; height: 100%;} html>body, html>body #holder { height: auto;} body { margin: 0; padding:0; } #holder { position: absolute; top: 0; left: 0;} #content {margin-left: 160px; margin-top: 134px; height: auto; margin-bottom: 10px; background-color:#FFF} .haut { /* bloc haut : hauteur définie et image de fond */ height: 46px; background-image: url(images/cadre/haut.gif); } .hautd { /* bloc haut droit: tailles, image de fond et alignement */ height: 46px; width: 80px; background-image: url(images/cadre/hautd.gif); float: right; } .bas { /* bloc bas : hauteur définie et image de fond */ height: 68px; background-image: url(images/cadre/bas.gif); font-size: 0; } .basd { /* bloc bas droit: tailles, image de fond et alignement */ height: 68px; width: 80px; background-image: url(images/cadre/basd.gif); float: right; font-size: 0; } .centre { /* bloc centre : bord gauche qui ne se répète qu'en hauteur */ background-image: url(images/cadre/gauche.gif); background-repeat: repeat-y; } .contenu { /* bloc contenu : bord droit qui ne se répète qu'en hauteur */ font-size: 0.9em; text-align:justify; background-image: url(images/cadre/droite.gif); background-repeat: repeat-y; background-position: right; padding: 5px 55px 1px 30px; /* marges internes pour que le texte ne colle pas aux bords */ } #footer {clear: both; height: 1.1em; position: absolute; bottom: 0; left: 0; background:#006699; text-align:right; color: #F2E7DB; border: none; width: 100%;} _AT_media print { /*A l'impression on cache le menu, marche au moins pour IE, Moz et Opéra.*/ .menu, .ssmenu { visibility:hidden; } } .ssmenu { background-color:#B6C5D6; color:black; font-size:12px; font-weight:bold; padding:1px; /* following is not valid CSS */ filter:alpha(opacity=75); -moz-opacity:0.75; opacity: 0.75; /* width et margin sont au cas où le javascript est désactivé. */ width:15em; margin:1em; } /* .menu = les cases toujours visibles (comme Fichier, Edition... dans un logiciel) */ .menu { text-align:left; } .menu span, .ssmenu span { /* Ne pas toucher C'est pour cacher les; en fin de <li>, ce qui permet aux synthèse vocales de prendre une pause dans l'élocution */ display:none; } .ssmenu ul, .ssmenu li { /* Ne pas trop toucher. Les items (les <li>) des sous-menus, notamment pour enlever les puces des liste */ padding:0; margin:0; list-style-type:none; } /* Les liens qui ne sont pas sous le curseur. */ .ssmenu a, .ssmenu a:visited { font-family: sans-serif, Verdana, Arial; text-decoration:none; color:black; padding:2px 1px; /* Ne pas modifier le block */ display:block; /* Un width:100% fait planter Mozilla, sans le width:100% c'est IE et Opera... La combinaison aucun width et height:100% marche sur tous, donc ne pas toucher ces 2 lignes */ /* height:100%; margin:0px;*/ margin:0px; width:100%; } .menu a, .menu a:visited { display: block; line-height: 26px; text-align: left; font-size: 0.9em; font-weight: bold; height: 100%; width: 136px; color: #006699; text-decoration: none; background: url(images/bouton.gif) no-repeat 0 0; background-position: 20px 0px; } html>body .menu a, .ssmenu a, .menu a:visited, .ssmenu a:visited { width:136px; } .ssmenu ul:hover, .ssmenu a:hover, .ssmenu a:focus{ /* Les liens sous le curseur. On change les couleurs du texte et de fond, et on enlève le soulignement. */ background-color:#859FBB; color: #FECB33; text-decoration:none; } .menu a:hover, .menu a:focus { background: url(images/bouton.gif) no-repeat 20px -26px; color: #006699; } a { color: #FECB33; text-decoration: none; } a:hover { color: #F2E7DB; } ul, li { margin: 0; padding: 0; font-weight: bold; list-style-type: none; } /* les 3 boutons du header*/ .bt1 { position: absolute; top: 20px; left: 480px; } .bt2 { position: absolute; top: 40px; left: 450px; } .bt3 { position: absolute; top: 60px; left: 425px; } body, html { margin: 0; padding: 0; background: #F2E7DB; font-family: verdana, sans-serif; font-size: 0.9em; } #header { position : absolute; left: 0px; right: 0px; height: 115px; width: 100%; border: none; background: url(images/fond-header.gif) repeat-x 0 0; } #plan { position: absolute; right: 0px; top: 0px; color: #F2E7DB; } #plan a { margin: 0; padding: 0; color: #F2E7DB; text-decoration: none; } #plan a:hover { color: #FECB33; } /*cadre arrondi */ #background { position: absolute; left: 25px; top: 149px; height: 339px; width: 138px; background: url(images/cadretitre/cadre.gif) no-repeat; } .identification{ font-weight: bold; font-size: 1.0em; text-align: center; margin-top: 200px; margin-left : 5px; color: #006699; } /*formulaire*/ form { width: 80%; font-family: Verdana, Arial, sans-serif; font-size: 1.1em; margin-left: 10%; } form fieldset { border: 1px dashed #79C; padding: 10px; background-color: #FFF;} form legend { background-color: white; padding: 1px 4px; color: #B6C5D6; font-weight:bold;} form div { padding: 6px 8px; } form div.bloc label { display: block; float: left; width: 30%; } form div.center { text-align: center; } p.message { text-align: center; } label { font-family: Verdana, Arial, sans-serif; font-weight:bold } input { background-color: #DEE6EE; color:#000; font-size:12px; } select, option { background-color: #DEE6EE; } textarea { border:1px solid black; font-size: 1.1em; } input.bouton { border:2px outset #DEE6EE; font-weight:bold; cursor:pointer; } input.bouton:hover { background-color:white; color: #000; } /*fin du formulaire */ /* différentes mises en forme de texte*/ span.gras { font-weight : bold; } span.gch { display: block; float: left; text-align: left; } span.dte { display: block; float: right; text-align: right; } .liens { color: #006699; font-weight : bold; background: none; } .liens:hover { color: #FECB33; background: none; } /* titres */ h1, h2, h3 { padding-left: 2em; } h2 { margin-left: 1em; background: url(images/puce.gif) 0px 50% no-repeat; } h3 { margin-left: 2em; background: url(images/puce2.gif) 0px 50% no-repeat; } p { text-indent: 2em; } .titre { /* placement de l'image titre */ margin-left: 30px; margin-top: 20px; } Le voici Je comprends pas cet espace sous IE ... (ni la scrollbar sous Mo vu que j'ai appliqué le hack pour la supprimer) ... Merci beaucoup ... J'ai pas encore eu le temps d'installer d'autres navigateurs, donc si vous reportez d'autres problèmes, faites le moi savoir .. Nizouille