Envoyer un mail à l’auteur
xavier at ultra-fluide.com

Ressources

L'attribut target et les standards W3C.

Fonction de l'attribut target

L'attribut target a été introduit en HTML 4. C'est un attribut de l'élément a (hyperlien) permettant de désigner le cadre dans lequel la ressource spécifiée par l'hyperlien doit s'ouvrir. Il est possible de désigner le cadre cible par son nom, ou par l'un des quatre termes réservés: _blank, _self, _parent, _top.

Il semble que les cadres soient de moins en moins utilisés. Mais l'attribut target reste prisé dans un cas spécifique, l'ouverture d'un contenu dans une nouvelle fenêtre du navigateur :

  <a href="http://un-site.com" target="_blank" >Le site</a>

Target avec la valeur réservée "_blank" a une vie propre indépendamment des cadres. Très utilisé dans ce cas particulier, cet attribut fait en même temps l'objet de critiques de la part de spécialistes des standards web. De fait, sitôt introduit en HTML 4, les cadres et l'attribut target sont supprimés de HTML 4.1 STRICT.

Faiblesses de l'attribut target

Son exclusion des versions STRICT des normes HTML 4.1 et suivantes laisse supposer quelques faiblesses. Sur le plan technique (développement d'une page web), l'attribut target contribue au mélange du code relatif à la présentation de la page et du code qui en définit le contenu. Or, à l'évidence, un développement qui sépare clairement présentation et contenu constitue une bien meilleure architecture. Par ailleurs certains griefs relevant de l'expérience utilisateur apparaissent souvent à l'encontre de cet attribut :

De l'autre coté les raisons ou circonstances justifiant l'ouverture d'un lien dans une nouvelle fenêtre ne manquent pas non plus :

Il me semble que le webmaster attentif et respectueux de ses visiteurs, et désireux en même temps d'ouvrir certains liens dans nouvelle fenêtre pourra appliquer quelques règles de bon sens pour adoucir ou annuler les inconvénients cités :

Etre standard en utilisant target

Evolution des standards

A bien analyser les standards du W3C, il parait évident que ce dernier ne renie pas la fonctionnalité "ouverture d'une nouvelle fenêtre". En revanche, l'implémentation actuelle de cette caractéristique lui pose problème. La fonctionnalité offerte par target est contraire à l'une des bonnes pratiques essentielle : séparation de la présentation et du contenu. Le W3C doit donc gérer cette "erreur" en attendant que les choses rentrent dans l'ordre à terme. Il ne souhaite pas en interdire l'usage sans bien sur l'encourager dans le cadre d'une architecture déficiente :

Souhaiter utiliser la fonctionnalité d'ouverture d'une nouvelle fenêtre n'est pas contrevenir à la vision qu'a le W3C des standards web. Mais le faire aujourd'hui ne peut se réaliser sans un compromis dans lequel chacun doit y mesurer avantages et inconvénients. En attendant la prééminence de CSS 3, l'alternative est la suivante :

Utiliser l'attribut target

La suite vous concerne si vous recherchez une bonne adhérence aux standards sans pour autant banir target=_blank (acceptation d'une légère entorse à la règle de séparation présentation-contenu).

Le premier réflexe consiste à utiliser le modèle TRANSITIONNAL. Cependant, s'y résigner laissera toujours une insatisfaction à qui s'intéresse aux standards. Le modèle TRANSITIONNAL n'est qu'un pont entre une technologie ancienne et une technologie plus aboutie. Il n'est donc pas un objectif souhaitable, ni une fin en soi. En outre de l'attribut target, le modèle TRANSITIONNAL accepte un nombre impressionnant d'éléments et attributs obsolètes que l'on souhaite certainement mettre à l'écart.

La deuxième option consiste (j'entends déjà hurler) à choisir un DOCTYPE STRICT tout en utilisant l'attribut target. C'est pragmatique mais pas tout à fait rigoureux. Gardons seulement à l'esprit que c'est une bonne approximation rendue nécessaire pour contourner une omission du W3C. Ceci étant, le coté désagréable ne se situe pas tant sur un plan technique que psychologique, car après avoir fait ce choix, reste à faire face aux constantes critiques des "rigides du standards" qui déclarerons : "En utilisant target vous codez en dépit du bons sens, choisissez donc le fourre-tout qui vous ressemble (TRANSITIONNAL)" ou encore "Vous essayez de vous cachez derrière l'affichage d'un standard rigoureux alors que vous ne l'êtes pas, cela ne trompe que vous".
Certes l'option n'est pas impeccable, mais je rétorquerais que le mieux est l'ennemie du bien, et qu'un document contenant target en DOCTYPE STRICT est tout de même infiniment plus proche du DOCTYPE STRICT théorique que du DOCTYPE TRANSITIONNAL. Et finalement l'anomalie ne se trouve-t-elle pas dans les standards ?

Je vois différentes raisons de vouloir afficher un modèle STRICT :

Si la deuxième option décrite au dessus ne vous séduit pas en dépit de son coté pratique, alors suivez la troisième voie.

Etre tout à fait standard sans le modèle TRANSITIONNAL

La solution préconisée par le W3C, lorsqu'on rejette le modèle TRANSITIONNAL tout en souhaitant utiliser target se résume ainsi : assembler la DTD du XHTML STRICT avec la DTD du module Target introduit dans le cadre de la modularisation XHTML (XHTML 1.1). Cela ne change pas grand chose à l'affaire sur le fond, mais tout de même, il devient possible de valider rigoureusement le document par rapport une DTD précise, très proche de la DTD XHTML STRICT. Voici la recette :

Créons simplement un fichier xhtml11-avec-target.dtd dont le contenu est le suivant :

<?xml version="1.0" encoding="utf-8"?>

<!--  Import des data types de base -->

<!ENTITY % xhtml-datatypes.module "INCLUDE"> 
  <![%xhtml-datatypes.module;[ 
    <!ENTITY % xhtml-datatypes.mod 
      PUBLIC "-//W3C//ENTITIES XHTML Datatypes 1.0//EN"
      "http://www.w3.org/TR/xhtml-modularization/DTD/
              xhtml-datatypes-1.mod"> 
%xhtml-datatypes.mod;]]>

<!-- Import des entités et des namespaces -->
    
<!ENTITY % xhtml-qname.module "INCLUDE"> 
  <![%xhtml-qname.module;[ 
    <!ENTITY % xhtml-qname.mod 
      PUBLIC "-//W3C//ENTITIES XHTML Qualified Names 1.0//EN"
      "http://www.w3.org/TR/xhtml-modularization/DTD/
              xhtml-qname-1.mod"> 
%xhtml-qname.mod;]]>

<!-- DTD XHTML 1.1 -->

<!ENTITY % xhtml11.dtd 
  PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
%xhtml11.dtd;

<!--   Module  Target -->

<!ENTITY % xhtml-target.module "INCLUDE">
  <![%xhtml-target.module;[ 
    <!ENTITY % xhtml-target.mod 
      PUBLIC "-//W3C//ELEMENTS XHTML Target Module//EN"
      "http://www.w3.org/TR/xhtml-modularization/DTD/
              xhtml-target-1.mod"> 
%xhtml-target.mod;]]>

Installons cette nouvelle DTD sur un serveur web par exemple dans un sous répertoire /DTD. Supposons que le domaine du site web en question soit www.mon-site.com, chaque page web faisant appel au DOCTYPE qui suit pourra alors utiliser target dans la plus grande conformité :

 <!DOCTYPE html PUBLIC "-//mon-site//DTD XHTML11-avec Target//EN"  
  "http://www.mon-site.com/DTD/xhtml11-avec-target.dtd"> 

Nous voici maintenant équipé pour la conformité totale et faire taire les critiques. N'oublions pas cependant que cet artifice ne rend pas target plus propre dans votre page web. Maintenant profitons d'avoir éliminé tout vice de validation pour aller un peu plus loin encore et amorcer un début de séparation présentation-contenu.

Introduire une séparation entre contenu et présentation avec l'attribut target

Target n'est donc pas destiné à définir une catégorie de liens, et c'est là son travers il n'a pas de valeur sémantique dans l'absolu. Cependant, dans le cas particulier ou l'on dispose d'une catégorie de liens se superposant à l'ensemble des liens ouvrant dans une nouvelle fenêtre (par opposition aux liens s'ouvrant dans la même fenêtre), l'utilisation de l'attribut class n'est pas nécessaire pour en contrôler les styles associés.

Les styles que l'on souhaite voir appliqués à cette catégorie peuvent être définis en CSS sur un sélecteur impliquant l'attribut target. Nous obtenons ainsi un premier niveau de séparation entre contenu et présentation. Voici un exemple ou les liens s'ouvrant dans une nouvelle fenêtre se distinguent des autres par la couleur et un soulignement :

<style type="text/css"> 
 a { 
 color: red;
 text-decoration:none
 }
 a[target=_blank] { 
 color: blue;
 text-decoration:underline
 }
</style>

Agence de communication Ultra-Fluide : 01 47 70 23 32 - contact at ultra-fluide.com - 44 rue Richer 75009 Paris.