{"id":1150,"date":"2013-01-17T20:00:59","date_gmt":"2013-01-17T18:00:59","guid":{"rendered":"http:\/\/blog.stephaniewalter.fr\/?p=1150"},"modified":"2013-01-18T09:59:07","modified_gmt":"2013-01-18T07:59:07","slug":"des-pixels-et-du-code-45","status":"publish","type":"post","link":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-45\/","title":{"rendered":"Des pixels et du code #45"},"content":{"rendered":"
Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 13 ans. Il se peut qu'il ne soit plus \u00e0 jour.<\/div>

Encore une nouvelle semaine de liens tr\u00e8s utiles avec beaucoup d’articles de fond pour les graphistes traitant de comment collaborer avec un designer, d’exp\u00e9rience utilisateur des sliders et de la barre de navigation iOS, un article pour apprendre le CSS et HTML avanc\u00e9 et quelques excellents tutoriels (utilisation de la propri\u00e9t\u00e9 clip() ) et outils CSS et responsive pour les designers et int\u00e9grateurs web.<\/p>\n

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

#Photoshop<\/p>\n

Exporting from Photoshop<\/a> pas vraiment un tutoriel, mais un ensemble de petits conseils sur comment exporter ses \u00e9l\u00e9ments de design depuis Photoshop<\/p>\n

#CSS<\/p>\n

Understanding the CSS Clip Property<\/a>, un article pour comprendre la propri\u00e9t\u00e9 CSS clip() (dont le support est plut\u00f4t bon) et une d\u00e9monstration sous forme d\u2019application de m\u00e9t\u00e9o<\/a> de ce qu\u2019on peut faire avec<\/p>\n

Des ressources utiles<\/h2>\n

#Mobile-design<\/p>\n

The iOS Design Cheat Sheet<\/a> un r\u00e9capitulatif des tailles des \u00e9l\u00e9ments pour les diff\u00e9rents appareils sous iOS, le tout sur une seule page, tr\u00e8s pratique<\/p>\n

#HTML #CSS<\/p>\n

Learn Advanced HTML & CSS with one useful guide<\/a> un guide pour aller plus loin dans l\u2019apprentissage de HTML et du CSS que les tutoriels de base qu\u2019on l\u2019on trouve souvent.<\/p>\n

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

#Webdesign<\/p>\n

Dottedpaper.com<\/a>\u00a0 des pages avec des points \u00e0 imprimer soit m\u00eame pour le design d\u2019interface ou de sites web<\/p>\n

#RWD<\/p>\n

Responsivetools.com<\/a> un petit site qui vous permet d\u2019avoir un aper\u00e7u de votre site sur diff\u00e9rents mobiles existant directement depuis le navigateur<\/p>\n

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

#Retina<\/p>\n

CSS Techniques for Retina Displays<\/a> : remplacement d\u2019images en CSS via media queries, font icon, utilisation de SVG ou remplacement d\u2019images en JS, 4 techniques pour g\u00e9rer le retina sur votre site web<\/p>\n

#Inspiration<\/p>\n

365supers.blogspot.be<\/a>365 dessins de super h\u00e9ros originaux dans diff\u00e9rents styles<\/p>\n

#Design #ic\u00f4nes<\/p>\n

Behind the scenes: Reinventing our Default Profile Pictures<\/a> le processus cr\u00e9atif et r\u00e9flexion derri\u00e8re les nouvelles ic\u00f4nes par d\u00e9faut d\u2019avatar pour 37signals pour remplacer le classique \u201cmonsieur anonyme\u201d petit bonhomme gris<\/p>\n

#Workflow<\/p>\n

Windows workflow for web designers and front end developers<\/a> un excellent article pleins d\u2019outils et de conseils pour un workflow de graphiste \/ designer et d\u2019int\u00e9grateur sous windows. Oui, tous les designers ne sont pas sous mac ;)<\/p>\n

#Webdesign<\/p>\n

