{"id":885,"date":"2012-09-20T20:00:08","date_gmt":"2012-09-20T18:00:08","guid":{"rendered":"http:\/\/blog.stephaniewalter.fr\/?p=885"},"modified":"2014-03-09T11:58:07","modified_gmt":"2014-03-09T10:58:07","slug":"des-pixels-et-du-code-28","status":"publish","type":"post","link":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/","title":{"rendered":"Des pixels et du code #28"},"content":{"rendered":"
Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 12 ans. Il se peut qu'il ne soit plus \u00e0 jour.<\/div>

Et le mot de la semaine est… \u00ab\u00a0responsive webdesign\u00a0\u00bb ! Des tutoriels, des plugins, des sliders, des solutions pour les images ou pour d\u00e9tecter le User Agent de l’appareil, tout pour vous aider \u00e0 afficher votre site correctement sur mobile. \u00c7a tombe bien, en plus des PSDs iPhone 5 sont diponibles.<\/p>\n

Les tutoriels de la semaine<\/h2>\n

#WordPress<\/p>\n

How To: Make Your WordPress Themes Retina Display Ready <\/a>quelques plugins utiles et th\u00e8mes pour avoir un WordPress dont les images sont en retina sur les appareils qui le supportent<\/p>\n

#RWD<\/p>\n

Big Menus, Small Screens: Responsive, Multi-Level Navigation<\/a> un tutoriel qui propose une solution responsive pour un gros menu \u00e0 trois niveaux<\/p>\n

#Fireworks<\/p>\n

Make a scalable newsletter with Fireworks un tutoriel pour cr\u00e9er le design d\u2019une newsleter dans Fireworks\u00a0<\/a><\/p>\n

#SVG<\/p>\n

Un logo cliquable SVG avec alternatives<\/a>, la version fran\u00e7aise de mon article.<\/p>\n

Des ressources utiles<\/h2>\n

#JS #SVG<\/p>\n

Bonsaijs.org<\/a> une librairie JavaScript pour cr\u00e9e facilement des API graphiques avec un rendu SVG
\n#RWD<\/p>\n

Base<\/a> un framework responsive qui a l\u2019air tr\u00e8s l\u00e9ger<\/p>\n

#Bootstrap<\/p>\n

Bootsnipp.com<\/a> un petit site qui r\u00e9pertorie des bouts de code HTML et CSS pour Bootstrap<\/p>\n

#Googlefont<\/p>\n

Web Fonts Performance: Making Pretty, Fast<\/a>, des conseils et astuces pour optimiser le chargement de vos polices Google Font<\/p>\n

#CSS3<\/p>\n

Table of CSS3 border-radius Compliance<\/a>, un tableau des rendus de border-radius en CSS3 en fonction des navigateurs.<\/p>\n

#iPhone PSD
\n
Ressources vectorielles, PSD, images de l\u2019iPhone5 et autres smartphones<\/a> , tout est dans le titre, des PSD et ressources utiles pour le nouvel iPhone chez Creativ Juiz<\/p>\n

iPhone-5-Template<\/a> une template d\u2019iPhone5 pour pr\u00e9senter vos applications sous un autre angle<\/p>\n

Les outils \u00a0et plugins pour vous faciliter la vie<\/h2>\n

#jQuery<\/p>\n

Allofthelights.js<\/a>, un plugin jQuery pour \u201c\u2018\u00e9teindre la lumi\u00e8re\u201d autour des vid\u00e9os, entendez pas l\u00e0 mettre un arri\u00e8re plan noir.<\/p>\n

Eualize.js<\/a> un plugin pour \u00e9galiser la hauteur ou largeur d\u2019\u00e9l\u00e9ments d\u2019une page web<\/p>\n

#RWD<\/p>\n

Jquerypicture.com<\/a> un plugin jQuery qui utilise <figure> pour faciliter le chargement d\u2019images responsive sur des \u00e9crans et navigateurs plus petits<\/p>\n

Full-screen-responsive-jquery-image-and-content-sliderrslider <\/a>un slider responsive en plein \u00e9cran l\u00e9ger et facile \u00e0 impl\u00e9menter<\/p>\n

Frescojs.com<\/a> un plugin de lightbox responsive<\/p>\n

Responsive jquery image slider plugins<\/a> au cas o\u00f9 vous n\u2019auriez toujours pas trouv\u00e9 de slider responsive qui vous plaise<\/p>\n

#Mobilit\u00e9<\/p>\n

Device.js<\/a> un script qui d\u00e9tect le User Agent de votre mobile et ajoute \u00a0une classe au body en fonction.<\/p>\n

Les articles \u00e0 lire<\/h2>\n

#UX<\/p>\n

Au del\u00e0 du web : le portant de piscine* ou l\u2019exp\u00e9rience utilisateur au quotidien<\/a> un chouette article qui nous rappelle que dans la vie courante, l\u2019exp\u00e9rience utilisateur de certains objets devrait \u00eatre revue, et il en va de m\u00eame pour certains sites webs<\/p>\n

#WordPress<\/p>\n

Les 10 commandements pour bien choisir son plugin WordPress<\/a> , \u00e0 lire, \u00a0mettre en favoris et appliquer pour chaque choix de plugin.<\/p>\n

#Android<\/p>\n

Stock Android Isn’t Perfect: These Are The Things I Can’t Stand About Jelly Bean <\/a>m\u00eame si l\u2019UI et UX d\u2019Android s\u2019am\u00e9liorent, il reste du boulot. Moi c\u2019est avec les icones copier\/coller que j\u2019ai le plus de mal :\/<\/p>\n","protected":false},"excerpt":{"rendered":"

Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 12 ans. Il se peut qu’il ne soit plus \u00e0 jour.Et le mot de la semaine est… \u00ab\u00a0responsive webdesign\u00a0\u00bb ! Des tutoriels, des plugins, des sliders, des solutions pour les images ou pour d\u00e9tecter le User Agent de l’appareil, tout pour vous aider \u00e0 afficher votre site correctement sur mobile. \u00c7a tombe bien, en plus des PSDs iPhone 5 sont diponibles. Les tutoriels de la semaine #WordPress How To: Make Your WordPress …<\/p>\n","protected":false},"author":3,"featured_media":886,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[105],"tags":[],"class_list":["post-885","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-veille-liens-utiles"],"yoast_head":"\nDes pixels et du code #28 - par St\u00e9phanie Walter - UX Researcher & Designer<\/title>\n<meta name=\"description\" content=\"Rresponsive webdesign : des tutoriels, des plugins, des sliders, des solutions pour les images ou pour d\u00e9tecter le User Agent de l'appareil, etc.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Des pixels et du code #28 - par St\u00e9phanie Walter - UX Researcher & Designer\" \/>\n<meta property=\"og:description\" content=\"Rresponsive webdesign : des tutoriels, des plugins, des sliders, des solutions pour les images ou pour d\u00e9tecter le User Agent de l'appareil, etc.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/\" \/>\n<meta property=\"og:site_name\" content=\"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.\" \/>\n<meta property=\"article:published_time\" content=\"2012-09-20T18:00:08+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2014-03-09T10:58:07+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2012\/09\/pixeletcode28.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"700\" \/>\n\t<meta property=\"og:image:height\" content=\"200\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"St\u00e9phanie Walter\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@walterstephanie\" \/>\n<meta name=\"twitter:site\" content=\"@walterstephanie\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"St\u00e9phanie Walter\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/\",\"name\":\"Des pixels et du code #28 - par St\u00e9phanie Walter - UX Researcher & Designer\",\"isPartOf\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2012\/09\/pixeletcode28.jpg\",\"datePublished\":\"2012-09-20T18:00:08+00:00\",\"dateModified\":\"2014-03-09T10:58:07+00:00\",\"author\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf\"},\"description\":\"Rresponsive webdesign : des tutoriels, des plugins, des sliders, des solutions pour les images ou pour d\u00e9tecter le User Agent de l'appareil, etc.\",\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/#primaryimage\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/files\/2012\/09\/pixeletcode28.jpg\",\"contentUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2012\/09\/pixeletcode28.jpg\",\"width\":700,\"height\":200},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#website\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/\",\"name\":\"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.\",\"description\":\"Je partage ici mes conseils, mes ressources et outils sur la conception centr\u00e9e utilisateur, la recherche et tests utilisateur, le design de produits, la strat\u00e9gie mobile, l'utilisabilit\u00e9 et l'accessibilit\u00e9.\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/stephaniewalter.design\/fr\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf\",\"name\":\"St\u00e9phanie Walter\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/f383c6a4dc55e331bbe2987b622cee6b?s=96&d=retro&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/f383c6a4dc55e331bbe2987b622cee6b?s=96&d=retro&r=g\",\"caption\":\"St\u00e9phanie Walter\"},\"description\":\"UX Researcher & Product Designer. Mobile Expert. Public speaker. Blog writer. Google Dev Expert Web Platform and Product Design (GDE)\",\"sameAs\":[\"https:\/\/stephaniewalter.design\/\",\"https:\/\/www.linkedin.com\/in\/stephaniewalterpro\/\",\"https:\/\/x.com\/walterstephanie\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Des pixels et du code #28 - par St\u00e9phanie Walter - UX Researcher & Designer","description":"Rresponsive webdesign : des tutoriels, des plugins, des sliders, des solutions pour les images ou pour d\u00e9tecter le User Agent de l'appareil, etc.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/","og_locale":"fr_FR","og_type":"article","og_title":"Des pixels et du code #28 - par St\u00e9phanie Walter - UX Researcher & Designer","og_description":"Rresponsive webdesign : des tutoriels, des plugins, des sliders, des solutions pour les images ou pour d\u00e9tecter le User Agent de l'appareil, etc.","og_url":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/","og_site_name":"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.","article_published_time":"2012-09-20T18:00:08+00:00","article_modified_time":"2014-03-09T10:58:07+00:00","og_image":[{"width":700,"height":200,"url":"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2012\/09\/pixeletcode28.jpg","type":"image\/jpeg"}],"author":"St\u00e9phanie Walter","twitter_card":"summary_large_image","twitter_creator":"@walterstephanie","twitter_site":"@walterstephanie","twitter_misc":{"\u00c9crit par":"St\u00e9phanie Walter","Dur\u00e9e de lecture estim\u00e9e":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/","url":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/","name":"Des pixels et du code #28 - par St\u00e9phanie Walter - UX Researcher & Designer","isPartOf":{"@id":"https:\/\/stephaniewalter.design\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/#primaryimage"},"image":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/#primaryimage"},"thumbnailUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2012\/09\/pixeletcode28.jpg","datePublished":"2012-09-20T18:00:08+00:00","dateModified":"2014-03-09T10:58:07+00:00","author":{"@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf"},"description":"Rresponsive webdesign : des tutoriels, des plugins, des sliders, des solutions pour les images ou pour d\u00e9tecter le User Agent de l'appareil, etc.","inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-28\/#primaryimage","url":"https:\/\/stephaniewalter.design\/fr\/files\/2012\/09\/pixeletcode28.jpg","contentUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2012\/09\/pixeletcode28.jpg","width":700,"height":200},{"@type":"WebSite","@id":"https:\/\/stephaniewalter.design\/fr\/#website","url":"https:\/\/stephaniewalter.design\/fr\/","name":"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.","description":"Je partage ici mes conseils, mes ressources et outils sur la conception centr\u00e9e utilisateur, la recherche et tests utilisateur, le design de produits, la strat\u00e9gie mobile, l'utilisabilit\u00e9 et l'accessibilit\u00e9.","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/stephaniewalter.design\/fr\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"fr-FR"},{"@type":"Person","@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf","name":"St\u00e9phanie Walter","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/f383c6a4dc55e331bbe2987b622cee6b?s=96&d=retro&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/f383c6a4dc55e331bbe2987b622cee6b?s=96&d=retro&r=g","caption":"St\u00e9phanie Walter"},"description":"UX Researcher & Product Designer. Mobile Expert. Public speaker. Blog writer. Google Dev Expert Web Platform and Product Design (GDE)","sameAs":["https:\/\/stephaniewalter.design\/","https:\/\/www.linkedin.com\/in\/stephaniewalterpro\/","https:\/\/x.com\/walterstephanie"]}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/885","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/comments?post=885"}],"version-history":[{"count":0,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/885\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media\/886"}],"wp:attachment":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media?parent=885"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/categories?post=885"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/tags?post=885"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}