Responsive et taille des images

[detectimmobilier]

Bonjour,
Est il conseillé de supprimer en HTML la taille des images indiquées par défaut, même lorsque celle ci est identique à la taille d'origine ?
J'ai lu 2 avis contradictoires, GTMETRIX recommandant de l'afficher.

Vos avis svp

 

[frenchhorn]

salut

si tu veut que tes images soient responsive, il y a une solution:

- ne pas mettre les dimensions dans le html : <img src="" alt="" />
- détecter la résolution du navigateur en JavaScript et proposer une version redimensionnée en fonction de la résolution, avec un système de cache pour ne pas avoir à redimensionner à chaque fois...cela nécessite une réécriture d'url pour que toutes tes images soient interpretées et redimensionnées par un script, du genre redim-img.php

Le gros avantage en plus du responsive, c'est que tu peut proposer des images légères en terme de Ko pour les navigateurs mobiles, et ça c'est vraiment essentielle, même en 4G

 

[Bigb06]

On peut garder au final une seule image si celle ci est optimisée avec les outils dont on a déjà beaucoup parlé sur ce forum : imageoptim, jpeg mini ... Y compris des techniques telles qu'agrandir l'image est mettre un taux de qualité à 0% pour les jpeg : http://www.vanseodesign.com/web-design/compressive-image-tests/

 

[detectimmobilier]

J'ai opté en CSS pour

img
max-width:100%
heigh:auto;
et enlever toute référence en HTML à la taille des images
Ca marche très bien

Ce que je ne comprends pas c'est la recommandation contradictoire de GTmetrix dans sa rubrique SPEED
The following image(s) are missing width and/or height attributes. 8O 8O

 

[zeb]

voir aussi pour les miniatures, la mise en cache et l'encodage base 64

 

[poupilou]

et enlever toute référence en HTML à la taille des images

Je trouve que c'est une aberration htmlilstique que d'enlever la taille des images dans le code html pour faire "plaisir" aux mobinautes, ces derniers n'ont qu'à surfer à partir d'un ordinateur ou s'abstenir de surfer avec un appareil qui se nomme : TELEPHONE !

Téléphonons avec un téléphone et surfons sur internet avec un ordinateur ou une tablette !

 

[p0k3]

Téléphonons avec un téléphone et surfons sur internet avec un ordinateur ou une tablette !

Plus sérieusement, négliger les téléphones, c'est négliger plus de 50% du trafic de son site !

Sinn, pour répondre à la question, garder les balises html et surclasser en CSS pour les mobiles (c'est mon avis)

 

[detectimmobilier]

Oui c'est ce que je vais faire

 

[zeb]

50% du trafic de son site !

Bah ton site est vraiment pourri en desktop si tu en est là ou alors t'a une thématique de geek.

Sérieusement pour les photos sur mobile la question a ce poser ne concerne pas le terminal mais la nature du cliché :!:
Si c'est un truc comme le machin immonde sur le post au dessus faut balancer du 320px de large c'est suffisant, maintenant si vous envoyez une photo un tant sois peu travaillée qui représente autre chose qu'un chaton la faut mettre du px les gars ...

Il y a des photos qui se regardent et d'autres qu'on a vu la vrai différence utilisateur elle est là.

@ detectimmobilier > si par exemple ta question portait sur un site en rapport avec ton pseudo donc "immobilier" tu peux m'envoyer des photos basse définition le seul résultat que tu aura c'est que je vais me casser de ce site car j'achète pas une maison avec 4 pixels d'illustration. Que je sois sur mobile ou pas.

 

[p0k3]

Bah ton site est vraiment pourri en desktop si tu en est là ou alors t'a une thématique de geek.

J'ai une thématique de Geek, mais les stats parlent d'une augmentation du trafic mobile !

Autre point important, n'oubliez pas que les écrans sont de plus en plus performant sur mobile.
Donc, n'hésitez pas à doublez la taille de vos images par rapport à ce que vous souhaitez afficher :
(Ex: Je veux afficher une image sur 300px de large et 200px de hauteur, mon image devrait faire 600px de large et 400px de hauteur )

 

[zeb]

mais les stats parlent d'une augmentation du trafic mobile !

Oui ça c'est pas une nouveauté je suis passé de 2/3% a un peut plus de 12% en 3/4 ans donc oui ça bouge c'est évident mais dire que le mobile c'est 50% du traf c'est exagéré et ça ne touche pas tous les secteurs.

 

[frenchhorn]

Il y a des photos qui se regardent et d'autres qu'on a vu la vrai différence utilisateur elle est là.

oui tu a 100% raison sauf que les utilisateur mobile ne surfent pas en s'attendant à voir des images de folies, sur du mobile ce qui compte c'est que cela soit mobile, accessible partout...Et surtout d’accéder au contenu rapidement, donc des images légères, en même avec imgoptim ou autre optim, une grande image restera toujours trop lourde pour du mobile !

Quand je suis sur du mobile, ce qui compte c'est le responsive, et de ne pas passer ma vie à zoomer, ca c'est chiant, et j'accepte volontiers des images redimensionnées à la volée un peu n'importe comment, pourvue qu'elles s'adapte à mon écran de mobile.

Donc je suis à peu près certain que mon précédent post est la meilleure solution pour les mobiles. Oui la librairie GD est couteuse lors du redimensionnement, mais font mettre les images redimensionnées en cache, c'est con comme la lune...

C'est un codeur qui vous parle, mais c'est absolument nécessaire de proposer des images de poids léger aux mobiles et sa version avec tout plein de pixels pour le desktop ! C'était pas vrai il n'y a que ne serait ce que 2 ans, mais plus maintenant !

 

[zeb]

qui compte c'est que cela soit mobile, accessible partout...!

Oui ça c'est compris.
Une photo (une vrai pas le truc au dessus) soit elle est bonne soit elles est inutile.

le mobile / desktop c'est toujours la même histoire .... ce qui est une mauvaise idée c'est de penser que tout est "faisable sur mobile" c'est pas qu'une question de taille ...

 

[VeeTouine]

c'est pas qu'une question de taille ...

C'est ceux qui en ont une petite qui disent ça :mrgreen:

Pour ma part, 32% d'utilisateurs mobiles + tablettes en mars (e-commerce).

 

[zeb]

C'est ceux qui en ont une petite qui disent ça