Oyé la communauté,
Pour mon premier post par ici, j'ai une requête à vous soumettre...
J'ai développé mon site perso en responsive dernièrement et je cherche à l'améliorer un peu notamment en implémentant un slider (flexslider) pour la page "portfolio". Bon jusque là rien de bien sorcier, on lit la doc, on applique et le slider fonctionne, rien à redire.
Cela dit, pour les versions mobiles et tablettes, problème de poids oblige, j'aimerais ne pas charger le slider et/ou n'afficher qu'une seule image ou lieu de 3 car même en utilisant adaptive image, 21 images au lieu de 7, ça pèse et ça alloooonge les temps de chargement pour des connexions 3G (Pour le moment, ma page fait à peu près 350kb sur smartphones, "ce qui est bien mais pas top", mais avec un slider, aie aie aie...).
J'ai bien lu le très bon article de Raphael sur le site webdesignfriday http://wdfriday.com/blog/2012/04/introduction-a-la-performance-pour-le-web-mobile/#comments qui donne une technique pour ne pas charger un script ou changer une image mais à l'usage, ça ne marche pas sur mon site. (Ich bin une buse en js...)
J'ai lu aussi sur le conditionnal loading mais j'ai pas réellement saisi la technique. (ouais, jsuis pas loin d'être un gros noob en js donc bon...)
Sinon, j'ai cru comprendre qu'avec un mobile-detect, on pouvait poser une condition en php pour ne charger qu'une image selon le device. J'ai lu que c'était faisable mais pas vu d'exemple concret. Es-ce une solution viable ? Si oui, ça marche comment ?
Voilà, beaucoup de questions pour un premier post (désolé hein) mais j'espère que des gens avisés éclaireront ma lanterne.
D'avance, merci !
Pour mon premier post par ici, j'ai une requête à vous soumettre...
J'ai développé mon site perso en responsive dernièrement et je cherche à l'améliorer un peu notamment en implémentant un slider (flexslider) pour la page "portfolio". Bon jusque là rien de bien sorcier, on lit la doc, on applique et le slider fonctionne, rien à redire.
Cela dit, pour les versions mobiles et tablettes, problème de poids oblige, j'aimerais ne pas charger le slider et/ou n'afficher qu'une seule image ou lieu de 3 car même en utilisant adaptive image, 21 images au lieu de 7, ça pèse et ça alloooonge les temps de chargement pour des connexions 3G (Pour le moment, ma page fait à peu près 350kb sur smartphones, "ce qui est bien mais pas top", mais avec un slider, aie aie aie...).
J'ai bien lu le très bon article de Raphael sur le site webdesignfriday http://wdfriday.com/blog/2012/04/introduction-a-la-performance-pour-le-web-mobile/#comments qui donne une technique pour ne pas charger un script ou changer une image mais à l'usage, ça ne marche pas sur mon site. (Ich bin une buse en js...)
(function() {
if(screen.width>800) {
var bigjs = document.createElement(‘script’);
bigjs.src = ‘js/jquery.flexslider.js’;
bigjs.type = ‘text/javascript’;
document.getElementsByTagName(‘body’)[0].appendChild(bigjs);
}
})();J'ai lu aussi sur le conditionnal loading mais j'ai pas réellement saisi la technique. (ouais, jsuis pas loin d'être un gros noob en js donc bon...)
Sinon, j'ai cru comprendre qu'avec un mobile-detect, on pouvait poser une condition en php pour ne charger qu'une image selon le device. J'ai lu que c'était faisable mais pas vu d'exemple concret. Es-ce une solution viable ? Si oui, ça marche comment ?
Voilà, beaucoup de questions pour un premier post (désolé hein) mais j'espère que des gens avisés éclaireront ma lanterne.
D'avance, merci !
