Liens explicites

Publié le : 15 juin 2011 – Dernière modification le 21 décembre 2021 – par Gaël Chareyre, tetue – 69 commentaires

1
2
3
4
5
27 votes

Styles et pictos explicitant les liens du site : documents à télécharger, liens externes, mailto, etc. (avec ouverture possible en nouvelle fenêtre).

Les liens pointent souvent vers d’autres pages HTML mais aussi vers d’autres types de documents et services. Améliorez le confort de navigation de l’internaute en distinguant visuellement les différents types de liens : documents à télécharger, liens externes, mailto, etc.

Ce plugin a pour avantage de traiter tous les liens de façon homogène, en respect des bonnes pratiques, en particulier Opquast V2 Critère 120 : Les hyperliens de même nature ont des couleurs, des formes et des comportements identiques sur toutes les pages.

Note de version

Suite de « Liens sortants ouvrants », cette seconde version du plugin change de nom, car l’explicitation des liens devient sa vocation principale.

  • Cette version ajoute des styles et pictos [*] permettant de mieux distinguer les liens les uns des autres, exactement comme dans l’encyclopédie Wikipédia, ni plus, ni moins : pdf et autres doc, liens externes, mailto, etc.
  • Sans oublier les styles historiques de SPIP.
  • Affichage des hreflang [*].
  • Meilleure explicitation des liens à l’impression [*].
  • Correction des URLs des articles redirigés de SPIP, qui génèrent désormais l’URL cible (et non plus l’URL interne de l’article), ce qui permet de distinguer les liens externes.
  • L’ouverture en nouvelle fenêtre n’est plus systématique, mais optionnelle et paramétrable, étendable aux documents.

Apparence : styles et pictos

Exemple de rendu stylistique avec les pictos par défaut
(et la Base CSS 2 pour SPIP 2).

Pour prévisualiser, affichez la page de test « ?page=demo/links » sur votre site ou insérez le modèle « <charte|links> » dans un de vos articles. Pour toute personnalisation, complétez en CSS, dans votre feuille de style.

Ce plugin permet de distinguer les liens vers des documents générés par SPIP, notamment via le raccourci [->doc324] ou la balise #URL_DOCUMENT, grâce à un sélecteur CSS dédié : .spip_doc.

Tous les liens sont stylés par défaut, ce qui peut sembler radical. Saupoudrez des « padding-right: 0; background-image: none; » pour annuler le style appliqué là où vous ne le souhaitez pas.

Pour appliquer une autre feuille de style, avec d’autres pictos, copiez la feuille links.css dans le sous-répertoire /css, modifiez-là, et déposez vos pictos dans le sous-répertoire /css/img/links de votre dossier « squelettes ».

Ouverture en nouvelle fenêtre

