5008 sujets

Sémantique web et HTML

bonjour

jusqu’à présent j'ai toujours créer des liens en HTML5 dont l'ouverture se réalise dans la page en cours

je souhaite maintenant des liens en HTML5 dont l'ouverture se réalise dans une autre page dans un nouveau feuillet de la même fenêtre ou dans une autre fenêtre

je n'ai pas pas réussie à trouver l'instruction correspondante, merci d'avance de me l'indiquer
Modérateur
Il faut rajouter aux liens target="_blank"
Par contre c'est une pratique à éviter, ça ennuie souvent les utilisateurs. Si ils veulent ouvrir un lien dans un nouvel onglet, ils le feront par eux même Smiley cligne
merci pour le lien laurent j'utiliserais ce type de lien seulement à dose homéopathique

une précision edenpulse que vaut l'instruction :

target="_blank"


l'ouverture qui sera réalisée dans une autre page la sera dans un feuillet supplémentaire (de la même fenêtre) ou dans une nouvelle fenêtre ?
Bonjour,


MIR2002 a écrit :
l'ouverture qui sera réalisée dans une autre page la sera dans un feuillet supplémentaire (de la même fenêtre) ou dans une nouvelle fenêtre ?
Suivant la configuration du navigateur l'ouverture s'effectuera soit dans une nouvelle fenêtre soit dans un nouvel onglet.


Bonne journée. Smiley smile
edenpulse a écrit :
Il faut rajouter aux liens target="_blank"
Par contre c'est une pratique à éviter, ça ennuie souvent les utilisateurs. Si ils veulent ouvrir un lien dans un nouvel onglet, ils le feront par eux même Smiley cligne

Je me permets -- un peu tard -- de réagir à ce point: combien d'utilisateurs savent comment afficher un lien dans un nouvel onglet ou une nouvelle fenêtre?
Tout dépend de ce qu'on veut.
Si on a une page qui parle d'un sujet et donne un lien vers un autre site qui parle du même sujet, il me semble approprié d'ouvrir une autre page. Par contre s'il s'agit de dire "cliquer ici pour voir la suite de mon passionnant article", il est normal que ce soit dans la même fenêtre.
A mon sens ce n'est pas une pratique "à éviter", c'est une pratique à utiliser "avec modération", comme tant d'autres bonnes choses... Smiley cligne
Modérateur
Effectivement, je n'ai pas précisé et me suis peut-être un peu mal exprimé, mais effectivement, dans le cas d'un site externe, l'ouvrir dans un nouvel onglet n'est pas un soucis. A utiliser avec modération, tout à fait @PapyJP.

Le comportement d'afficher dans un nouvel onglet est devenu plutôt naturel, même chez les personnes peut au fait techniquement. Le fait que les navigateurs poussent un peu dans cette direction aide beaucoup.
Je rejoins ton avis PapyJP qui me semble beaucoup plus mesuré que le bannissement latéral de la propriété.

Je suis peut-être un utilisateur aux pratiques non majoritaires mais ça me gonfle lorsque je consulte un article et qu'un clic vers un autre site efface le contenu que je suis en train de lire pour afficher ce nouveau lien.
Je consulte du contenu additionnel mais l'article de fond garde grand intérêt à mes yeux et préfère naviguer entre deux onglets que de manipuler l'historique de navigation.
N'avez-vous peut-être pas remarqués mais souvent les liens qui semblent intéressants ne sont pas systématiquement placés en fin de lecture... Bref, vous voyez où je veux en venir.

Du coup cela m'oblige à adopter des "toc" comme systématiquement cliquer-droit sur un lien.

Quand j'enfile la casquette de webdev, c'est ce réflexe conditionnel qui me motive à faire ouvrir les liens externes vers une nouvelle fenêtre ; la navigation intra-muros restant dans la même page.

Google aussi utilise ce genre de pratique. Dans les paramètres de la recherche, l'utilisateur a le choix de faire ouvrir les liens soit dans le parent soit dans une nouvelle page. Si c'est codé, ce ne doit pas être pour rien. J'aime à croire que d'autres ont les mêmes préférences que moi.


Un avis à prendre pour ce qu'il est : un simple avis. Smiley langue
Modifié par Greg_Lumiere (25 Jul 2016 - 11:29)
MIR2002 a écrit :
bonjour

jusqu’à présent j'ai toujours créer des liens en HTML5 dont l'ouverture se réalise dans la page en cours

je souhaite maintenant des liens en HTML5 dont l'ouverture se réalise dans une autre page dans un nouveau feuillet de la même fenêtre ou dans une autre fenêtre

je n'ai pas pas réussie à trouver l'instruction correspondante, merci d'avance de me l'indiquer

Bonjour,
Pour compléter les commentaires précédents concernant l'opportunité qu'il y a, ou non, d'ouvrir un lien dans un nouvel onglet, c'est vrai qu'il est difficile d'avoir une règle établie valable pour tout le monde.
Chacun a sa notion de ce qu'est une navigation confortable et chaque option est en soi respectable.
Ceci posé, il faut bien définir un comportement au sein du site web et faire un choix qui, de toute façon, mécontentera certains visiteurs.
Pour mes développements, j'ai adopté la solution suivante : même onglet si cible du lien interne au site, nouvel onglet si lien vers un site externe.
Ce n'est pas LA solution à imposer comme la meilleure mais simplement celle qui me semble la plus adaptée à mes besoins.
A priori, c'est également celle qu'adoptent d'autres concepteurs de sites, mais chacun conserve son libre arbitre sur ce point.
Je suis dans la même lignée que Sepecat, avec l'ajout d'un target blank en javascript sur les liens detectés comme externes au site. Comme ça je n'ai pas à m'en occuper et le script est facile à désactiver si besoin.
Olivier C a écrit :
Je suis dans la même lignée que Sepecat, avec l'ajout d'un target blank en javascript sur les liens detectés comme externes au site. Comme ça je n'ai pas à m'en occuper et le script est facile à désactiver si besoin.

