Affichage du site sur IE, template JSN

[FlodAriege]

Bonsoir,
J'ai pas mal avancé sur la (re)construction de mon site avec cet outil que je découvre peu à peu : Joomla, dopé à Flexicontent et enjolivé par JSN Boot.

J'ai pris l'habitude de bosser dessus en utilisant Mozilla, depuis que j'ai eu un blocage à l'installation sur Internet explorer.

Là, je viens d'essaye d'afficher le site (qui est encore en local) sur IE10 et.... waou je me suis fait peur !
La couleur des titres Hn est incorrecte, des boutons fantômes se baladent en plein milieu des articles, mon joli main-menu bien propre sous Moz est carrément chamboulé sous IE...*

Donc, ma question est la suivante :
IE est-il capable d'afficher correctement un site construit sous Joomla ?

Si ça change quoi que ce soit, j'utilise le Template JSN Boot. Lequel a l'air de s'afficher à peu près correctement sous IE (demo ici : http://demo.joomlashine.com/joomla-t...=74&Itemid=469 ).

Mes soucis d'affichage ont-ils une chance de disparaître quand je mettrai le site en ligne ? Ou bien dois-je me préparer à devoir corriger a mano tout un tas de truc bizarres et incongrus dans des langages que je ne maîtrise pas ?

Merci d'avance pour vos points de vue et vos retours d'expérience sur la question. Parce que si Mozilla est effectivement bien plus pratique pour travailler, IE conserve quand même une part de marché carrément gigantesque dans mon 'lectorat'...

Bonne nuit.



* possiblement dû au fait que j'ai augmenté la taille de la police du Template (de 75% à 85%) : j'ai l'impression que cela passe très bien sur Mozilla, mais que sur IE ça provoque des retours à la ligne non voulus. Si c'est ça, au pire je peux réduire à nouveau la taille de la police du Template, puisque Flexicontent m'affiche une jolie toolbar où c'est l'internaute qui peut choisir d'augmenter ou de réduire la taille des caractères.

[PieceOfCake]

Re : Affichage du site sur IE, template JSN

S'il n'y avait pas de différence entre les différents navigateurs internet, il n'y en aurait qu'un seul sur le marché (comme en 2000-2001 !).

plus sérieusement IE (surtout depuis la version 9), est loin d'être mauvais, et effectivement la page que tu donnes fournit, visuellement à peu près les mêmes résultats entre Chrome, FF 25.0 et IE10. Ça ne vient donc pas directement du modèle (du template), si tu as de grosses différences, faut creuser un petit peu plus loin pour voir la cause.

Et non peu de chances que ça change quelque chose en changeant l'endroit sur lequel tu vas exécuter ton site. Comme tu n'es pas maître du navigateur utilisé par tes navigateurs, il te reste à tester avec le plus de versions différentes pour limiter les impacts.
Et oui il faut te préparer à corriger manuellement beaucoup de petits écarts. C'est pour ça que c'est toujours une bonne chose, le plus tôt possible dans le processus de création d'un site de commencer à tester avec différents navigateurs pour 'corriger' le plus tôt possible ...