The Designer’s Guide To Working With Web Developers <\/a>un petit guide pleins de bonnes pratiques pour travailler en harmonie entre designer et d\u00e9veloppeur (entendez par l\u00e0 int\u00e9grateur \u00e9galement)<\/p>\n

#UX<\/p>\n

How to Make Sliders Not Suck <\/a>\u00a0il faut bien l\u2019avouer, les sliders ne sont pas forcement la meilleur solution en terme de design, cet article plein de bon sens propose des conseils pour les utiliser \u00e0 bon escient<\/p>\n

The Language of the Nav Bar Part I: Back <\/a>\u00a0un article sur la bonne utilisation d\u2019un label appropri\u00e9 sur les boutons de retour en arri\u00e8re sur les interface iOS<\/p>\n

Les d\u00e9mos sympas et impressionnantes<\/h2>\n

#CSS<\/p>\n

fff.cmiscm.com<\/a> un site r\u00e9pertoriant les d\u00e9monstrations CSS3 HTML5 les plus sympas et impressionnantes<\/p>\n

Sidigital.co<\/a> le site d\u2019une agence cr\u00e9ative avec une jolie petite animation. Je pourrais passer des heures \u00e0 d\u00e9cortiquer leur code.<\/p>\n

Et l\u2019image de la semaine \u201cShould you credit the artist?<\/a>\u201d au cas o\u00f9 vous auriez un doute, un petit diagramme qui devrait vous aider<\/p>\n","protected":false},"excerpt":{"rendered":"

Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 13 ans. Il se peut qu’il ne soit plus \u00e0 jour.Encore une nouvelle semaine de liens tr\u00e8s utiles avec beaucoup d’articles de fond pour les graphistes traitant de comment collaborer avec un designer, d’exp\u00e9rience utilisateur des sliders et de la barre de navigation iOS, un article pour apprendre le CSS et HTML avanc\u00e9 et quelques excellents tutoriels (utilisation de la propri\u00e9t\u00e9 clip() ) et outils CSS et responsive pour les designers et …<\/p>\n","protected":false},"author":3,"featured_media":1152,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[105],"tags":[],"class_list":["post-1150","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-veille-liens-utiles"],"yoast_head":"\nDes pixels et du code #45 - par St\u00e9phanie Walter - UX Researcher & Designer<\/title>\n<meta name=\"description\" content=\"Comment faire collaborer graphiste et d\u00e9veloppeur, l'UX des sliders et du boutons de retour, l'utilisation de la propri\u00e9t\u00e9 CSS clip(), outils responsive et CSS avanc\u00e9\" \/>\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-45\/\" \/>\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 #45 - par St\u00e9phanie Walter - UX Researcher & Designer\" \/>\n<meta property=\"og:description\" content=\"Comment faire collaborer graphiste et d\u00e9veloppeur, l'UX des sliders et du boutons de retour, l'utilisation de la propri\u00e9t\u00e9 CSS clip(), outils responsive et CSS avanc\u00e9\" \/>\n<meta property=\"og:url\" content=\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-45\/\" \/>\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=\"2013-01-17T18:00:59+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2013-01-18T07:59:07+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2013\/01\/pixeletcode441.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=\"@https:\/\/bsky.app\/profile\/stephaniewalter.bsky.social\" \/>\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-45\/\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-45\/\",\"name\":\"Des pixels et du code #45 - 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-45\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-45\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2013\/01\/pixeletcode441.jpg\",\"datePublished\":\"2013-01-17T18:00:59+00:00\",\"dateModified\":\"2013-01-18T07:59:07+00:00\",\"author\":{\"@id\":\"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf\"},\"description\":\"Comment faire collaborer graphiste et d\u00e9veloppeur, l'UX des sliders et du boutons de retour, l'utilisation de la propri\u00e9t\u00e9 CSS clip(), outils responsive et CSS avanc\u00e9\",\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-45\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-45\/#primaryimage\",\"url\":\"https:\/\/stephaniewalter.design\/fr\/files\/2013\/01\/pixeletcode441.jpg\",\"contentUrl\":\"https:\/\/stephaniewalter.design\/fr\/files\/2013\/01\/pixeletcode441.jpg\",\"width\":700,\"height\":200,\"caption\":\"Des pixels et du code #45\"},{\"@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\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"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\/3311148a94caa2e5ae146ff1cdf9aaf3a0127a7db0337d8c8cbbfc4a425cab0e?s=96&d=retro&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/3311148a94caa2e5ae146ff1cdf9aaf3a0127a7db0337d8c8cbbfc4a425cab0e?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\/https:\/\/bsky.app\/profile\/stephaniewalter.bsky.social\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Des pixels et du code #45 - par St\u00e9phanie Walter - UX Researcher & Designer","description":"Comment faire collaborer graphiste et d\u00e9veloppeur, l'UX des sliders et du boutons de retour, l'utilisation de la propri\u00e9t\u00e9 CSS clip(), outils responsive et CSS avanc\u00e9","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-45\/","og_locale":"fr_FR","og_type":"article","og_title":"Des pixels et du code #45 - par St\u00e9phanie Walter - UX Researcher & Designer","og_description":"Comment faire collaborer graphiste et d\u00e9veloppeur, l'UX des sliders et du boutons de retour, l'utilisation de la propri\u00e9t\u00e9 CSS clip(), outils responsive et CSS avanc\u00e9","og_url":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-45\/","og_site_name":"St\u00e9phanie Walter - Senior UX designer, experte mobile, conf\u00e9rences et articles.","article_published_time":"2013-01-17T18:00:59+00:00","article_modified_time":"2013-01-18T07:59:07+00:00","og_image":[{"width":700,"height":200,"url":"https:\/\/stephaniewalter.design\/wp-content\/blogs.dir\/2\/files\/2013\/01\/pixeletcode441.jpg","type":"image\/jpeg"}],"author":"St\u00e9phanie Walter","twitter_card":"summary_large_image","twitter_creator":"@https:\/\/bsky.app\/profile\/stephaniewalter.bsky.social","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-45\/","url":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-45\/","name":"Des pixels et du code #45 - 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-45\/#primaryimage"},"image":{"@id":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-45\/#primaryimage"},"thumbnailUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2013\/01\/pixeletcode441.jpg","datePublished":"2013-01-17T18:00:59+00:00","dateModified":"2013-01-18T07:59:07+00:00","author":{"@id":"https:\/\/stephaniewalter.design\/fr\/#\/schema\/person\/643a9e5afcb1e550b6f4dca290fbf4cf"},"description":"Comment faire collaborer graphiste et d\u00e9veloppeur, l'UX des sliders et du boutons de retour, l'utilisation de la propri\u00e9t\u00e9 CSS clip(), outils responsive et CSS avanc\u00e9","inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-45\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/stephaniewalter.design\/fr\/blog\/des-pixels-et-du-code-45\/#primaryimage","url":"https:\/\/stephaniewalter.design\/fr\/files\/2013\/01\/pixeletcode441.jpg","contentUrl":"https:\/\/stephaniewalter.design\/fr\/files\/2013\/01\/pixeletcode441.jpg","width":700,"height":200,"caption":"Des pixels et du code #45"},{"@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":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"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\/3311148a94caa2e5ae146ff1cdf9aaf3a0127a7db0337d8c8cbbfc4a425cab0e?s=96&d=retro&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/3311148a94caa2e5ae146ff1cdf9aaf3a0127a7db0337d8c8cbbfc4a425cab0e?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\/https:\/\/bsky.app\/profile\/stephaniewalter.bsky.social"]}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/1150","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=1150"}],"version-history":[{"count":0,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/posts\/1150\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media\/1152"}],"wp:attachment":[{"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/media?parent=1150"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/categories?post=1150"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/stephaniewalter.design\/fr\/wp-json\/wp\/v2\/tags?post=1150"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}