Bonne idée.
Moi je fais les liens sous la forme
docView('url-de-la-page', 'texte')

ou
docLink('url-de-la-page', 'texte')

Le premier script génère un lien avec target="_blank", le deuxième sans target.
Si le texte est vide, le script met l'URL de la page.
Bien entendu l'essentiel du code est le mème.
C'est de toute façon plus simple à écrire que
<a href="url-de-la-page" target="_blank">texte</a>

mais je retiens l'idée de n'avoir qu'un seul script et de regarder si elle appartient ou non au site en cours.
Je vais demander l'avis du propriétaire du site.
Le script (en jQuery) :
// -----------------------------------------------------------------------------
// @section     External links
// @description Gestion des liens externes au site
// -----------------------------------------------------------------------------

// @note Par défaut, tous les liens externes conduisent à l'ouverture d'un nouvel onglet, sauf les liens de téléchargement

( function( $ ) { // Ajout d'un attribut target_blank sur les liens externes
	$( document ).find( 'a:not(.download-link)' ).filter( function() {
		return this.hostname && this.hostname !== location.hostname;
	} ).attr( 'target', '_blank' );
} )( jQuery );
Bonjour tout le monde,
Je comprend votre avis il n'est pas nouveau on en parlait ici même il y a déjà bientôt 10 ans. Cependant, attention à ce que vous faites : un lien en Target blank ou assimilé ne laisse pas le choix au visiteur sur la façon dont ce lien doit s'ouvrir. Il faut donc être conscient qu'il s'agit d'un comportement obstrusif unilatéral. Si le visiteur peut décider d'ouvrir un lien quelconque dans une nouvelle fenêtre, il ne peut pas ouvrir un lien s'ouvrant dans une nouvelle fenêtre dans la même fenêtre. Si vous faites les choses bien (genre en avertissant systématiquement que le lien s'ouvrira dans une nouvelle fenêtre le cas échéant) c'est disons pas-trop-méchant-on-a-vu-pire Smiley smile . Si vous le faites mal c'est par contre vraiment nul, quel que soit la nature du lien (interne/externe) Smiley smile
Modifié par audrasjb (25 Jul 2016 - 23:16)
Les sites les plus en vue, Google en tête, ne se gênent absolument pas pour employer cette technique et personne ne s'en plaint. Ce trait est encore accentué quand on passe d'un site à une application sur mobile (ex : Maps).

Mais il est vraie qu'une petite indication - une icône à côté du lien par exemple - est bienvenue.
OlivierC a écrit :
Les sites les plus en vue, Google en tête, ne se gênent absolument pas pour employer cette technique et personne ne s'en plaint

En fait j'aurais remplacé la fin par "et personne n'a le choix." Smiley ravi
Les sites les plus en vue ne sont pas forcément les plus respectueux des pratiques des utilisateurs.
Par contre attention de ne pas confondre un applicatif (Gmail, Google Docs) et un site web, même si dans tous les cas les bonnes pratiques devraient être les mêmes Smiley smile
OlivierC a écrit :
Mais il est vraie qu'une petite indication - une icône à côté du lien par exemple - est bienvenue.

C'est obligatoire pour l'accessibilité et c'est une bonne pratique pour quiconque essaye d'intégrer un minimum de qualité (je vous renvoie vers les checklists Opquast par exemple) que d'indiquer le comportement de ce type de lien.
Une icône, pourquoi pas, tant qu'elle dispose d'une alternative textuelle (donc pas de ::after a priori).

La bonne pratique classique pour cela est plutôt d'utiliser l'attribut title ("ce lien s'ouvrira dans une nouvelle fenêtre"), et d'ajouter – si possible – une icône en plus (et là on a droit d'utiliser ::after) Smiley smile
Modifié par audrasjb (26 Jul 2016 - 10:57)
Chacune des approches décrites ci-dessus me paraît utilisable, dès lors qu'elle "colle" au besoin exprimé par le client ou au retour d'expérience constaté auprès des utilisateurs.
Comme je l'indiquais précédemment, mes "ouailles" préfèrent plutôt lien interne = même fenêtre / lien externe = nouvel onglet.
Cela correspond à leur façon de travailler (ex. Page HTML de requêtes SQL sur SGBD + lien sur site externe Oracle ou SQL Server).
Pas un comportement universel, donc, mais une adaptation du site à prendre au cas par cas en ayant soin d'intégrer les aides utilisateur déjà citées (icônes, titre, etc.).
En fait, ce qui me paraît le plus important n'est pas tant la solution retenue que la façon de passer de l'une à l'autre le plus rapidement et de la manière la plus fiable possible.
Chacun peut adopter pour cela l'outil qui lui convient le mieux (code javascript, PHP, etc.).
Pour ma part, j'ai choisi d'intégrer deux niveaux distincts dans mon générateur HTML :
- niveau projet, indicateur BLANK, SELF ou AUTO
- au niveau page HTML, indicateur DEFAULT (valeur projet) ou CUSTOM (l'une des trois valeurs projet valable pour un lien donné)
Si la demande client / retour d'expérience change, il est rapide et fiable de modifier l'intégralité du site web.
En cas de choix CUSTOM, il faut revenir sur chaque lien mais une boîte de dialogue est spécifiquement dédiée à cette tâche, afin d'avoir tous ces liens en un seul coup d'œil et décider de leur action au cas par cas.