[pierredureau]

Quelques trucs tirés par les cheveux :

1. <div id="milieu">, je mettrai un identifiant avec plus de sens.
2. <p>J'ai créé cette page pour 3 raisons: <br /> ... et la suite...
Il y a beaucoup trop de <br />, une liste non ordonnée ne conviendrai pas mieux ?
3. J'ai pas testé avec IE (Linux oblige) mais enlever l'en-tête XML rendra le DTD switch actif.
4. Caprice : BTS pourrait faire l'objet d'un <acronym>
5. Dans ta partie validation, met des titles aux <a>.
6. L'attribut style, c'est bof bof.
7. Détail qui tue : en CSS, 0pt s'écrit tout simplement 0.
8. <h1><span>BZHcool.com</span></h1>, je ne comprend pas la redondance.
9. <h2></h2>, mystère... à moins que ça soit pour ne pas sauter un niveau.

Je n'ai plus de cheveux, j''ai du y aller un peu fort là ;-)

[LaurentDenis]

Ah... Me voilà encore à jouer les rabat-joie :

Très joli, le passage au XHTML1.1.
Mais maintenant, il n'y a plus qu'à... remettre ça avec le bon vieux DocType XHTML1.0

(Autrement dit, juste changer le doctype en gardant l'excellent code de Denis)

En effet, à la différence du XHTML1.0, le XHTML1.1:
- ne doit pas être servi comme étant du HTML (avec le type Mime text/html)
- doit être servi comme étant du XML ( avec le type mime application/xml + xhtml). Voir http://www.w3.org/TR...ml-media-types/ (attention à la différence entre "may" et "should" qui ont chacun un sens bien précis dans les spécifications du W3C)

Pour ceux qui se posent la question, disons que le type mime est une information envoyée par le serveur qui indique au navigateur ce qu'il va recevoir :
- du HTML,
- du XML,
- une image GIF, PNG...
- de la soupe,
- des brocolis
- ou une claque.

Actuellement, la page est servie incorrectement en text/html, autrement dit, c'est de la soupe. Coup de bol, les navigateurs s'en accommodent et font comme si c'était du HTML.

Passer en application/xml + xhtml ne serait pas une bonne solution, car :
- ce type mime n'est pas supporté (entre autres) par Internet Explorer (Win et Mac). Le document se transforme alors en brocolis à télécharger.
- le document étant interprété par les navigateurs Gecko et par Opera comme étant du xml, il ne doit comporter aucune erreur de syntaxe sinon... c'est la claque ! Le moteur de rendu du navigateur s'arrête sur l'erreur, affiche un message d'alerte et la suite du code XHTML. On peut être un peu masochiste et apprécier ce mode de validation radical (c'est mon cas et celui de Denis aussi, il me semble), mais il faut être sûr de bien maîtriser sa syntaxe ! ce serait encore jouable ici, mais ce serait très dangereux par exemple dans un weblog où les commentaires et trackbacks risquent d'amener du code invalide : Denis témoignera (avec accablement) que j'ai souvent (et involontairement) dézingué son CyberCodeur juste avec la petite esperluette du Blog & Blues de ma signature dans un trackback...

Déclarer correctement du XHTML1.1 est donc plutôt contraignant:
- Il faut faire de la négociation de contenu au niveau serveur pour n'envoyer du XHTML1.1 en application/xml+xhtml qu'aux navigateurs qui déclarent le supporter, et du XHTML1.0 en text/html aux autres.
- pas de droit à l'erreur

Et ces contraintes n'apportent... aucun avantage concret ici. En effet, XHTML1.1 sert principalement à intégrer un élément supplémentaire (le module ruby) qui n'est pas utilisé dans cette page (où il ne servirait à rien d'ailleurs).

voilà, voilà... Bon, j'avoue : on l'a tous fait, de s'offrir brièvement le frisson d'une page en XHTML1.1

Sinon, pour l'accessibilité : il y a deux liens adjacents dans la page à cause des stikers de validation qui ne sont séparés par aucun caractère affichable.

[edit]: du danger des forums pour les blogueurs : on finit par faire des posts en guise de message au lieu de bloguer ça chez soi

Ce message a été modifié par LaurentDenis - 11 juin 2004 - 04:11.

[LaurentDenis]

pierredureau, le vendredi 11 juin 2004, 01:01, dit :

3. J'ai pas testé avec IE (Linux oblige) mais enlever l'en-tête XML rendra le DTD switch actif.

Autre contrainte du XHTML1.1 justement : la page n'étant pas en UTF-8 ou en UTF-16, mais en iso-8859-1, le prologue xml est nécessaire pour spécifier l'encodage.

[Denis]

Laurent : Rabat-joie...

Moi je persiste à demeurer en XHTML 1.1, juste pour vous embêter tous autant que vous êtes.

[LaurentDenis]

On déborde un peu là, mais rapidement : j'ai toujours supposé que tu servais du XHTML1.0 à IE. je vois que ce n'est pas le cas. Argh !!!

Shame on you !

Tu seras damné pour l'éternité...

(Sauf si Bleizig modifie ta négociation de contenu pour servir du XHTML1.0 à Internet Explorer. Il te règlera bien ça en deux coups de cuillères à pot, non ? )

[BZHcool]

Houlà!!! Je ne voudrais pas déclarer une guerre de Xhtml entre vous...

Donc dans mon cas si j'ai bien compris LaurentDenis pour ne pas prendre une claque si je ne mange pas ma soupe de brocoli... il faudrait que je change le doctype de mon document...

Au passage peux tu me le donner...

Mais si je suis le code de Denis en Xhtml 1.1 je risque quoi principalement avec cette page... au niveau des navigateurs...

Sinon pour le soulignement des liens c'était bien çà Ultrajoe!

Je viens de comparer ma version valide HTML et celle (aidé par Denis) valide xhtml... effectivement il n'y avait pas grand chose à faire le tout c'était de savoir qu'il fallait le faire... C'est OK maintenant! Par contre, pour exemple :

<meta name="robots" content="follow,index" />

On est toujours obligé de laisser un espace à la fin entre " et />?

[LaurentDenis]

C'est tellement évident que j'en oubliais de le signaler : Pour les changements à apporter en passant du HTML au XHTML, voir Passer du HTML au XHTML

Le Doctype XHTML1.0 strict :

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">

Voir List of valid DTDs you can use in your document sur le site du W3C pour toutes les DTD disponibles.

L'espace dans les metas est nécessaire en effet, pour certains vieux navigateurs qui auraient du mal à comprendre le />

Enfin, comme dit plus haut, les navigateurs sont gentils pour l'instant et acceptent de traiter du XHTML1.1 comme si c'était du HTML quand le doctype est incorrect. Mais rien ne dit que ça durera

[Bobe]

Denis, le vendredi 11 juin 2004, 05:20, dit :

Moi je persiste à demeurer en XHTML 1.1, juste pour vous embêter tous autant que vous êtes.

Rhaa

Tu pourrais au moins mettre un doctype xhtml 1.0 quand tu envoies en text/html..

[Monique]

Bonjour,

Je reviens sur deux points soulevés par Pierre.

Pourquoi un span dans le h1 puisqu'il concerne la totalité du texte ?
Pourquoi ce h2 vide, avec une image en background qui n'est pas visible ?

J'ai fait un essai avec IE...
c'est lisible mais tout le texte est centré

[BZHcool]

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
  <head>
    <title>Votre titre</title>
    <meta http-equiv="Content-Type" content="text/HTML; charset=iso-8859-1" />
  </head>

Donc si je mets ceci j'ai tout bon selon ton site Laurent...

Pour monique... l'image en H2 invisible c'est pour l'instand j'ai en tête de mettre en Background un drapeau breton qui flotte au vent ... mais vaut que je fasses quelques photos avant... histoire de ne pas copier ce drapeau ailleurs

Citation

c'est lisible mais tout le texte est centré

Que veux tu dire par là... effectivement ma page est centrée... mais de là à faire je ne comprends pas... t'as une copie d'écran sous la main...

[Denis]

Cette déviation me fait soudainement rapeller qu'un site n'est jamais parfait et n'est jamais terminé.

En fait, j'hésite encore à conserver mon XHTML 1.1 - il est possible qu'au cours de ma prochaine refonte, je retombe en XHTML 1.0 strict. Tous vos commentaires vont dans le sens de cette réflexion, mais comme d'ahbitude, c'est le temps qui manque pour organiser tout ça. J'ai bon espoir qu'un jour, j'aurai du temps de qualité à accorder à cybercodeur.net ! D'ici là, vous aurez à vivre avec l'imperfection.

Mais effectivement, BZHcool, si tu prends cette structure, tu auras un site en XHTML 1.0 strict et non plus en XHTML 1.1. Par contre, pour ce qui est de faire une négoce de type mime en fonction du browser (text/html ou applicationhtml+xml), ça te prendrait un peu de programmation. Je te propose une version en PHP, offerte il y a longtemps par Anubis et Darken (deux illustres membres de ce forums ) et que j'utilise depuis sur mon site :

<?php
// Indique un Mime type correct si le client accepte le vrai xhtml
	if( stristr($HTTP_SERVER_VARS["HTTP_ACCEPT"], "application/xhtml+xml") ) 
	{
  header("Content-type: application/xhtml+xml");
  echo "<?xml version='1.0' encoding='iso-8859-1'?>\n";
	}
	else 
	{
  header("Content-type: text/html; charset=iso-8859-1");
	}
?>

Bon évidemment, faudrait passer le bon doctype en fonction du browser aussi, mais là...

[Nudrema]

Denis, le vendredi 11 juin 2004, 15:27, dit :

Bon évidemment, faudrait passer le bon doctype en fonction du browser aussi, mais là...

Bah, si c'est du XHTML 1.0 Strict, tu peux l'envoyer à tout le monde, c'est bon...

[BZHcool]

Merci Denis pour ce bout de code mais je vais être au regret de ne pas en tenir compte pour le moment... en effet pour ce domaine qui ne devrait pas faire changer la face du monde je n'ai pris que le minimun proposé chez OVH... Histoire de loger 1 ou 2 pages sur ce BZHcool... et donc j'ai légérement sacrifié l'option PHP pour profité du meilleur prix!!!

Sinon c'est fait je viens de passer en XHTML 1.0 !

[Monique]

BZHcool, le vendredi 11 juin 2004, 14:45, dit :

Que veux tu dire par là... effectivement ma page est centrée... mais de là à faire je ne comprends pas... t'as une copie d'écran sous la main...

En voilà une... tu comprendras le

Pour le span dans le h1... j'insiste, je ne comprends pas son utilité

PS : je n'ai pas résisté à l'occasion de vous montrer ce qui me fait toujours rire quand j'ouvre IE... regardez le logo devant test-jaws.html dans la barre des liens

Miniature(s) jointe(s)

• 

[MissMonde]

J'avais le même problème que Monique (IE6), mais je ne l'ai pas compris tout de suite, j'ai réalisé hier soir que je ne voyais pas la même chose que vous tous, en lisant les réponses à cette page.

Du coup, je lui ai refait ce matin sa page en XHTML 1.0 strict.

merci de me dire comment elle passe chez vous.

il me reste un problème non résolu (il y en a toujours un), c'est l'image bitmap de validation html, qui a une petite bordure sur le côté droit.

si quelqu'un a une idée.

[LaurentDenis]

MissMonde, le vendredi 11 juin 2004, 19:01, dit :

Du coup, je lui ai refait ce matin sa page en XHTML 1.0 strict.

elle est là :BZHcool

merci de me dire comment elle passe chez vous.

Très bien, sauf pour le

<h1>BZHcool.com</h1>

suivi d'un

<h3>QUI SUIS-JE? </h3>

Il manque un petit <h2> quelque-part, non ?

Outre la logique structurelle, c'est important pour l'accessibilité (navigation dans le contenu via la hiérarchie des titres)

Allez-y... Je les démolirai toutes !
(Je sors, c'est ça ?)

[MissMonde]

oui, oui, je sais bien, mais au vu de la page sans feuille de style, ça me paraissait bien comme dimensions de titres.

mais bon, et puis zut ! j'ai passé ma matinée là-dessus avec un code sortant de dreamweaver, je ne le connais pas celui-là, mais il met des majuscules partout, les guillemets nulle part, les point virgules on n'en parle pas, l'horreur.

alors, bon, on veut aider et puis voilà. je n'ai pas l'habitude des smileys, mais leur tête correspond à peu près à ce que je veux dire.

[Dinostrate]

LaurentDenis, le vendredi 11 juin 2004, 20:08, dit :

Il manque un petit <h2> quelque-part, non ?

C'est à ce stade que mon âme de contestataire s'insurge....
Vrai de vrai qu'il faudrait théoriquement des h2 si on place des h3

.... mais moi qui suis un adepte du h ..... jusques aux six..... je me dis, ce n'est pas normal.....

Les h + les css permettent une présentation aussi harmonieuse que possible (enfin, harmonieuse, selon le réalisateur)

Alors, faut pas m'e...... mmmmm... bêter avec ces conventions trop rigides....

Bref, je ne suis pas d'accord du tout sur ce point, et je revendique le droit de placer un h6, même si je n'ai placé qu'un h1.....
.... non mais.....

<edit> pourquoi vouloir être aussi puriste ? à quoi ça sert ? </edit>

Dino

[MissMonde]

merc Dino

[LaurentDenis]

Bon, sérieusement cette fois, ne confondons pas purisme et rigueur.

Le purisme, c'est dire que:
- le portait de BZHcool n'a rien à faire dans la <div id="navigation">
- que l'élément de liste unique de cette div pour l'adresse mail est injustifié
- que la liste de définition de la partie Pourquoi cette page? est inacceptable, vu qu'aucun <dt> n'est défini par un <dd> (Pas si puriste que ça, ce dernier point, d'ailleurs)...
- etc.

La rigueur, c'est de relever une erreur qui a des conséquences très concrètes pour un certain nombre d'utilisateurs du site : une mauvaise hiérarchie des titres:
- peut faire échouer des traitements de la source XHTML visant à en extraire les titres pour former un résumé, une table des matières...
- fait échouer un procédé d'accessibilité : la navigation dans une page par les titres dans Jaws. Voir Jaws, label, titres, liens et CSS en général (Yoan Simonian me corrigera je l'espère si je me trompe).

[edit: j'en rajoute une couche]

Citation

9.2 : La page web est-elle structurée de manière cohérente ?

Commentaire :
L’utilisation des styles proposés par le HTML du type H1, H2… permet de structurer la page. Ces balises sont très importantes pour structurer une page Web : la balise H1 pour le titre principal H2 pour les sous-menus, ... H6. Ces balises doivent être utilisées pour leur fonction première, la structuration, et non pour leur dimension graphique. De plus, les blocs d'informations doivent être distincts les uns des autres.

Source : Le plus récent référentiel d'accessibilité concret à ma connaissance (celui d'AccessiWeb)
[/edit]

Outre le fait que c'est à peu près aussi logique que :

Citation

Mon grand 1 : de quoi je cause
Et tout de suite mon petit z, juste de ça

Tout ça pour que ce soit plus joli avec des h3 ?

Ce message a été modifié par LaurentDenis - 11 juin 2004 - 20:42.