Discussion :

[Invité]

Bonjour,

Je suis confronté à un problème non pas de développeur mais d’utilisateur. Je tente d’accéder à une page Internet dont le lien est précédé d’un « @import url » :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<div id="blogMe">
<style type="text/css" media="all">@import url(http://www.allibert-trekking.com/include/css/blogMe.css);</style>
…
</div>

Ayant deux ordinateurs :

• sur l’un, j’accède sans problème à la page souhaitée,
• tandis que sur l’autre, le lien me redirige vers la page d’accueil du site et dans ce cas, que je ferme ou non la page d’accueil du site, Internet restant actif, un deuxième clic sur le lien me permet d’accéder correctement à la page souhaitée.

J’en conclu que le bon fonctionnement du « @import url » doit dépendre d’une option Internet du navigateur (IE), mais laquelle ? Après confrontation des options Internet de mes deux ordinateurs, je n’ai toujours pas trouvé la bonne option à cocher ou décocher. J’ai également consulté à peu près tout ce qui s’est dit à propos des CSS en relation avec « @import url » mais je n’ai pas trouvé la réponse que j’espérais.

Qu’en pensent les spécialistes ?

[12monkeys]

Bonsoir

D'abord je n'ai pas très bien compris ce que ça faisait comme erreur : la règle @import est une autre manière de lier un document html à une feuille de style, je ne vois pas ce que @import a à voir avec un lien cliquable...

Là où je ne comprends pas non plus c'est quand tu dis :

que je ferme ou non la page d’accueil du site, Internet restant actif, un deuxième clic sur le lien

Comment peut tu cliquer sur le lien si tu fermes la page ?


Par contre tu as ta balises style dans le corps du document (balises div autour) Or la balise style doit se trouver dans l'en-tête du document : entre les balises head.

La seule problématique que je connaisse avec @import est le fait que IE ne gère pas @import quand on lui rajoute un type de média :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

@import url(http://www.allibert-trekking.com/include/css/blogMe.css) print;

[Invité]

Bonjour 12monkeys,

D'abord je n'ai pas très bien compris ce que ça faisait comme erreur : la règle @import est une autre manière de lier un document html à une feuille de style, je ne vois pas ce que @import a à voir avec un lien cliquable...

Bon, je vais tenter de décrire très précisément le contexte…

Comment peux-tu cliquer sur le lien si tu fermes la page ?

J’avais dit qu’IE était toujours actif. C’est-à-dire que mon lien reste accessible sur une page qui elle, est toujours ouverte. Et que je ferme ou non la page d’accueil du site ouverte par mon premier clic, un deuxième clic sur mon lien ouvre bien la page spécifique du site que je souhaite consulter.

Ceci est également vrai depuis ce même lien communiqué par e-mail.

Cela fait comme si l’ouverture de la page d’accueil du site avait importé sur mon ordinateur les fonctions nécessaires qui vont permettre au deuxième clic d’accéder à la page spécifique que je cherche à afficher.

Par contre tu as ta balise style dans le corps du document (balises div autour). Or la balise style doit se trouver dans l'en-tête du document : entre les balises head.

Pour ce problème que je soumets, je ne me situe pas en tant que développeur mais en tant qu’utilisateur, donc, ce n’est pas moi qui conçois ce code. Je ne fais que reprendre le code que propose le site sur lequel j’interviens dans le cadre d’un back office.

Pour comprendre ce code, justement, je me suis décidé à l’insérer dans un autre back office où j’interviens également et où j’ai la possibilité d’accéder au HTML.

J’ai également inséré ce code dans le contenu d’un mail que je me suis envoyé sur chacun de mes deux ordinateurs. L’ouverture du lien fonctionne parfaitement sur l’un et pas sur l’autre. Ça énerve !

Pour être concret, je te propose tout simplement d’accéder aux deux sites sur lesquels j’interviens. Le premier : GIFA t’ouvre la page dans laquelle j’ai inséré le code en question. Le back office me permettant d’accéder au HTML, j’ai un peu sophistiqué mon histoire en l’insérant centré dans un tableau. Il suffit donc d’afficher le code de la page, ce que j’ai fait, pour constater que la balise « style » n’est pas entre les balises « head » ainsi que tu le préconises.

A partir de là, tu cliques donc sur le premier lien (01/08/2008 à 16h29 - Trekkeurs d'Islande) pour accéder au deuxième site sur lequel j’interviens. Si tout se passe bien, tu accèdes donc à la page que j’ai créée dans le cadre du back office de ce site. En bas de chaque page de ce site, un menu horizontal offre la possibilité de « Citer cette page ». Une fenêtre s’ouvre avec le code HTML proposé et le choix « Sélectionner le code » copie le code dans le presse-papiers, etc.

Mon problème, donc, c'est que lorsque je clique sur ce lien, le lien s'affiche bien en tant qu'URL dans IE mais après quelques secondes de réflexion, il est remplacé par le lien vers la page d'accueil du site.

Merci à toi d'essayer d'apporter une réponse à ce petit problème. Cela dit, ce n'est pas vital pour moi mais ça m'enquiquine bien quand même. J'ai longtemps pensé que le site me déroutait volontairement vers sa page d'accueil, jusqu'à ce que je teste sur un autre micro.

[12monkeys]

Bon résumons, tu vas sur le site http://www.allibert-trekking.com/cdr...71-islande.htm, tu copie le code qu'ils te proposent tout en bas, tu l'installe sur ton site, et en cliquant sur le lien tu est bien renvoyé sur cette page, mais après quelques instants il te redirige vers l'accueil du site. C'est ça ?

Si c'est bien ça je ne sais pas d'où ça vient, n'ayant pas réussit à le reproduire. Je pet par contre confirmer que cela ne vient pas de @import qui ne sert que à lier un document html à une feuille de style.

[Erwan31]

Au passage pourquoi passer par un @import plutôt qu'un simple link.
La directive @import (seule et sans script) provoque un phénomène de FOUC (Flash of Unstyled Content) sous IE et ralentit un peu les performance d'affichage sur les autres navigateurs.

La seule problématique que je connaisse avec @import est le fait que IE ne gère pas @import quand on lui rajoute un type de média :

Salut 12Monkeys,
oui mais en fait dans la plupart des cas il sert surtout à exclure IE4 (avec la syntaxe sans url > exemple @import "styles.css" ), et à servir une version brute à ces vieilles versions, ce qui n'est plus vraiment à l'ordre du jour... L'exclusion d'IE peut se faire plus simplement via les commentaires conditionnels (if !IE)

[Invité]

Bonjour,

… tu copies le code qu'ils te proposent tout en bas, tu l'installes sur ton site, et en cliquant sur le lien tu es bien renvoyé sur cette page, mais après quelques instants il te redirige vers l'accueil du site. C'est ça ?

Tout-à-fait. En précisant que le page correspondant au lien cliqué ne s’affiche pas. Il y a juste substitution de l’URL de cette page par l’URL de la page d’accueil du site et affichage de la page d’accueil.

A partir de là, si je clique à nouveau sur mon lien, ça marche. Même si entre temps j’ai fermé la page d’accueil du site. Déconcertant, non ?

C’est pourquoi, je pense que le problème peut venir du paramétrage de mon navigateur (IE). Il semble réfléchir, le bougre, avant de se décider à changer l'URL. Je continue de chercher dans cette voie mais je ne sais pas s’il peut s’agir d’une option de l’onglet « Sécurité », de l’onglet « Confidentialité » ou encore de l’onglet « Avancés » ou… Si c'est environnemental, je devrais peut-être consulter le Docteur House…

Au passage pourquoi passer par un @import plutôt qu'un simple link.

La remarque me fait penser que mon problème rejoint peut-être la discussion de Thomad. Dans le doute j’ai préféré ouvrir une nouvelle discussion.

Pourquoi… ? Parce que j’ai abandonné la carte perforée avant-hier et qu’il ne me reste plus qu’un seul neurone que je dois ménager pour essayer de comprendre l’Internet avant d’être atteint d'Elsheimer . Dans le cas présent, je me contente modestement de recopier le code que le site propose.

Pas facile de refaire une nouvelle carrière en autodidacte !...

[Erwan31]

Pourquoi… ? Parce que j’ai abandonné la carte perforée avant-hier et qu’il ne me reste plus qu’un seul neurone que je dois ménager pour essayer de comprendre l’Internet avant d’être atteint d'Elsheimer . Dans le cas présent, je me contente modestement de recopier le code que le site propose.

Vous avez encore de belles années devant vous avant de risquer d'être atteint de la maladie d'Elsheimer AMHA
Bon ben alors passez pas un simple link CSS, ça vaut mieux
Exemple (XHTML): (ne pas oublier de préciser le média cible)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<link rel="stylesheet" type="text/css" href="/css/screen.css" media="screen" />

Ce code ne sera lu que par les écrans classiques, certains petits écran (PDA...) et les lecteurs d'écran (logiciel de synthèse vocale pour les non/mal-voyant) qui ne tiennent pas compte du media, mais ne sera pas pris en compte par exemple lorsqu'on imprime le document.