Te restes une autre option, mettre un petit message en début de site du style (pour une meilleur visualisation du site, le navigateur Chrome, (ou Firefox ou ce que tu veux) est conseillé ... (cela a au moins l'avantage aux utilisateurs d'autres navigateurs de s'apercevoir que tu as conscience de problèmes potentiels avec LEUR navigateur).

Je crois même avoir vu sur la JED un composant permettant de tester dynamiquement le navigateur client et d'afficher le message approprié

Dur métier. Bon courage

[jisse03]

Re : Affichage du site sur IE, template JSN

Bonjour,

Sur le site de démo, le template JSN Boot Pro donne un résultat visuel à peu près équivalent quel que soit le navigateur utilisé. Et le template fournit, en plus, un CSS spécifique jsn_fixie7.css plus PIE.htc pour traiter les "quirks" de diverses versions de Internet Explorer.

Les choses peuvent se compliquer singulièrement dès lors qu'on rajoute des extensions (composants, modules, plugins), chaque extension venant avec son propre CSS, qui parfois ne prend pas en compte les spécificités Internet Explorer et viennent casser ce bel équilibre.
Il faut donc analyser l'origine de ces changements et rafistoler ces divers CSS pour les rendre compatibles (ou au moins utilisables) avec tous les navigateurs.

[FlodAriege]

Re : Affichage du site sur IE, template JSN

Bonjour Jisse, bonjour PieceofCake,

Merci pour ces promptes réponses !
J'ai donc eu de la chance que l'idée me traverse aussi tôt d'aller voir ce que ça donnait sur IE. Même si c'est un pur hasard dû à la fatigue pour vous dire la vérité...

Pour ce que j'en vois, la différence principale serait la largeur du conteneur principal. En effet bien que je travaille sur un écran 16:9, IE m'affiche le contenu du site sur un conteneur de plus petite largeur que Mozilla. Du coup par exemple, le menu principal (en haut), s'affiche sur 2 lignes au lieu d'une. J'ai pourtant activé le responsive à la fois sur les petits écrans de mobile et sur les écrans larges de PC.

Bon, ça au pire je dois pouvoir le régler, en tâtonnant un peu et en jouant sur la taille des caractères ou le nombre de caractères dans les liens de menus de 1er niveau.

Mais j'aurais préféré réussir à obtenir un affichage de plus grande largeur sur IE : cela vous paraît-il envisageable ?

Quant aux boutons fantômes (boutons vides superposés au texte d'un article), curieusement en allant et en revenant sur la page où j'ai vu ça (hier et encore ce matin), ça a fini par disparaître spontanément. GHOST IN THE MACHINE ??? J'espère que ça ne reviendra pas, parce que franchement c'est typiquement le genre de trucs que je serais bien incapable de résoudre.

Il faudrait que je puisse vérifier l'affichage sur IE9, mais comme je suis encore en local, je ne sais pas comment faire... Chrome aussi, mais ça je peux l'installer.

Bonne journée

[PieceOfCake]

Re : Affichage du site sur IE, template JSN

Pour ce qui est de tester avec plusieurs navigateurs et versions de navigateur, je te conseille cet article de Alsacreation qui est assez bien documenté et didactique


En ce qui concerne le problème largeur du conteneur, il est possible que tu sois obligé de faire ce qu'on appelle un hack pour IE (on en trouve des exemples sur internet assez facilement, si le problème est lié à une instruction CSS non supportée par IE (à partir de IE9 - IE10 c'est plus rare, mais il en reste surement). Un des problèmes des versions précédentes de IE était l'absence de support des styles CSS (min-width et min-height entre autre !!), si c'est ça qui provoque le problème (et ça pourrait bien y ressembler), il faudra rajouter une instruction CSS "que" pour IE pour essayer de trouver une compatibilité (c'est à ça que servent les hacks, trouver une syntaxe qui n'est reconnu que par IE (pas foutre la zone ailleurs) et réparer le problème).

Je vais regarder si je trouve un équivalent mais d'abord je vais manger !

A+

[FlodAriege]

Re : Affichage du site sur IE, template JSN

Pour info, lorsque je clique sur le petit symbole en forme de "page déchirée" à droite de la barre d'adresse dans IE10
(celui dont l'infobulle dit : pour les sites internet conçus pour des versions plus anciennes du navigateur, auront meilleur aspect et des problèmes tels que des menus, des images, ... déplacés, seront résolus)... eh bien...
miracle, l'affichage est NICKEL CHROME.
La largeur du conteneur a repris sa taille 'normale' (je en sais pas trop quelle est sa taille normale mais bon).
Il ne manque plus qu'à trouver un truc pour que les internautes cliquent sur ce minuscule bouton (que j'avais toujours superbement ignoré jusqu'alors) s'ils ont un IE10.
Je verrai si j'ai d'autres problèmes d'affichage à part ceux déjà évoqués.
Merci du coup de main, et merci pour le tuyau PieceofCake, au moins je saurai que ça existe et je pourrai faire une recherche.

Bonne soirée