Bien que cela mette certains utilisateurs et utilisatrices en sérieuse difficulté [1], forcer l’ouverture des liens dans une nouvelle fenêtre reste une demande impérieuse. Ce comportement est désormais optionnel, activable et désactivable, et peut être étendu aux documents, ce qui est utile dans les vieux intranets (http://forum.spip.org/fr_230827.html) — à éviter absolument sur Internet !

Configuration des liens explicites

Un panneau de configuration permet de :

  • activer/désactiver les styles et pictos
  • activer/désactiver l’ouverture des liens externes dans une nouvelle fenêtre
  • activer/désactiver l’ouverture de certains document dans une nouvelle fenêtre, d’après liste éditable des extensions

Avec ce plugin, il ne faut pas utiliser d’attributs « target="_blank" » dans vos squelettes, afin de ne pas interférer sur cette configuration.

Todolist

Évolutions attendues :

  • Correction des attributs title des liens ouvrant une nouvelle fenêtre, qui, en l’absence de title, devraient répéter le libellé du lien (comme suggéré ici).
  • Ajout automatique dans le libellé (entre les tags <a> et non pas en title) des liens générés par SPIP, du format et du poids du fichier, comme spécifié dans le ticket #2209.

Votre aide est bienvenue !

Notes

[*] Peu ou pas compatible avec les vieux navigateurs, dont Internet Explorer 6.

[1] L’ouverture d’une nouvelle fenêtre gênera la navigation d’une personne malvoyante en provoquant la perte de ses points de repère. Il convient donc d’avertir l’utilisateur. Au-delà des problématiques d’accessibilité il est préférable d’éviter autant que possible d’ouvrir de nouvelles fenêtres, les pop-up ayant tendance à agacer beaucoup d’internautes. (http://www.outil-webmaster.fr/navig...)

Discussion

5 ans 1 an 3 mois Sans limite
par date
Filtrer

6 discussions

  • 1
    Antoine LUCAS

    Bonjour,
    J’ai activé le plugin en version 4.0.0 dans mon site en HTTPS sous Spip 4.1.10 en cochant : Styler les liens (avec links.css)
    mais ce ne fonctionne que dans l’espace privé. Un problème de CSS sans doute ?

    • Antoine LUCAS

      Bon finalement cela fonctionne mais j’aimerais pouvoir supprimer le cadenas sur un lien interne, soit le logo du site qui est cliquable pour un retour à la page d’accueil. Je ne comprends pas pourquoi ce cadenas s’affiche.

    Répondre à ce message

  • Loiseau2nuit

    Hello ici,

    Pour une raison qui m’échappe, sur un SPIP 4.2 avec une version fraichement récupérée sur SVP, même si on coche explicitement que nous n’en voulons pas, et même après avoir purgé tous les caches (spip images) les styles de links.css s’appliquent quand même aux liens ?

    Si quelqu’un a une idée...
    Merci par avance

    Répondre à ce message

  • 8
    Jean Christophe Villeneuve

    Hello

    Je suis en train de tester ce plugin qui intéresse quelques utilisateurs d’Escal.

    Dans le menu j’ai un lien vers l’accueil codé ainsi
    a href="[(#CONFIG{gerer_trad}=={oui}|?{[(#URL_SITE_SPIP|parametre_url{lang,#ENV{lang}})],#URL_SITE_SPIP})]"

    Et il se trouve que ce lien ouvre une nouvelle fenêtre si le plugin « liens explicites » est activé et si, bien sur, on a demandé de forcer les liens externes vers une nouvelle fenêtre.

    Une idée pour corriger ?

    Répondre à ce message

  • Luc

    Bonsoir
    Je viens d’installer ce plugin pour diverses raisons, dont celle de faire pointer les liens externes au site vers une nouvelle fenêtre. Y en a qui disent que c’est mal, mais là n’est pas le sujet.
    Cela fonctionne tout à fait correctement, sauf que pour les liens (présents dans les menus, dans le fil d’Ariane) vers la page d’accueil de mon site :

    • si le lien est indiqué sous la forme « #URL_SITE_SPIP », il est considéré comme un lien externe.
    • il faut que ce lien soit indiqué sous la forme « #URL_SITE_SPIP/ » pour être considéré comme un lien interne.

    Je ne sais rien de la normalité de ce comportement.

    Répondre à ce message

  • 2
    DD

    Est-ce normal si les liens explicites ne fonctionnent pas sur le champ URL d’un article ?
    J’espérai que ce plugin détecte et ajoute tout seul le picto indiquant un lien externe (le cas échéant) mais cela ne semble pas être le cas.

    PS sinon difficile à trouver ce plugin via la page / ?exec=charger_plugin

    merci

    • tetue

      Ce plugin agit sur les liens des squelettes générés. Ça dépend donc, non du champ de saisie dans l’espace privé, mais de la façon dont c’est codé dans le squelette. Ceci dit, aucune idée de ce qui pourrait faire obstacle…

      À moins que tu n’évoques la redirection d’articles virtuels ?

    • DD

      Ah OK donc si je comprends bien je dois ajouter un mécanisme dans le squelette pour tester si un lien est externe ou interne et les traiter différemment.

    Répondre à ce message

  • 5
    VSM

    Bonjour,

    Une petite remarque : le plugin considère comme externe tout lien ne correspondant pas à l’url du site spip dans lequel il est installé ($GLOBALS['meta']['adresse_site'] du fichier links_pipelines.php).

    Ceci provoque un comportement bizarre lorsque l’on a des sous-domaines : un lien vers le sous-domaine sur lequel on se situe ouvre un nouvel onglet, alors que ce ne devrait pas être le cas (puisque c’est le même site).

    Ne vaudrait-il pas mieux considérer comme externe tout lien dont l’url de base est différente de l’url de base de la page où l’on se trouve ($js .= 'var links_site = \''.url_de_base().'\';'; au lieu de $js .= 'var links_site = \''.$GLOBALS['meta']['adresse_site'].'\';';) ?

    Merci !

    • tetue

      Sans doute, oui.

      Tout dépend de ce que l’on entend par « lien externe », la définition variant selon le point de vue :

      • D’un point de vue technique, on pourrait effectivement considérer qu’est externe tout lien vers une URL d’un autre domaine.
      • Mais d’un point de vue SEO et/ou marketing (définition dominante), est externe tout lien pointant vers un « autre site » (qu’il soit dans le même domaine ou pas). C’est le réglage actuel, qui répond donc à l’entendement courant de ce qu’est un lien externe.
      • D’un point de vue utilisateur, ça n’a aucune importance (voire aucun sens).
    • VSM

      En fait, le problème est que si un certain thème est affiché avec un sous-domaine (c’est mon cas), les liens présents sur la page, également dans ce sous-domaine, sont considérés comme externes, alors que ce n’est pas le cas (je suis sur sousdomaine.domaine.com/page1 et mon lien envoie vers sousdomaine.domaine.com/page2... mais dans un nouvel onglet).

      Je ne sais pas si je suis très clair.

    • VSM

      Bonjour,

      En fait, pour éviter des comparaisons avec des urls identiques mais considérées comme différentes à cause de / ajoutées parfois en fin d’adresse, il faudrait en réalité mettre $js .= 'var links_site = \''.rtrim(url_de_base(),'/').'\';';.

    • VSM

      Bonjour,

      Si cette remarque vous paraît justifiée, savez-vous s’il sera possible de procéder à une mise à jour du plugin, afin de résoudre ce problème avec les sous-domaines ?

      Merci beaucoup,

    • tetue

      Mieux vaut répondre tard que jamais, cela a été fixé, en réponse à vos commentaires : https://github.com/tetue/links/commit/3b3dbb678ad10f7fddb121b890a1017bc7699369

    Répondre à ce message

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Qui êtes-vous ?
[Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom