12 novembre 2016

match media et mediaquery en javascript

utilité: charger images basses résolution ou moyenne résolution ou haute résolution en fonction taille écran

en effet dans une animation il vaut mieux utiliser une image.png que image.svg pour les  sprites mobiles et garder image.svg pour le fond ( quoique je ne sais pas si le fond est redessiné a chaque requestframe)

http://www.alsacreations.com/article/lire/1500-matchmedia-javascript-media-queries.html

http://www.javascriptkit.com/javatutors/matchmediamultiple.shtml

http://plnkr.co/edit/wAKFEFz0NU6ZaEmywlgc?p=preview

 https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia

Posté par pierreflash à 17:48 - - Commentaires [0] - Permalien [#]
Tags : , ,

04 janvier 2015

animation et resolution d'ecran

résolution ecran,webdesign,html,css,site web,animation,svg,png,création site web,4k,ultrahd,hdtv

voici les principales résolutions d'écran

SD 720*576

HD:1366 x 768 px  hdtv: 1280*726

full HD:1920 x 1080 px hdtv 1080:1920*1080

1920 x 1200 px 16/10eme

WQHD: 2560 x 1440 px

ultraHD : 3840 x 2160 px 

4K:4096*2160

5K:5120 x 2880 px

dans une animation soit on utilise une image vectoriel .SVG donc on se fiche de la resolution mais le probleme contrairement au plugin flashplayer qui lisait à merveille les animations vectorielles les navigateurs moulinent un peu avec image SVG ( surtout si il y en a beaucoup) les images format SVG sont assez lourdes ( comptez 5Mo contre 500ko pour png) les artistes web fournissent surtout  image au format AI ( adobe illustrator) or la conversion AI SVG degrade souvent l image

soit on utilise image .png mais dans ce cas il faut prevoir resolution suffisament elevee pour pas degrader l image et avoir pixelisation lors de l  affichage donc on peut utiliser 5120 en largeur on est trnaquille pour un bout de temps lol

en faisant responsive web design on peut prevoir une image pour different resolution ecran

 

peut etre que la puissance des portables augmentant on resortira le flashplayer dans quelque temps on sait jamais( faut reconnaitre que le flashplayer consomme pas mal de la puissance uc et mettait les portables et meme tablette à genoux)

http://www.gatinel.com/recherche-formation/acuite-visuelle-definition/acuite-visuelle-exemples-concrets/

Posté par pierreflash à 15:39 - - Commentaires [0] - Permalien [#]
Tags : , , ,