8722 sujets

Développement web côté serveur, CMS

Bonjour,

Voici un site que j'administre : https://aidantattitude.fr/

Tout s'affiche bien sauf sur...Internet explorer v 11.0

Sur les 4 1ers posts à la une, il n'y a aucune image. Pour le reste tout est ok. Juste ces 4 pu... d'images. Et juste sur ie.

Quelqu'un aurait-il une idee, une piste ou une solution pour m'aider à régler ce satané probleme ?

Je vous remercie par avance pour vos réponses Smiley cligne
Non je n'y ai pas posté. Mais apparemment cela viendrait de chez moi, sur un testeur de serveur, le site s'affiche correctement.

Maintenant si on pouvait me confirmer cette info, ce serait top !
J'ai fait une mise à jour de mon vieux Windows10 cet après-midi.
Effectivement certains articles n'affichent pas les photos d'entête. Le code ressemble à cela dans ce cas là :
<figure class="am-entry-featured-media">
    <a href="https://aidantattitude.fr/2017/06/25/entreprendre-pour-intervenir-autrement-dans-le-champ-du-handicap.php/">
        <img width="360" height="270"
            class="am-featured-image attachment-am-360-270 size-am-360-270 lazyload agg-fade-in" alt="Handipossibles"
            src="data:image/gif;base64,R0lGODlhBAADAIAAAAAAAAAAACH5BAEAAAAALAAAAAAEAAMAAAIDhI9WADs="
            data-sizes="(max-width: 360px) 100vw, 360px"
            data-srcset="https://aidantattitude.fr/wp-content/uploads/2017/05/Aurelie_olivia_Daniel-360x270.jpg 360w,
                 https://aidantattitude.fr/wp-content/uploads/2017/05/Aurelie_olivia_Daniel-120x90.jpg  120w,
                 https://aidantattitude.fr/wp-content/uploads/2017/05/Aurelie_olivia_Daniel-160x120.jpg  160w,
                 https://aidantattitude.fr/wp-content/uploads/2017/05/Aurelie_olivia_Daniel-270x203.jpg  270w,
                 https://aidantattitude.fr/wp-content/uploads/2017/05/Aurelie_olivia_Daniel-570x428.jpg  570w,
                 https://aidantattitude.fr/wp-content/uploads/2017/05/Aurelie_olivia_Daniel-750x563.jpg  750w"
                data-src="https://aidantattitude.fr/wp-content/uploads/2017/05/Aurelie_olivia_Daniel-360x270.jpg"
        >
    </a>
</figure>

Dans un premier temps, j'ai pensé que IE11 avait un support limité pour
<img src="data:image/gif;base64,R0lGODlhBAADAIAAAAAAAAAAACH5BAEAAAAALAAAAAAEAAMAAAIDhI9WADs=" />
Apparemment d'après cette adresse URL, c'est le cas :
https://www.caniuse.com/#search=data%20uris
Mais pas seulement. Quand on tente d'afficher uniquement l'image du code ci-dessus avec Firefox ou Chrome, aucune image n'apparait.
Conclusion ce "data" a été tronqué.
Mais Firefox et Chrome sont plus intelligents que IE11. Comme ce code ne fonctionne pas, ils se rabattent sur les données de l'attribut data-srcset
Quel intérêt d'utiliser "data:image/gif" ?
Il suffit de le remplacer par la première valeur de data-srcset ("...Aurelie_olivia_Daniel-360x270.jpg")

Après, il faut être réaliste ! Quel est le taux d'utilisation d'IE11 sur Internet ?
2 ou 3%. Et Microsoft "itself" conseille d'utiliser Edge.
Bon je te laisse avec TON IE11.

P.S. : Quand on regarde le code source de la page (Touche Ctrl-U) ça pique vraiment les yeux (link rel="stylesheet" et javascript à gogo). C'est pas top WP Smiley fache
Modifié par bazooka07 (27 Jun 2018 - 19:19)
@bazooka07 merci pour ta réponse. Je file de ce pas regarder mon code. Ça me fait grave ch... IE. Mais que veux-tu, c'est un site que "j'administre" comme je l'ai dit dans mon message initial, c'est mon client qui veut que son site soit aussi d’équerre sur ie. Si ça ne tenait qu'à moi, je n'aurais même pas posté ici Smiley langue

Je reviens dès que je peux...
Bonjour, merci @bazooka07 pour tes éclairages. J'ai effectivement nettoyé le code des images en le laissant au plus simple :

<img src="monimage.jpg" width:""  height=""  />


Et miracle, ça marche !
Modifié par jomsi (02 Jul 2018 - 06:17)