[ASTUCE] - Ouverture des liens et photos dans autre onglet

Tekila · Message par **Tekila** » 09 févr. 2011, 11:08

Lorsque par exemple l'on clique sur une photo de votre blog, il est possible qu'elle s'affiche à taille réelle dans la même fenêtre de navigation.
Il est donc obligé pour le visiteur de cliquer sur précédent pour revenir sur votre blog.
Garik m'avait fait passer une astuce pour que les photos s'ouvrent dans un autre onglet de votre navigateur, ainsi le visiteur reste sur votre blog.
Pour réaliser celà, vous pouvez suivre la procédure suivante décrite par Garik :

Garik a écrit : Une première chose, que moi je trouve agaçant, c’est que quand on insère une image dans le blog et que l’on clique dessus, à la base elle ne s’ouvre pas dans une autre fenêtre. Pour remédier à ça c’est très simple, il suffit de placer le bout de code suivant dans le code html de l’image.
target="_blank"
il faut bien sûr le placer à un endroit précis, donc quand tu as inséré ton image via l’interface de rédaction, tu click sur l’onglet « Modifier le code HTML »
Ensuite tu repères le code de l’image, c’est simple il est entre des balises DIV, comme ça :
<div class="separator" style="clear: both; text-align: center;">
<a href="http://1.bp.blogspot.com/_DIUOhCoozh8/T ... 0-2010.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;">
<img border="0" height="240" src="http://1.bp.blogspot.com/_DIUOhCoozh8/T ... 0-2010.jpg" width="400" /></a>
</div>

Bien, une fois que tu le tiens il ne reste plus qu’a taper le code au bon endroit comme en dessous :
<div class="separator" style="clear: both; text-align: center;">
<a href="http://1.bp.blogspot.com/_DIUOhCoozh8/T ... 0-2010.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" target="_blank">
<img border="0" height="240" src="http://1.bp.blogspot.com/_DIUOhCoozh8/T ... 0-2010.jpg" width="400" /></a>
</div>

Effectivement ça marche plutôt bien, mais ce n'est pas super ergonomique à réaliser (retourner à chaque fois dans le code source, c'est un peu "lourd" on va dire.
Mais on peut généraliser cette astuce à tout le blog, une bonne fois pour toute, tous vos liens s'ouvriront dasn un nouvel onglet.
Pour celà, il suffit de se rendre dans le code source de votre blog, de reprérer la balise
<head>
et de coller ce petit bout de code juste dessous :
<base target='_blank'/>
Dorénavant, tous les liens s'ouvriront dans une nouvelle fenêtre ou onglet

Message par **Garik** » 09 févr. 2011, 11:44

Perso je rédige mon blog en code, je ne passe pas par l'interface de rédaction donc ça ne me gène pas trop de taper du code.

Par contre attention à la balise <base target='_blank'/> c'est un outil radical et pour faire simple qui viol les conventions de navigation, ce qui est vrais aussi pour l'argument target="_blank" d'ailleurs mais celui-ci étant plus ciblé c'est plus transparent pour le visiteur.
Avec la balise <base target='_blank'/> ce sont vraiment 100% des liens du site qui sont ouvert dans un autre onglet ou fenêtre (fonction du navigateur) y compris les pages, les liens de retour à l'index, les liens des messages, les tags, etc... impossible de cibler et pour le coup ça devient vite lassant pour le visiteur de devoir fermer tout les onglets qui s'ouvrent et qu'il apparente à des popup.

Cette balise existe mais bon pour moi elle est un peut trop "ultime" pour être vraiment efficace sur un site web.

Tekila · Message par **Tekila** » 09 févr. 2011, 11:55

ouah l'autre hé, il me casse tout le truc!!!!

allez tester cette fonctionnalité sur mon blog pour vous rendre compte : http://tekila-vtt.blogspot.com/
je trouve ça pas mal, moi.

Message par **kingkeos** » 09 févr. 2011, 12:04

Garik a écrit : Par contre attention à la balise <base target='_blank'/> c'est un outil radical et pour faire simple qui viol les conventions de navigation, ce qui est vrais aussi pour la balise "target" d'ailleurs mais celle-ci étant plus ciblé c'est plus transparent pour le visiteur.
Avec la balise <base target='_blank'/> ce sont vraiment 100% des liens du site qui sont ouvert dans un autre onglet ou fenêtre (fonction du navigateur) y compris les pages, les liens de retour à l'index, les liens des messages, les tags, etc... impossible de cibler et pour le coup ça devient vite lassant pour le visiteur de devoir fermer tout les onglets qui s'ouvrent et qu'il apparente à des popup.

Absolument ! Dans le modèle html strict, c'est pas autorisé.
Forcer le comportement est rarement une bonne solution. L'utilisateur doit avoir le choix d'ouvrir les liens qu'il veut dans une nouvelle fenêtre/onglet.

Ca vous parait logique pour certains liens externes, mais les mettre ainsi ne fera pas plus rester l'internaute sur votre site. S'il a envie d'aller suivre le lien en restant sur votre blog, il le fera de lui même. S'il ne veut pas rester, il fermera la fenêtre de votre blog dans tous les cas.
Au contraire, en faisant ça, on brise le chaine de l'historique, donc si l'internaute ferme votre blog après avoir cliqué sur un lien externe, il ne pourra pas y revenir en faisant "page précédente".

Lorsque je surf et vogue de site en site, lorsque je tombe sur un lien qui oblige à s'ouvrir dans un nouvel onglet alors que je ne le souhaitais pas, ça m'énerve bien, et je quitte le site tout pareil.

Tekila a écrit :ouah l'autre hé, il me casse tout le truc!!!!

allez tester cette fonctionnalité sur mon blog pour vous rendre compte : http://tekila-vtt.blogspot.com/
je trouve ça pas mal, moi.

Bah tu vois, sur ton blog, ça m'énerve. Si je clique avec le bouton gauche, je veux voir l'image dans la meme fenetre et revenir avec le bouton précédent. Si je veux le voir dans un nouvel onglet (qui peut se retrouver bien loin dans le navigateur si j'en ai d'autres ouverts), je choisis moi même.
Et quand je vais voir un compte rendu, je veux pas qu'ils s'ouvrent dans une nouvelle fenetre à chaque fois ! La fenetre précédente ne me sert de toute façon plus ! Je suis pas multitache pour la lecture !

Sans vouloir être blessant, surfer sur ce blog n'est pas du tout agréable pour moi.

Message par **Garik** » 09 févr. 2011, 12:26

Tekila a écrit :ouah l'autre hé, il me casse tout le truc!!!!

Ah ben non, ce n'est pas le but

, je donne juste les différences techniques entre les deux outils ainsi que les faiblesses du système. Que Kingkeos à bien mieux exprimé que moi d'ailleurs mais lui il est vraiment bon alors c'est pas du jeu.

Bien sûr j'exprime pourquoi ma préférence va à l'un plutôt qu'à l'autre mais après chacun fait tout comme il veut

Perso j'ai essayé de limiter cet usage aux photos (parce que moi à la base je trouve ça plus sympa mais quand j'y réfléchi, ce n'est peut être pas sympa pour tout le monde...) et à quelques sites marchants dont je donne les liens (pour que le visiteur puisse les fermer comme des popup) pour le reste je laisse effectivement le visiteur exploiter lui même son navigateur et son historique de navigation.

Tekila · Message par **Tekila** » 09 févr. 2011, 16:29

kingkeos a écrit :
Tekila a écrit :ouah l'autre hé, il me casse tout le truc!!!!

allez tester cette fonctionnalité sur mon blog pour vous rendre compte : http://tekila-vtt.blogspot.com/
je trouve ça pas mal, moi.
Bah tu vois, sur ton blog, ça m'énerve. Si je clique avec le bouton gauche, je veux voir l'image dans la meme fenetre et revenir avec le bouton précédent. Si je veux le voir dans un nouvel onglet (qui peut se retrouver bien loin dans le navigateur si j'en ai d'autres ouverts), je choisis moi même.
Et quand je vais voir un compte rendu, je veux pas qu'ils s'ouvrent dans une nouvelle fenetre à chaque fois ! La fenetre précédente ne me sert de toute façon plus ! Je suis pas multitache pour la lecture !

Sans vouloir être blessant, surfer sur ce blog n'est pas du tout agréable pour moi.

merci pour le retour, du coup, j'ai changé

UtagawaVTT

[ASTUCE] - Ouverture des liens et photos dans autre onglet

[ASTUCE] - Ouverture des liens et photos dans autre onglet

Re: [ASTUCE] - Ouverture des liens et photos dans autre ongl

Re: [ASTUCE] - Ouverture des liens et photos dans autre ongl

Re: [ASTUCE] - Ouverture des liens et photos dans autre ongl

Re: [ASTUCE] - Ouverture des liens et photos dans autre ongl

Re: [ASTUCE] - Ouverture des liens et photos dans autre ongl